Files
2026-09-22 22:51:19 +08:00

2.4 KiB

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