GoodCase.aiAI 动态 · Radar↗图谱 · AI Map↗课程 · LearnPrompt↗
出品GoodCase.aiAI News Radar ↗AI Map ↗LearnPrompt ↗
GoodCase.aiGoodCase.aiAI提示语案例合集
GoodCase.ai
排行榜案例Skills收藏投稿早报加入我们
中文EN
Agent 接入 →

出品

AI 动态 · Radar ↗图谱 · AI Map ↗课程 · LearnPrompt ↗
GoodCase.aiGoodCase.aiAI提示语案例合集
排行榜案例Skills收藏投稿早报加入我们
中文EN
Agent 接入 →

加载中…

GoodCase.ai · AI提示语案例合集
DSH 插件榜更新日志反馈
模型创作者Seedance 2.5Seedance 2.0GPT Image 2GeminiNano Banana ProClaudeClaude Opus 5.5Grok ImagineVeoKling 可灵Qwen ImageGPT Image 1.5MiniMax H3
← 全部 Skills

GoodCase 官方 Skill · 跨作者通用方法

个人作品集叙事

围绕创作者定位、代表作品和可信证据安排个人站的叙事顺序。

28 Cases · 14 位作者 · AI 编程(UI) · 最近例证 2026/08/20

Claude Mythos:Lithos 地质品牌 Hero
ChatGPT Image 个人品牌网站视觉稿
早期互联网风个人档案页

已验证 · 可安装 Agent Skill

SKILL.md + .skill

把这套方法装进你的 Agent。

npx skills add LearnPrompt/goodcase-lite --skill portfolio-story-architecture --global --copy --yes --full-depth
下载 .skill ↓查看源码 ↗

安装合约

  • ✓ 标准 SKILL.md frontmatter
  • ✓ 输入、流程、输出、验收、安全边界
  • ✓ 内置 Case 证据与作者署名
  • ✓ 已通过 skill-creator 校验与打包
  • ✓ 已于 2026-10-17 通过 `npx skills add` 真实安装验收

方法骨架

  1. 01一句话说清创作者定位
  2. 02用代表作品而非技能清单证明能力
  3. 03补过程、客户或联系方式形成闭环

为什么形成 Skill

14 位作者的 28 个已发布 Case 出现同一类明确结果,达到跨作者复用门槛。

Case 证据

先看作品,再判断这套方法值不值得学。

展示 12 / 28
AI 设计师作品集
AI 编程(UI)MotionSites收录 2026/08/19

AI 设计师作品集

白底设计工作室单页,React + TypeScript + Tailwind 配 lucide-react 图标,看点在双字体排版体系怎么撑起极简白底的高级感。

Skill · 个人作品集叙事

提示语

使用 React、TypeScript、Vite 和 Tailwind CSS,为名为 "Viktor Oddy" 的创意设计工作室创建一个单页落地页。使用 lucide-react 提供图标。整个页面采用白色背景,并使用两种自定义字体:"PP Neue Montreal"(正文字体,从 Webflow CDN 加载)和 "PP Mondwest"(衬线装饰字体,从本地 /PPMondwest-Regular.woff2 文件加载)。正文默认字体为 PP Neue Montr

来源热度 · MotionSites
—
稳定度
58
查看 Case →
作品集:宇宙
AI 编程(UI)MotionSites收录 2026/08/19

作品集:宇宙

暗色作品集单页,GSAP 与 Framer Motion 双动画库再加 hls.js 视频流,先定全局设计系统再逐区块展开,prompt 结构本身就是模板。

Skill · 个人作品集叙事

提示语

Prompt to recreate this landing page: Build a single-page dark portfolio landing page using React + Vite + Tailwind CSS + TypeScript + GSAP + Framer Motion + hls.js. --- ## Global Design System ### Fonts Google Fonts import: Inter (300–700…

来源热度 · MotionSites
—
稳定度
76
查看 Case →
现代设计机构
AI 编程(UI)MotionSites收录 2026/08/13

