留叙拾忆 小程序交互原型 · 全流程
11 个页面 · 完整走查

FULL WALKTHROUGH · 2026

一程山水,
一册家声。

从登录到宗族、人物、往事与大事,再到留言、成员、好友与个人中心。所有页面共用宣纸底色、宋体标题与茶褐主色;本页作为全流程预览入口,可直接按推荐动线走查。

11页面 / 模块
8推荐走查步骤
5功能阶段
1统一视觉体系

STRUCTURE

五个阶段,一条完整动线

从左到右依次是进入、宗族空间、时间档案、关系连接与个人中心。每个阶段下方可直接打开对应页面。

WALKTHROUGH

推荐走查路径

按顺序点击下面的入口,可以完整经历一次「进宗族 → 看族谱 → 读人物 → 记往事 / 设提醒 → 留言互动 → 管理关系」的闭环。

  1. 01

    从授权进入宗族

    点击登录按钮,看到「授权中 → 授权成功」,约 1.5 秒后自动进入宗族主页。

  2. 02

    从族谱走进人物

    首页进入族谱册,切到列表视图,点示例人物 → 修改档案,进入完整人物页。

  3. 03

    核对人物页的双向关联

    切换登录账号看「与本人的关系」;查看关联往事、关联大事提醒;提交修改时核对审批提示。

  4. 04

    走一遍往事记录

    按关系 / 人名 / 事件筛选,新增长辈往事并绑定人物;再回人物页查看往事备注。

  5. 05

    设置一件未来的大事

    查看顶部最近倒计时;新增按年 / 按月 / 按周 / 单次提醒,置顶或标红,检查分区排序。

  6. 06

    宗族成员与公共留言

    管理员视角邀请 / 管理访客;点成员设备注。再到留言页 @ 成员、发图片,切访客看私聊 Tab 是否隐藏。

  7. 07

    进入完全个人的好友空间

    新增联系人、查看好友私聊、创建私人小群,确认与宗族数据完全隔离。

  8. 08

    回到个人中心收尾

    查看加入的宗族并退出、处理好友申请、调整订阅通知、修改昵称。

INVENTORY

页面清单

11 个已完成页面 / 模块。带「模块预览」标记的是独立组件页,需从本总览或对应入口直接打开。

P01已连通

登录 / 授权

印章式 LOGO、微信授权按钮与授权成功反馈,成功后自动进入主页。

入口打开
P02已连通

宗族主页

六宫格功能卡、宗族切换、动态与底部四 Tab,是全流程的枢纽。

枢纽打开
P03已连通

族谱册

四代世系画布、拖拽缩放、分支折叠与列表视图;示例人物可进入完整档案。

宗族打开
P04已连通

人物档案

基础资料、亲属关系、影像、往事备注与关联大事提醒;示例人物示例人物。

宗族打开
P05已连通

往事记录

关系 / 人名 / 事件筛选、搜索、统计、新增 / 编辑表单与多图占位相册。

时间打开
P05已连通

大事提醒

最近倒计时大字、置顶 / 重点分区、普通折叠、四种循环与人物绑定。

时间打开
P06已连通

群组留言

公共留言墙 / 我的私聊双 Tab;身份标签、私有备注、@、图片与回复。

连接打开
P07已连通

宗族成员

成员检索、管理员邀请 / 访客管理、私有备注与访客公开列表。

连接打开
P08已连通

好友伙伴

私人通讯录、好友私聊、自建群聊;与宗族数据完全隔离的个人空间。

私域打开
P09已连通

我的

头像昵称、宗族退出、好友申请处理、通知开关与账号设置;会员入口隐藏。

个人打开
FORM模块预览

新增 / 编辑人物弹窗

人物类型、姓名、头像、生辰、在世勾选、婚姻、备注;右侧可切新增 / 编辑示例。

组件打开

COMPLETENESS

完整度核对

按当前原型范围逐项核对。「已连通」表示可从入口点击到达并产生状态变化;「占位」表示视觉与交互已表达、真实能力待接入。

模块 / 链路状态说明
登录 → 主页已连通授权成功后约 1.5 秒自动跳转,主页六卡与底栏全部可点。
族谱 → 人物档案已连通列表视图点示例人物 → 修改档案 → 04;其他人物暂提示待定稿。
人物 ↔ 往事已连通人物页展示绑定往事,可新增;往事页支持按人物筛选与双向编辑。
人物 ↔ 大事提醒已连通人物页可快捷新增 / 编辑提醒;提醒页绑定人物后回显。
往事筛选 / 新增 / 编辑已连通关系、人名、事件、重置与搜索完整;相册为占位压缩图。
大事提醒分区 / 循环已连通置顶、标红、折叠、四种循环与最近倒计时;订阅推送待接入。
宗族成员 / 访客已连通管理员 / 成员 / 访客三视角;邀请、访客有效期、移除与私有备注可使用。
留言 / 私聊权限已连通公共墙可发言、@、发图;访客隐藏私聊 Tab;私聊详情为占位。
好友 / 群聊已连通联系人新增编辑、私聊列表、自建群聊可用;聊天详情为占位。
我的 / 设置已连通宗族退出、好友申请、通知开关、昵称修改均可用;会员中心隐藏。
人物最终弹窗待合并06 已按最终规则(在世勾选)完成;04 仍保留旧页内编辑,待统一接回。
私聊 / 群聊详情占位当前列表可点,详情用轻提示占位;消息流与发送未展开。
图片与订阅消息占位图片使用占位压缩图;@ / 提醒的真实订阅消息未接入。
会员中心按要求隐藏自用阶段不展示入口,页面不出现会员相关模块。

NOTES

本轮补齐与已知边界

本轮已补齐

  • 登录按钮授权成功后自动进入宗族主页,不再停在登录页。
  • 族谱册列表中的示例人物「修改档案」已接到 04 人物档案页。
  • 新增 / 编辑人物弹窗补上「在世」勾选:默认勾选并隐藏逝世日期,取消勾选才展开日期选择。
  • 本总览页作为 11 个页面 / 模块的统一入口与走查说明。

已知边界

  • 人物详情目前以示例人物为完整示例;新增人物会进入筛选与绑定下拉,但尚未生成独立详情页。
  • 06 人物弹窗尚未回接 04 的「修改档案」,04 仍使用旧页内编辑,二者视觉与字段待统一。
  • 私聊 / 群聊的会话详情、真实图片上传、订阅消息推送为后续接入项。
  • 原型数据主要保存在浏览器本地;清理浏览器数据会恢复示例数据。