聊起 AI，总绕不开参数、算力、准确率。把模型塞进对话框，它就只是个高效工具。但我想试试，能不能用它搭一座桥——连通神秘学和代码，让 AI 像个人导师那样陪你向内探索。
于是有了这个项目：一个完整的数字塔罗占卜系统。核心是'手势选牌 + 握拳定契 + AI 解牌与多轮对谈'，所有代码开源，本地跑起来就能体验整场仪式。
仪式的重塑
传统塔罗占卜，精髓不在预知未来。那是洗牌时的触感、切牌时的呼吸、抽牌时心跳漏掉的那一拍。整套仪式让人从日常抽离，面对困惑。78 张牌的符号，成为潜意识的镜子。
但多数数字塔罗产品直接把仪式砍掉——点按钮，刷一条通用牌意。效率是有了，共情没了。我想用前端技术、计算机视觉和大模型，把仪式感一点一点拼回来。
1. 启程：写下你的疑惑
页面是暗紫色流动星云，没有多余元素。中间一个极简输入框，提示'刻录你的疑惑'。不限字数，不强制填写，你写下任何缠绕心头的念头——职业、感情、成长——然后点一下'启程'。这时摄像头会悄悄启动。
2. 共鸣：挥手翻动命运
这里我放弃了点击选牌。接入 Google MediaPipe，让用户的手在虚空中划动牌阵。
授权摄像头后，提示变成'挥动手部移动，握拳 3 秒翻开命运'。画面只在本地处理，不上传。屏幕中央是 3D 透视排开的大阿卡纳牌，MediaPipe 实时捕捉手的 21 个 3D 关键点。
左右挥动手掌，牌阵跟着水平滚动。当前高亮的牌带有光晕，左手边、右手边分别提示 'LEFT'、'FIST'、'RIGHT'。
3. 定契：握拳三秒锁定牌面
选好牌，要定下来。握拳三秒，模仿现实里'就是这张'的确认感。
MediaPipe 在端侧判断手势：比较指尖到手腕的距离和指节到手腕的距离，多根手指满足这条件就算握拳。一旦连续握拳 3 秒，触发定契，没有后悔药。中途松开超过大约 1.2 秒，计时重置。
4. 揭示：牌面缓缓掀开
定契后，选中牌从牌背翻转成正面。用了 3D 透视和背面隐藏，翻转时张力很足。完全掀开后，光线稳定，下一幕随即开始。
5. 对谈：AI 导师解读
牌不是终点，是对话起点。我接入了 DeepSeek API，让它扮演资深塔罗师。
翻牌同时，结构化提示发出去：你的初始困惑、抽中牌名、基础释义。DeepSeek 流式返回解读，结合符号和语境梳理状态，不扔一句'你会怎样'。字是一段段吐出来的，配合 marked 实时渲染 Markdown，像打字机。
而且支持多轮上下文。你可以追问'这张牌给我的最大警示是什么？'，AI 记得之前的交流，像真的塔罗师一样来回聊。
技术骨架
极致体验背后是扎实的工程实现。项目围绕'沉浸感'和'仪式闭环'搭建。
前端：React + TypeScript + Vite
- Vite：冷启动毫秒级，热更新快，调试动效和手势时能实时看到每一帧。构建产出体积合理。
- React：组件化拆分输入、手势、牌阵、对话模块。状态用
useState/useRef/useCallback管理，各模块解耦清晰。 - TypeScript：多模块对接时，类型检查能在开发阶段拦住不少坑，交互状态流转更稳。
手势：Google MediaPipe
手势这块全靠 MediaPipe，延迟低，隐私也有保障。
- @mediapipe/hands：浏览器端检测手部 21 个 3D 关键点，不依赖后端。初始化设
maxNumHands: 1和合适的置信度阈值，弱光下也基本稳定。 - @mediapipe/camera_utils：从摄像头取帧喂给 Hands 模型。视频流绑到隐藏的
<video>元素，逐帧处理。 - 交互逻辑：
- 选牌：取第一只手手腕关键点的水平坐标，与上一帧比较，位移超过阈值就按方向增减当前选牌索引。
- 握拳：自定义
checkIsFist(landmarks)，算指尖到手腕 vs 指节到手腕的距离。判定握拳后累加计时，满 3000ms 触发翻牌；若松开超过约 1.2 秒，计数器归零。
