已验证 · 可安装 Agent Skill
SKILL.md + .skill把这套方法装进你的 Agent。
npx skills add LearnPrompt/goodcaseai --skill portfolio-story-architecture --global --copy --yes --full-depth加载中…
Skill · 跨作者通用方法
围绕创作者定位、代表作品和可信证据安排个人站的叙事顺序。
已验证 · 可安装 Agent Skill
SKILL.md + .skillnpx skills add LearnPrompt/goodcaseai --skill portfolio-story-architecture --global --copy --yes --full-depth方法骨架
作者证据
Case 证据
@DevBySami 使用 GPT-5.6 Sol · ShioriCode完成的网页案例,包含公开结果、完整 Prompt 与原始来源。
提示语
GPT-5.6 Sol 在不使用 Codex harness 时做 UI 好得多。 它用下面这条提示生成了这个软件机构落地页: 为一家位于日本东京的软件机构设计一个漂亮的落地页。 使用的 Harness:ShioriCode。
@shushant_l 使用 AI Website Builder完成的网页案例,包含公开结果、完整 Prompt 与原始来源。
提示语
下面介绍如何用 AI 以极简设计风格创建你的网站。 使用这条提示:为一位数字创作者和 AI 顾问设计一个现代极简作品集网站。采用干净的黑、白和中性色调,不使用渐变、玻璃拟态或过度的视觉效果。注重简洁、留白、强有力的排版、清晰的层级和快速加载性能。加入首屏介绍与行动号召、关于版块、精选项目作品集、服务版块、客户评价、博客/文章预览、技能与工具展示、客户 Logo、联系表单和页脚。加入细微动效、平滑滚动、优雅的卡片布局、移动端优先的响应式设计,以及对 SEO 友好的结构。整体美
提示语
ChatGPT 上的 GPT iMAGE 2 提示词: 在一张大幅白色画布上设计一个极简早期互联网风格的个人档案网页 / 数字作品集落地页,留出充裕的负空间,并配一圈细薄的粉彩粉色浏览器风格边框。中央放置 [SUBJECT] 的黑白编辑肖像,带柔和胶片颗粒、细微扫描纹理和低反差摄影色调。 在肖像周围散布档案元数据标签和小型星号项目符号,采用不对称排列,呈现俏皮个人简历的感觉。加入如下描述: ✦ 创作者 ✦ 模特 ✦ 造型师 ✦ DJ ✦ 女孩 ✦ 摄影师 ✦ 收藏家 ✦
提示语
非常令人印象深刻的 @Zai_org GLM 4.7 网站设计 提示词一: 我想让你真正展示出你的能力 这是我第一次使用你,所以我想了解你的能力,以及你能为我展示什么,尤其是从视觉设计角度来说 你可以使用技能,请先运行这些 - 「openskills read zai-cli」 - 「openskills read dev-browser」 提示词二: 我觉得你可以做得比那更好。周围可以打磨得更精致一些。那看起来只是想炫技,实际效果并不太好。请进行深度思考。 最终提
@DrilonAjdinii 使用 Leylo AI完成的网页案例,包含公开结果、完整 Prompt 与原始来源。
提示语
位于哥本哈根的建筑事务所网站。 使用 @LeyloAI 一次生成 这是我使用的提示词: 一家名为「Oren Studio」的精品建筑事务所,位于哥本哈根,专注于可持续住宅设计。用大型编辑摄影展示 4 个精选项目。采用温暖的有机美学、泥土色调、充裕留白和电影感衬线字体。加入包含创立故事的关于版块和联系表单。 将任何设计 UI 转移到你的无代码构建器中。
@DeepakNesss 使用 Claude Sonnet 5完成的网页案例,包含公开结果、完整 Prompt 与原始来源。
提示语
Claude Sonnet 5 有一种有趣的前端设计品味,我很喜欢。 只用这一个提示词构建: > 创建一个外观惊艳的个人网站,让我可以介绍自己、展示项目和其他内容。使用虚拟数据。
@Oluwaphilemon1 使用 Claude Fable 5 · Three.js · Blender · GSAP完成的网页案例,包含公开结果、完整 Prompt 与原始来源。
提示语
Claude Fable 5 和 GPT-5.6 很强🥵🥵🥵 下面是我如何使用 Claude 构建的 👇 提示词:「设计一个机构网站,把服务以 3D 超市商品包装的形式呈现」 使用 Three.js 和 WebGL 在浏览器中实时渲染所有产品 使用 Blender 制作包装模型,然后导出为 GLTF 以加载到 Three.js 中 使用 GSAP 实现流畅的产品旋转和悬停交互 如果你想做一个让客户感觉像是在购买高级商品的作品集,请保存这条 🛒
@Preda2005 使用 ChatGPT Image 2.0完成的网页案例,包含公开结果、完整 Prompt 与原始来源。
提示语
我使用 ChatGPT Image 2.0 设计了整个网站。 这真的太疯狂了。🤯 它不只是生成了一个布局…… 它理解了我的风格、我的工作和我的故事。 提示词: 「基于你所了解的关于 Marcio Lima,也就是 @Preda2005 的一切,创建一份关于其工作的详细信息图,并设计一个现代、高端的个人网站。」
提示语
技巧 4:电影人的网站 你可以使用这个 Prompt 为电影人生成一个艺术化网站 网站链接: Prompt: 为一位电影导演创建一个艺术化、电影感的作品集网站。首页应展示来自其影片的全屏背景视频或图像蒙太奇,配合戏剧化打光和有情绪的色调。使用粗衬线字体呈现导演姓名,并配上一句简短标语,例如:用光与静默讲故事。 添加一个精选影片版块,用海报或剧照展示;每个项目都应打开一个整页案例研究,包含预告片、剧情梗概、导演手记和幕后照片。 加入一个 About 版块,包含诗意的
提示语
摄影师作品集网站 Dora AI 提供许多不同的设计风格可供选择,从 art deco 到 futuristic neon。 Prompt:摄影作品集网站的 landing page,多重曝光,深青色与浅琥珀色,Leica,图像,人物肖像,金色光线
@shushant_l 使用 AI Website Builder完成的网页案例,包含公开结果、完整 Prompt 与原始来源。
提示语
下面介绍如何用 AI 创建 Netflix 风格的个人作品集网站。 使用这个 Prompt:设计一个受 Netflix 视觉语言启发、但重新想象为未来感 3D 美学的电影感个人作品集网站。使用暗色高级界面,加入沉浸式纵深、玻璃拟态、悬浮 3D 卡片、动态灯光、平滑视差滚动、动画渐变、全息效果和极其高级的微交互。首页应包含一个巨大的 Hero 区域,用醒目的个人品牌宣言开场;之后采用 Netflix 风格的横向内容行,以互动 3D 瓷片展示项目、案例研究、技能、成就、评价和职
提示语
下面介绍如何用 AI 创建个人作品集和数字商店网站。 使用这个 Prompt:只使用黑、白、灰单色调,创建一个将个人作品集与数字产品商店结合起来的高级移动应用,整体采用超极简风格,绝不使用渐变、玻璃拟态、阴影或装饰元素。专注于清晰字体、充裕留白、简洁几何布局、直观导航和精致的编辑风格。包含主屏幕、作品集展示、项目详情、数字产品市场、产品页、购物车、结账流程、About 版块、评价和联系页面。使用细微微交互、极简图标、平滑转场和清晰的视觉层级,创造奢华、现代、无干扰的体验,让