MysticX 移动端应用 — 统一设计方向
综合 GPT 5.4、Gemini 3.1 Pro 和 Claude Opus 4.6 的观点
核心论点
MysticX 移动端并不是网站的缩小版。它是一个私密的仪式伴侣——一个口袋里的精神庇护所,通过情感的清晰度、触觉的亲密感和从容的节奏,赢得用户主屏幕上的日常位置。
- 网站负责推销愿景并处理探索发现。
- 移动端应用负责培养习惯并深化关系。
成功的衡量标准不是与网页版的功能一致性。而是用户明天早上是否会再次打开这个应用。
三个视角,一个方向
| 视角 | 核心洞察 |
|---|---|
| GPT 5.4 | 应用应针对情感清晰度进行优化,并在提供价值前减少用户的决策。围绕仪式感而非功能来构建产品。在开发更多屏幕前先建立设计系统。 |
| Gemini 3.1 Pro | 将应用视为“数字庇护所”。倾向于感官设计——触觉反馈、手势优先的交互、原生深色模式美学。构建两个循环:30秒的微习惯和深度的宏观会话。 |
| Claude Opus 4.6 | 弥合愿景与实现之间的差距。高级感来自于动效的克制、触觉反馈的精准以及元素之间的留白——而不是过度装饰。通过在现有功能框架上层层打磨,逐步交付这个庇护所。 |
三者的共识
- 仪式感高于实用性。 每一个主要流程都应该让人感觉是经过深思熟虑的,而不是事务性的。
- 减少获取首次洞察的阻力。 新用户应该在 60 秒内感受到价值。
- 触觉和动效是核心,而非点缀。 它们取代了物理卡牌的操作体验。
- 市场(Market)不应作为主标签页。 将其与教育内容一起折叠到“发现(Discover)”中。
- 每日占卜(Daily Card)是习惯的锚点。 它必须是应用中最快捷、最令人满意的路径。
- 全球化优先,非滞后全球化。 从第一天起就在应用框架中支持所有 12 种语言环境;根据编辑成熟度对内容质量进行分级。
- 性能是一项设计决策。 避免繁重的渲染。针对中端设备和不稳定的网络连接进行优化。
设计原则
1. 情感清晰度优先
每一个屏幕都会立即回答一个问题:
- 首页(Home): 我现在能做的最简单且有意义的事情是什么?
- 占卜设置(Reading setup): 我应该问什么?(而不是:我要选哪种牌阵?)
- 抽牌(Card draw): 接下来会发生什么?
- 结果(Result): 主要的洞察是什么?
- 日记(Journal): 我开始看到什么规律了?
2. 减少决策,建立动量
应用会根据问题推荐牌阵。用户可以选择覆盖推荐。每一步都要么加深参与感,要么减少模糊性,要么制造期待。如果一个步骤未能实现其中任何一点,请将其合并或移除。
3. 感官真实性
塔罗牌是一种物理体验。应用通过以下方式进行补偿:
- 触觉(Haptics): 注入能量时的心跳式长按反馈。翻牌时的清脆震动。选择时的微妙确认感。
- 动效(Motion): 稀少且有意义——进入时的柔和升起,闲置卡牌的轻柔浮动,受控的揭示。绝对避免持续不断的循环动画。
- 触控(Touch): 每个交互表面都具有基于弹簧物理的按压反馈。在自然的情况下优先使用手势而非按钮(滑动抽牌,拖动选择)。
4. 克制的高级感
高级感来源于_不_存在的东西:
- 充足的留白,而非拥挤的布局
- 每个屏幕一个显著的号召性用语(CTA),而不是多个同等权重的按钮
- 依靠排版来传达情感,而不是装饰性插图
- 柔和的分层表面,而不是扁平或过度渐变的背景
- 深色模式作为神秘语境的原生主场(深黑曜石色、午夜紫、金色点缀)
5. 渐进式构建庇护所
通过分层打磨来交付,而不是重写:
- 跨所有屏幕的动效系统和触觉反馈(进行中)
- 表面系统——主视觉(hero)、日记、仪式、实用工具表面,具有独特但相关的个性
- 占卜结果的渐进式揭示
- 每日占卜上的连续打卡/习惯 UI
- 仪式流程中的环境音效
导航
底部标签页(4个):
| 标签页 | 目的 |
|---|---|
| 首页 (Home) | 日常庇护所——问候、每日一牌、快速提问入口、建议筹码、最近占卜记录 |
| 发现 (Discover) | 浏览、学习、个性化——卡牌百科、塔罗师角色、卡牌皮肤、牌阵指南、问题灵感 |
| 日记 (Journal) | 反思档案——占卜历史、打卡记录、心情标签、反复出现的规律、保存的洞察 |
| 我的 (Me) | 账户中心——个人资料、订阅、积分、邀请、设置 |
为什么“发现”取代了“占卜”和“市场”
之前的“占卜(Read)”标签页与首页的提问入口重复,增加了一个导航决策(“我是从首页开始还是从占卜页开始?”),这违背了在提供价值前减少决策的原则。首页本身就应该承担启动占卜的功能。
之前的“市场(Market)”标签页纯粹是一个店面。竞品分析显示,没有一款成功的塔罗牌应用会将购物标签页置于顶级层级。将皮肤和塔罗师置于可浏览的内容标签页中,可以将购买行为重新构建为发现,而非交易。
发现(Discover) 结合以下内容解决了这两个问题:
- 教育内容——包含 78 张塔罗牌含义和关键词的百科全书;解释何时使用每种布局的牌阵指南;按主题(爱情、事业、自我反思)精选的问题思路。这捕捉到了 Labyrinthos(评分 4.89★)所证明的从教育到参与的漏斗模型,该模型推动了获客和留存。
- 个性化内容——带有音频预览和购买/解锁功能的塔罗师角色画廊;带有预览和购买功能的卡牌皮肤视觉展示。用户在探索过程中遇到这些内容,使购买感觉更像是好奇心的自然延伸,而不是店面的转化目标。
这给了用户即使在不进行占卜时也有理由去浏览的动力——这正是该应用目前所缺乏的。
核心循环
微循环(日常习惯——30 秒)
- 打开应用 → 立即看到今日卡牌的邀请
- 带有触觉反馈的抽牌揭示(清脆震动、卡牌抬起动画)
- 阅读简明扼要的三句话情感总结
- 选择性地保存心情标签或反思
- 查看打卡计数器和积分奖励
- 完成——关闭或继续
推送通知节奏: 温和,每天一次,多样的措辞(“宇宙今天对您有话说”、“您的每日一牌已准备好”)。
宏观循环(深度会话——5-15 分钟)
- 使用自然语言输入问题
- 应用推荐牌阵(可覆盖选项)
- 选择性地挑选塔罗师角色和卡牌皮肤
- 逐一抽牌,在揭示前显示位置含义
- 结构化分层的 AI 回复:一句话答案 → 总结 → 逐牌解析 → 指导意见 → 后续追问筹码
- 对话式跟进:AI 询问“这与您产生了怎样的共鸣?”以培养双向交流
- 保存占卜 → 出现在具有浮现规律的日记中
视觉方向
调色板
明亮庇护所(默认):
- 羊皮纸/奶油色基调 (#FFF9F0)
- 烛光金用于点缀和 CTA
- 复古古铜色/墨棕色用于文字
- 柔和的米色边框和阴影
- 午夜蓝作为克制的点缀
暗黑庇护所(仪式模式/可选):
- 深黑曜石色 (#0D0B14) 和午夜紫 (#20163B)
- 金色点缀在深色背景下显得更加鲜明
- 降低透明度的奶油色文字用于正文,完全不透明用于标题
- 在适当的地方使用对 OLED 友好的纯黑色
排版字体
两种字体系列:
- 展示型衬线字体用于标题、卡牌名称、仪式时刻——创造情感分量
- 易读的无衬线字体用于正文拷贝、控件、元数据文本——保持清晰度
排版应承载情感氛围。如果字体感觉对了,就不需要那么多插图了。
动效系统
已在实施中。核心模式:
| 模式 | 适用场景 | 实现方式 |
|---|---|---|
| FadeInDown | 章节标题、主视觉卡牌 | entering={FadeInDown.delay(n)} 配合交错延迟 |
| FadeInUp | 内容版块、底部操作 | entering={FadeInUp.delay(n)} |
| Float | 闲置牌堆、生成状态 | useSharedValue + withRepeat(withSequence(withTiming)) |
| Spring press | 所有交互表面 | RitualPressable 配合弹簧缩放 (damping:18, stiffness:280) |
| ZoomIn | 卡牌揭示时刻 | entering={ZoomIn.delay(n)} |
| LinearTransition | 列表重排序 | layout={LinearTransition} |
规则:
- 每个屏幕最多 3-4 个动画版块
- 交错延迟增量为 80-120 毫秒
- 绝不进行持续动画——仅在仪式时刻使用呼吸/偶尔浮动效果
- 每一个动画都必须服务于节奏控制、制造期待或确认操作
表面系统
| 表面 | 视觉特征 | 使用场景 |
|---|---|---|
| Sanctuary (庇护所) | 暖奶油色、充足的内边距、金色点缀 | 首页主视觉、每日一牌、问候语 |
| Ritual (仪式) | 更深或更聚焦的颜色、减少无用装饰 | 抽牌、流式传输、结果揭示 |
| Archival (档案) | 带有米色边框的白底卡片、强调排版层级 | 日记条目、占卜历史 |
| Utility (实用工具) | 极简、高清晰度 | 设置、账户、支付 |
全球受众策略
按意图细分,而非地理位置
- 日常寻求慰藉
- 感情关系指导
- 决策支持
- 情感反思
- 更深层次的精神仪式
引导流程中的“意图”选择器会动态调整 AI 角色的基调(反思型 vs. 指导型 vs. 俏皮型)。
本地化分级
第一梯队(最深度的提示词调优,全面 QA):英语、西班牙语、葡萄牙语、法语、德语
第二梯队(随应用框架发布,结构化 QA,注重排版):简体中文、繁体中文、日语、韩语、阿拉伯语 (RTL)
第三梯队(全面支持,初期提供较短的内容块):印度尼西亚语、荷兰语
性能预算
- 目标:在三年前的中端 Android 设备上正常运行
- 避免实时 3D 渲染。使用优化过的 Lottie、SVG、模糊效果
- 延迟加载卡牌插图资产
- 在网络连接较慢时,AI 输出应具有优雅的流式加载状态
- 离线访问过去的日记条目和已抽卡牌
变现原则
- 在要求购买前展示价值
- 将塔罗师和皮肤构架为个性化体验,而非库存商品
- 在能够解释可能性(而非稀缺性)的地方展示积分
- 在有意义的会话结束后放置会员追加销售(upsell)
- 在全球统一定价时考虑购买力平价 (PPP)
实施路线图
阶段 1:动效与触觉基础 ← 当前进度
在所有屏幕上应用仪式动效系统:
- [x] RitualPressable 组件
- [x] 占卜流程(选牌、结果、[id]、流式传输)
- [x] 每日一牌
- [ ] 首页标签页
- [ ] 日记标签页
- [ ] 发现标签页、我的标签页
- [ ] 认证和引导屏幕
阶段 2:表面系统与视觉凝聚力
- 定义表面设计标记(庇护所、仪式、档案、实用工具)
- 为占卜流程实现暗黑仪式模式
- 完善排版比例和间距标记
- 标准化卡片/药丸形标签/筹码组件
阶段 3:习惯循环打磨
- 每日一牌上的打卡计数器
- 占卜后的心情标签
- 推送通知系统
- 积分奖励动画
- 占卜结果的渐进式揭示
阶段 4:导航重构
- 用发现标签页取代占卜和市场标签页(卡牌百科、塔罗师角色、卡牌皮肤、牌阵指南、问题灵感)
- 深化日记功能,增加过滤器、模式规律、高亮显示
阶段 5:感官层
- 仪式流程中的环境音效(可选,令人平静)
- 增强的触觉词汇库(心跳长按、清脆震动、轻柔确认)
- 手势优先的抽牌(从牌堆中滑动/拖动)
阶段 6:全球化打磨
- 所有 12 种语言环境的端到端 QA
- 阿拉伯语的 RTL 布局验证
- 第一梯队语言的提示词调优和编辑审查
- 低端设备和慢速网络测试
- 购买力平价 (PPP) 定价实施
指导性隐喻
这款应用就像是一本可以装进口袋的破旧真皮日记本。早晨,你伴随着咖啡打开它。书页自然翻到今天。仪式感令人熟悉,但从不重复。你感觉那些答案仿佛一直在那里等待着你。
这就是我们正在打造的产品。