设计稿 → 上线页面
我有设计稿，想自己把它变成真网页
从第一章开始：交给 AI、看懂改动、上线发布。
AI CREATIVE ENGINEER · 设计师的 VIBE CODING 系统课
当答案越来越像
审美才真正开始
你现在卡在哪一步？
喜欢的网站 → 自己的设计系统
我想复刻喜欢的网站，学走它的设计 DNA
复刻名场面，再炼出一份 AI 能读的 DESIGN.md。
能用 → 有辨识度
我做的页面总有一股 AI 味
继续学习 UI Kit、动效语言、声音与生成视觉。
THE COURSE
从 0 到 1，搭建你的商业化项目
七章围绕一个真实项目展开。前一章留下的成果，会直接成为下一章的起点。
01/ 07
真正带走的，是一门手艺和你自己的审美
课程结束，你手里会留下能继续使用的方法，以及一批真实上线的项目。
最重要
一门吃饭的手艺
用 AI 把一个真实项目搭出来、上线、讲清楚，端到端都能自己走完。
随课取用
GoodVibe 素材库
80+ 网页模板、80+ 组件，直接进入你的下一个项目。
自己建立
你的 UI Kit
一套由 Token、组件和使用规则组成的界面基础材料。
真实上线
你的商业化项目
绑定自己的域名，任何人都能打开和验证。
GOODVIBE MEMBERSHIP
课程、模板和源码，都包含在内
先完整学完免费章节。确认这套方法适合自己，再决定是否加入。
终身会员 · 一次付费
¥1,399
登录用于关联购买记录；现在不会直接进入付款。
- 完整系统课程（含未来更新的所有章节）
- 素材课、组件、源码和 Skills
- 持续更新，会员期内全量访问
- 早鸟共创选题投票权
- 优秀作业获小红书曝光
- Studio Pass 会员卡与顺序编号
用任何能写代码的 AI 都能学
课程教的是设计判断和项目方法，不绑定某一个工具。推荐使用 WorkBuddy、Claude Code 或 Codex。
WorkBuddy
默认演示轨。中文界面、免费起步，零基础可以从这里进入。
Claude Code
进阶轨。课程里的工作流、设计规则与 Skills 都能直接复用。
Codex
进阶轨。每课会标注操作差异，切换工具也不会打断学习路径。
做这门课的人，先用这套方法做了这门课
课程网站本身就是教学成果：你正在看的页面，也由课程里的工作流、DESIGN.md 和动效语言产出。
echo
- 6 年海外设计经验，前 BAT 设计师
- 50 万用户、10M ARR AI 应用初创团队设计总监
- Awwwards Honorable Mention
echoecho.spacesunebear
- 10 年编程和产品设计经验
- Vibe Coding & Designing 践行者
- 喜欢手帐风，想给兔宝做交互绘本
work-journey.sunebear.com