# Smile First 设计元素提取清单

来源：`docs/smile-first-ai-visual-board-5-pages.png`  
尺寸：`1692 x 929`

## 视觉原则

- 首页删除视觉稿里的底部 tabBar，只保留内容区入口与主按钮。
- 首页 `立即预约` 先触发手机号授权检查，授权成功后进入项目选择；确认预约页只展示已授权手机号。
- 页面文案保持口腔护理预约叙事，不使用诊疗、问诊、疗效承诺类表达。

## 色彩 token

| 用途 | 色值 |
| --- | --- |
| 页面背景 | `#F7F2EA` |
| 表面色 | `#FFFDF8` |
| 主文字 | `#12201E` |
| 品牌色 | `#153D37` |
| 主操作 | `#0F6F63` |
| 辅助薄荷 | `#BFE7DE` |
| 雾蓝灰 | `#DDE9EC` |
| 暖强调 | `#AA573E` |
| 次文字 | `#5A706B` |
| 分割线 | `#D9E5DF` |

## 已裁切资产

| 资产 | 输出路径 | 裁切坐标 |
| --- | --- | --- |
| 首页参考屏 | `miniapp/assets/reference/home-screen.png` | `(55, 245, 333, 835)` |
| 项目页参考屏 | `miniapp/assets/reference/projects-screen.png` | `(379, 245, 653, 835)` |
| 日期时间参考屏 | `miniapp/assets/reference/schedule-screen.png` | `(704, 245, 979, 835)` |
| 确认预约参考屏 | `miniapp/assets/reference/confirm-screen.png` | `(1030, 245, 1305, 835)` |
| 成功页参考屏 | `miniapp/assets/reference/success-screen.png` | `(1356, 245, 1630, 835)` |
| 首页笑容主图 | `miniapp/assets/extracted/home-hero-smile.png` | `(56, 309, 332, 562)` |
| 成功勾选图标 | `miniapp/assets/extracted/success-check.png` | `(1430, 322, 1530, 402)` |
| 品牌印章 | `miniapp/assets/extracted/brand-seal.png` | `(1340, 55, 1438, 154)` |
| 首页预约图标 | `miniapp/assets/extracted/icon-calendar.png` | `(112, 668, 146, 704)` |
| 我的预约图标 | `miniapp/assets/extracted/icon-booking-card.png` | `(238, 668, 272, 704)` |
| 底部叶片与瓷碗 | `miniapp/assets/extracted/bottom-leaves-bowl.png` | `(0, 836, 268, 929)` |
| 右下织物材质 | `miniapp/assets/extracted/bottom-right-fabric.png` | `(1308, 802, 1692, 929)` |

预览图：`docs/extracted-assets-preview.png`

## 小程序页面映射

| 视觉稿页面 | 实现路径 |
| --- | --- |
| 首页 | `miniapp/pages/index/index` |
| 选择项目 | `miniapp/pages/projects/projects` |
| 选择日期与时间 | `miniapp/pages/schedule/schedule` |
| 确认预约 | `miniapp/pages/confirm/confirm` |
| 预约成功 | `miniapp/pages/success/success` |
| 我的预约承接 | `miniapp/pages/bookings/bookings` |