用 TRAE SOLO 从零打造了一款古风占卜小程序「春风」，用户输入困惑后，道长会掐指一算、递上锦囊，给出六十四卦解析和人生寄语。整个程序是一个单 HTML 文件，可在微信中直接发送分享，无需服务器。
## 背景
作为一名对传统文化感兴趣的程序员，我一直想做一款有中国古典美学的占卜应用。传统占卜应用要么太商业化，要么缺乏仪式感。我希望用 SOLO 打造一个有温度、有仪式感的"问卦"体验——就像真的在向一位智者请教人生困惑。
## 实践过程
### 需求拆解
我设计了5个页面的渐进式流程：
1. **问候页** — 道长问"看道友满目愁容，为何事烦心啊？"
2. **输入页** — “写下你心中的困惑”
3. **锦囊页** — 道长递上锦囊，轻触查看天机
4. **解析页** — 锦囊打开，展示卦象、解析、锦囊妙计
5. **寄语页** — 道长寄语，祝福用户
### 技术实现
**核心功能：**
- 六十四卦数据库 + 基于时辰的伪随机算法
- NPC 三种姿态切换（问候/掐指一算/递锦囊）
- 打字机效果 + 锦囊弹出动画
- 花瓣飘落、粒子特效
- 全屏单页切换，无滚动
**使用 SOLO 的能力：**
- 让 SOLO 生成完整的 HTML/CSS/JS 代码
- 让 SOLO 设计古风 UI 样式（牌匾、锦囊、结果卡片）
- 让 SOLO 编写六十四卦数据和占卜逻辑
- 让 SOLO 将图片转为 base64 内嵌，实现单文件分发
### 踩过的坑
1. **页面切换问题**：最初用"同位置替换"的方式切换内容，后来改成5个独立全屏页面，体验更好
2. **NPC 立绘层级**：需要让 NPC 层跨页面共享，避免每个页面重复加载图片
3. **图片内嵌**：为了让程序能在微信中直接分享，需要把图片转成 base64 内嵌到 HTML 中
## 成果展示
完整程序是一个约 750KB 的 HTML 文件，包含所有 CSS 样式、JavaScript 逻辑和 3 张 NPC 立绘图片（base64 内嵌）。
## 效果与总结
### 提效效果
- **传统开发**：需要前端 + UI设计 + 后端，预计 2-3 天
- **用 SOLO**：从需求到完成约 2 小时，包括调试和优化
### SOLO 的作用
- 生成了 100% 的代码（HTML/CSS/JS）
- 设计了古风 UI 样式
- 编写了六十四卦数据和占卜算法
- 帮助调试页面切换和动画问题
- 将图片转为 base64 实现单文件分发
-–
> “遇事不决，可问春风。” —— 希望这款小程序能帮助大家在迷茫时找到一点方向和慰藉。