供团队内部审阅,不作为最终网站内容

六个模块,一条完整的产品叙事。

Product 保持连续页面,About the Team 单独成页。第三版简化固定页内导航,合并反思与现实跟进,将成长记录、徽章和社区分享整合到相应内容中。视频按最新要求放在最后,首屏仍有直接入口。各模块标题和介绍统一左对齐。

页面顺序与最终画面

模块要讲清楚什么画面安排
Overview产品是什么、服务谁,以及儿童表达与家长回应之间的沟通需要。研究背景、两个需求及简洁流程。
Create story生活信息输入、AI 整理与故事设置、家长审核修改。3 个纯色手机界面占位。
Read story通过互动选择、多重视角和家长提示促进共同阅读与表达。1 个纯色 iPad 占位;后续可在此组织多张阅读界面。
Reflect & follow up从故事中的想法到现实尝试,再到反馈与未来故事。2 个 iPad 占位,分别标出生活问题反馈区、徽章与成长记录区。
Impact儿童表达与情绪学习、家长沟通支持、家庭之间的经验分享。三个并列影响维度与一句项目目的收尾。
Video用完整演示串联整个体验。末尾 16:9 视频 placeholder,明确标注成片尚未加入。

素材与表述边界

Framer 搭建对应

  1. 建立 Product 与 About the Team 两页,共用主导航和页脚。
  2. 建立 overview、create、read、reflect、impact、film 六个锚点;页内导航固定在主导航下并标记当前位置。
  3. 按占位比例替换最终截图。手机端创建区采用截图与说明并排的三行,两个跟进界面上下排列。
  4. 视频准备好后接入最后一个模块;本地示例可通过 film-config.js 配置媒体地址。
  5. 正式上线前移除 Draft 标识和本说明页,补齐团队资料与最终素材。

查看 Product 第三版