推文

@Kubai087 · 2026-10-12 23:04

这是我花了三天时间，只靠代码与产品设计资产，纯口述产出的官网 ✨ 官网：https://lumno.kubai.design/ 分享下我的心得 ⬇️ 1. 用好产品的设计资产：在设计 Lumno 时，我几乎从 0 打造了一套组件库，从功能、内容自适应到样式。这套东西也可以应用在官网上。 2. 拆解，并让 Opus 自己找竞品：Opus 搜刮竞品的能力很强，且大多数时候很能 Get 到竞品的优秀点。比如我想做 Footer，我可以让他直接参考 Racycast，或者去 Product Hunt 上找 10 个 Top Mac 应用，分析其官网的 footer 构成。【不要怕自己没有 Taste，只需要让 AI 逐个去找网站每个部分中最好的参考即可】 3. 引导阅读顺序：首屏提出品牌主张+强 CTA 转化按钮；Section2 放核心卖点。以此类推，补充用户背书、惊喜小功能等，FAQ 聚焦 Github 或用户群里的高频问题，最后 Footer 前再把首屏放一次——好比 PPT 末尾需要再次 call back。 4. 基于优化 SEO 的思想组织内容：如果你不知道网站放哪些内容，就让 Opus 输出一个通用的能满足 SEO 要求的模板，然后再去手动加内容。可以多看看 @loki_yan_seo 老师的推文。 5. 善用 SVG 动画：Opus 5.5 的动画能力很强，可以让它基于产品功能直出演示小动画/截图。 6. 考虑移动端，特别是 iPhone 用户的阅读体验：iOS 的浏览器基本都是 Webkit 套壳，即使是在微信打开，亦是如此。你在 Chromium 浏览器上看到的样式，未必能正常工作。 7. 写“好”文案：Claude 写的 AI 味重，就让他去参考 Apple 的文案。官网首页，让他去学习广告文案怎么写、怎么说明痛点、怎么抖包袱、怎么呼应诉求；Wiki 文案，让他学习专业的组件库、设计规范文档。 8. 做好多语言：让 AI 意译，甚至可以基于目标语言人群的文化志趣、表达习惯、网络热梗来自由修改。 #VibeCoding #Web

曝光 1996 · 评论 6 · 点赞 35 · 书签 35 · 曝光/时 247.83523499616737