现代设计机构

设计机构 Axion Studio 的落地页,hero 背景用 shaders 包做着色器效果,这批里唯一用 WebGL 着色器的。

Skill · 个人作品集叙事

提示语

为 “Axion Studio” 构建一个 React + Vite + Tailwind CSS 落地页——这是一个设计机构网站。英雄区背景使用 `shaders` 包(npm: `shaders`),图标使用 `lucide-react`。页面包含 3 个版块。准确匹配每一处细节: --- ## SECTION 1:HERO(全视口高度) **背景:** 浅灰色 `#EFEFEF`,叠加全屏动画 shader(positioned absolute, inset-0

来源热度 · MotionSites
—
稳定度
92
查看 Case →
作品集:关于我
AI 编程(UI)MotionSites收录 2026/08/13

作品集:关于我

个人站的 About Me 区块,React + framer-motion,Kanit 字体全字重加载,#0C0C0C 暗底。

Skill · 个人作品集叙事

提示语

**提示词:** 使用 React、Tailwind CSS 和 **framer-motion** 创建一个“关于我”section。网站使用 **Google Font "Kanit"**(字重 300-900)和深色背景 `#0C0C0C`。 **Section 布局:** - 全宽 section,`min-h-screen`,flexbox column,双轴居中 - Padding:`px-5 sm:px-8 md:px-10 py-20` - 背景:`#0C

来源热度 · MotionSites
—
稳定度
90
查看 Case →
订阅制创意机构
AI 编程(UI)MotionSites收录 2026/08/13

订阅制创意机构

订阅制创意机构 Alwayzz 的落地 hero,React + Vite,样式刻意用自定义 CSS,避开 Tailwind 工具类。

Skill · 个人作品集叙事

提示语

**使用 React + Vite + Tailwind CSS,为名为 "Alwayzz" 的创意机构创建一个单页落地页 hero section。所有样式均使用自定义 CSS(不要使用 Tailwind utilities)。设计应简约、干净、采用黑白配色,并始终使用紧凑的负字间距。** --- ### 字体(通过 index.html 中的 Google Fonts 加载) ``` Inter: weights 400, 500, 600, 700 Source

来源热度 · MotionSites
—
稳定度
83
查看 Case →
3D Jack 作品集
AI 编程(UI)MotionSites收录 2026/08/13

3D Jack 作品集

3D 创作者 Jack 的作品集落地页,React + TypeScript + Framer Motion,#0C0C0C 暗底。

Skill · 个人作品集叙事

提示语

