加载中…
创作者 · Motion_Viz
查看原始来源 ↗复刻提示词保留原文，另附运行环境、素材与验收要求；附加说明不是原作者原话。
构建出这个网站的确切提示词架构
我没有让 kimi k2「做一个网站」
我给了它一份完整的创意简报：
→ 美学方向（编辑时尚 / 极简奢华）
→ 精确的配色方案，附十六进制色值
→ 字体搭配（cormorant garamond + inter）
→ 组件清单，附交互规格
→ 每个元素的 gsap 动画行为
→ 文件结构
kimi 返回了一份完整的技术蓝图
然后 claude 把这份蓝图变成了干净的生产级代码
两个 AI。一套提示词系统。零 Figma。
结果是：电影感预加载器、磁性按钮、lenis 平滑滚动、视差图片、带混合模式的自定义光标
这就是我现在用于每个客户项目的工作流适用模型与稳定度
建议模型
独立复测证据
2026年8月9日
多人复现
继续探索
@viktoroddy 使用 AntiGravity · Gemini 3.1 Pro完成的网页案例，包含公开结果、完整 Prompt 与原始来源。
提示语
提示词： 构建一个 Hero 区域，具体规格如下： 整体布局： 全宽版块，背景色 #000000（纯黑） overflow hidden 所有内容背后播放背景视频（详情见下） 背景视频： 来源： 自动播放、循环、静音、playsInline 缩放到容器的 120%（宽度和高度均为 120%） 水平居中，焦点锚定在底部 位于所有内容之下（最低层级） 模糊背景元素： 绝对定位，水平居中，顶部偏移约 215px 尺寸：宽 801px × 高 384px，完全圆角（药丸
@Oluwaphilemon1 使用 Claude · Three.js · GSAP完成的网页案例，包含公开结果、完整 Prompt 与原始来源。
提示语
我如何用 Claude 构建它 👇 1. Prompt：“构建一个叙事网站，每个滚动区块都通过流畅的色彩过渡揭示一个新的章节” 2. 使用 Three.js 制作会响应光标的绘画质感背景 3. Prompt：“加入 GSAP ScrollTrigger，让每个区块像电影场景一样进入动画” 4. 使用 Lenis.js 实现高级网站那种丝滑的平滑滚动
提示语
提示词： 构建一个高级电动车落地页，具有深色电影感美学。整个网站使用黑色背景（hsl(0,0%,0%)），配浅色文字（主色 hsl(0,0%,95%)）和橙色强调色（hsl(25,100%,50%)）。不使用默认字体——保持极简和编辑感。使用 shadcn/ui 设计令牌。以下是按顺序排列的各版块： 设计系统（index.css） --background: 0 0% 0% --foreground: 0 0% 12%（用于 CTA 按钮内圆等深色元素） --primar
Case 详情页把原帖效果、Prompt 与复测证据放在同一条阅读路径里。
