LoveUp 一切功能都建立在「空间绑定」之上。本页只画结构性的流程:绑定、日常闭环、解绑。页面内部操作见 Mock 侧的逐屏批注。
A 先上车(建空间),B 凭码加入。实心站点是不可回退的决定;虚线框是系统自动事务。金点为里程碑。
以「发布日常」为例说明写入类功能的通用闭环,其余模块(信、事件、票根、待办、心愿)同构。
十四个模块 × 四种关键状态。✓ 表示本设计稿在 Mock 中已落实该状态的界面;— 表示该状态下此模块整体不可入。
| 模块 | 未绑定 | 绑定 · 有数据 | 绑定 · 空数据 | 静默期(解绑中) | Mock |
|---|---|---|---|---|---|
| 主页 | 骨架版(欢迎屏) | ✓ 通车数+近期安排+时间线 | 今日空态给两条引导 | 只读 + 横幅 | ✓ |
| 信件 | — | ✓ 列表/写信/定时锁 | 「还没寄过一封」给模板 | ✗ 禁寄出 | ✓ |
| 日历 | — | ✓ 月视图/新增 | 空月不画骨架点 | 只读 | ✓ |
| 奔赴/票根 | — | ✓ 车次线/存根 | 「0 次见面」空态 | 只读 | ✓ |
| 相册 | — | ✓ 列表/多选 | 「我们」默认册有封面示范 | 只读 | ✓ |
| 日常 | — | ✓ 时间线/发布 | 今日空白给提问式引导 | 只读 | ✓ |
| 待办 | — | ✓ 双人/个人分段 | 先给三条可改默认 | 停建新项 | ✓ |
| 厨房/订单 | — | ✓ 菜单/心愿/点单 | 「菜单还没写」空态 | ✗ 禁新点单 | ✓ |
| 积分 | — | ✓ 余额/流水 | 0 分流水给挣分规则卡 | 只读 | ✓ |
| 通知 | ✓(注册即刻起) | ✓ 中心/已读 | 安静期为「没有新消息」 | 仅系统类 | ✓ |
| 我的/账号 | ✓ | ✓ | — | 退出/导出入口 | ✓ |
placeholder 文案都跟着这四条写——它们是这套设计的语气底座。
空屏必须给出下一次动作,且按钮与到达后的动作同名(「寄出第一封信」而不是「开始使用信箱」)。
「这封邀请码已失效——让她在「我的」重新生成一张,24 小时内有效。」不给「操作失败」这类死字。
万物可重命名、可悬置、可再录入;撤回与补记走同一入口,别让遗漏变成死档。
所有改动(事件、愿望、菜单)在流水里记「谁改的」。误改可一键回滚到上一次署名版本。
对齐微信 8.0.x 发朋友圈的图片编辑交互,Mock 里已实现为可按的原生手势,不依赖第三方库。
按下后 600ms 以内位移 >10px 取消(视为滚动/点击);到达阈值抬起:图片 scale(1.07) + 投影 + z-index 提升 + 振动反馈(Android vibrate)。
布局先切成 absolute+transform;指针所在的最近槽位即目标 index(按槽中心最近点计算),其余项用 180ms transform 平移让位,避免 layout 抖动。
松手时被拖项 180ms 弹进目标槽,数据数组同步交换;上限 9 张,「+」补位格不可拖;删除走右上角 ×,随时可点。
容器 touch-action:none,未进入拖动态前页面可正常滚动;进入后滚动被手势接管——两条能力不抢主线程动画(无第三方依赖、WXS/RAF 可平替)。
Mock 里点任何九宫格图片都会进入,已实现左右切页、双击/双指缩放、上/下滑关闭。
菜单列表从「横条卡片」改为小红书首页形态,交互与详情一起给出。
双列等宽、高度随图片比例落位(占位防跳动);顶部分类 chips 横向滑、选中反色,点击即时过滤列表。卡片=封面图 + 两行标题 + 作者 + 红心计数。
进入详情:3:2 底图横向轮播(跟手 + 底部胶囊指示点联动),双击图片弹红心即计入点赞,做法支持双署名追记(合档底单)。
底栏「点单」弹出积分折算确认卡,确认后按钮变「已点单,下厨的人已收到」;点赞数与列表卡片同步,不重复计。
九宫格上限 9 张、瀑布流两列、chips 不做二级筛选;点单只用积分,不接支付——这些边界与既有产品约束一致,不在本稿扩散。
写在这里,防止后来忘了这段推理。