使用 React、TypeScript、Tailwind CSS、Framer Motion 和 Lucide React,为「Jack」构建一个 3D 创作者作品集落地页。页面采用深色主题(背景为 #0C0C0C),字体使用 Kanit(Google Fonts,字重 300-900)。页面标题为「Jack -- 3D Creator」。 全局样式 html、body、#root 和主容器的背景:#0C0C0C 字体族:'Kanit', sans-serif 全局重置:b

来源热度 · MotionSites
—
稳定度
65
查看 Case →
数字总监
AI 编程(UI)MotionSites收录 2026/08/13

数字总监

作品集落地页的像素级复刻题,技术栈和结构用分隔线排成文档,prompt 本身就像一份规格书。

Skill · 个人作品集叙事

提示语

重现这个完全一致的全视口作品集落地页——实现像素级精确匹配。 ═══════════════════════════════════════ 技术 / 技术栈 ═══════════════════════════════════════ - React + TypeScript + Tailwind CSS + Vite - 图标:lucide-react(`Play`、`Menu`、`X`) - 单个全屏页面:`h-screen w-full overflow-hidd

来源热度 · MotionSites
—
稳定度
82
查看 Case →
Max Reed 作品集
AI 编程(UI)MotionSites收录 2026/08/13

Max Reed 作品集

个人作品集的暗色 Features 区块,React + TypeScript + Tailwind + lucide-react。

Skill · 个人作品集叙事

提示语

Build a full-viewport dark personal portfolio Features section using React + TypeScript + Tailwind CSS + lucide-react. **Layout & Structure:** - Full screen dark background `#0a0a0a`, white text, Inter font with antialiased smoothing - Top…

来源热度 · MotionSites
—
稳定度
92
查看 Case →
创意工作室
AI 编程(UI)MotionSites收录 2026/08/13

创意工作室

全屏 hero,React + Tailwind + Framer Motion + Lucide,Inter 字体,规格逐项精确。

Skill · 个人作品集叙事

提示语

使用 React、Tailwind CSS、Framer Motion 和 Lucide React icons 构建一个全屏 Hero Section。使用 Inter 字体。页面需要完全适配移动端。以下是确切规格: --- **背景:** - 使用一段自动播放、循环、静音的视频作为背景,覆盖整个视口。 - 视频 URL:`https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_2

来源热度 · MotionSites
—
稳定度
88
查看 Case →
Prisma Creative Studio
AI 编程(UI)MotionSites收录 2026/08/13

Prisma Creative Studio

创意工作室 Prisma 的三区块落地页(Hero、About、Features),React + Vite + framer-motion,小而全的整页练习。

Skill · 个人作品集叙事

提示语

为一家名为 "Prisma" 的创意工作室创建一个使用 React + Vite + TypeScript + Tailwind CSS 的落地页。页面包含 3 个部分:Hero、About 和 Features。使用 framer-motion 实现动画,使用 lucide-react 提供图标。设计采用深色、低调且富有电影感的风格,并搭配暖奶油色调色板。 字体 在 index.html 中加载两种 Google Fonts: Almarai(字重:300、400、7

来源热度 · MotionSites
—
稳定度
90
查看 Case →
Bold Studio
AI 编程(UI)MotionSites收录 2026/08/13

Bold Studio

创意机构 VANGUARD 的全屏 hero,React + Tailwind + Vite,单屏加循环视频背景。

Skill · 个人作品集叙事

提示语

使用 React、Tailwind CSS 和 Vite,为名为“VANGUARD”的创意机构构建一个全屏 hero landing page。页面应为一个占满 viewport 高度的单区块,以循环视频为背景,所有内容叠加在其上方。 **背景视频:** 使用以下准确的 CloudFront URL,创建全屏 `<video>` element,带有 `autoPlay`、`muted`、`loop` 和 `playsInline` attributes,并设置为 `obj

来源热度 · MotionSites
—
稳定度
91
查看 Case →
为客户 AP 打造的代理机构风格网站
AI 编程(UI)X收录 2026/08/12

为客户 AP 打造的代理机构风格网站

一个简单的指令式提示,告诉 Gemini 3 Pro 扮演 makemepulse 工作室的角色,为名为 AP 的客户构建一个网站,并注重精细的执行。

Skill · 个人作品集叙事

提示语

你是工作室 {argument name="studio_name" default="makemepulse"}。请为 {argument name="client_name" default="AP"} 构建一个网站。仔细思考,不要出错。

来源热度 · X
3
稳定度
85
查看 Case →

作者实践

创作者版本

同一通用方法下的作者实践,包括尚未在目录上架的版本。

MotionSites · 双字体作品集叙事shushant_l · 内容优先极简

作者证据

方法归纳出来,作者署名仍然留在证据上。

11 CasesMotionSites查看作者 →5 Casesshushant_l查看作者 →1 Casesardadoteth查看作者 →1 CasesDeepakNesss查看作者 →1 CasesDevBySami查看作者 →1 CasesDrilonAjdinii查看作者 →1 CasesEHuanglu查看作者 →1 CasesJayPROb01查看作者 →1 CasesKashberg_0查看作者 →1 CasesMr_AllenT查看作者 →1 Casesnummanali查看作者 →1 CasesOluwaphilemon1查看作者 →

Skill 是派生阅读层,所有判断都必须能回到已发布 Case。