产品界面 PRODUCT UI
Agent 工作空间、学习与阅读工具;信息层级、状态与反馈。
01 Flovvas02 NousMAKE IT USABLE.
让复杂的系统,变得可以被触摸。
AI 产品界面 · 交互 · 游戏设计
Interfaces and game worlds where agents, canvases and interaction details meet.
我是一名横跨 AI 产品界面、交互与游戏叙事的设计师。我从「人如何理解一个系统」出发,把复杂的能力整理成可以被看见、被操作的界面;也用同样的方法搭建游戏里的空间与叙事。
I design AI-era interfaces and game worlds — turning complex systems into things people can see, touch and trust.
我主导设计,并与 Claude Code、Codex 协作把想法做成可运行的产品,所以每个项目都能看到从设计原则到真实实现的完整链路。
Agent 工作空间、学习与阅读工具;信息层级、状态与反馈。
01 Flovvas02 Nous关卡空间、灯光与氛围、剧情结构,以及 AI 驱动的叙述。
03 潜影04 窃天机05 Roblox微交互、手感参数、3D 空间界面,把手感写成可交付的规格。
06 Form Labs07 CTTK设计系统、组件与前端;与 coding agent 协作完成工程。
NousForma为 Agent 时代的画布工作流设计界面:让 AI 的参与可见,又不抢走画布。
Interface design for a canvas-first agent workspace.
让 Agent 参与进来,却不打断画布上的思考心流:界面要让「它在做什么」可见,又不抢走画布这个主角。
画布控制面板与 Card 内容分层,互不遮挡;Agent 面板可以分离、折叠;任何改动之前先用完整预览面板确认,保持清晰的层级与可退回的节奏。
设计 Dig Mode 的交互原型(在干净上下文里重写同一轮对话,并与普通多轮对话对比);负责多语言布局的鲁棒性,以及界面细节的打磨与修复。



为「读懂」而不是「存下」设计的阅读与学习界面(第二版)。
Interface design for reading that leads to understanding — version 2.
让「读懂」比「存下」更容易发生:正文要在界面中心,同时还要容纳提问、批注、视频与回顾,又不能显得拥挤。
近白、克制的界面,Klein 蓝只用于操作与选中;批注紧贴被指认的原文放在边栏;信息按「和你现在的关系」分组,而不是按时间;遗忘状态用条形而不是数字表达。
第二版界面原型(首页、阅读、收件箱、陪看、概念五个界面)与对应的设计系统;负责前端实现。





第一人称 3D 推理叙事游戏:你亲手冲洗出一张底片,看见凶手的脸。
A first-person detective game set in 1926. You develop the photograph yourself — and the culprit is who you least expect.
在一款推理游戏里,让空间本身成为叙事与证据,而不是背景。
以 P.T. 的空间感受为准则;用光区分「日常」与「显影」:暖光对红灯;界面只占角落,把画面留给空间;画面先调灯光与天空,再材质,最后滤镜,重点场景不低于 45 帧。
作为制作人 / 编剧 / 导演:剧情结构、关卡空间与镜头、灯光与画面方向;搭建内容表与自动通关验证的管线,并与 coding agent 协作完成全部代码。





悬于云海之上的环城,由会改写规则的织机维持秩序;你用一句话改写敌人。
A cloud-city ruled by a rule-rewriting loom, where sentences are weapons.
为一个「AI 在运行时改写规则」的世界,设计可以被玩家理解和操作的玩法,以及配套的视觉语言。
把提示词变成可操作的战斗界面:「组句」;以宋韵丝绸朋克统一材质、色彩与建筑语言;用同心环城与垂直攀爬的结构,方便规划关卡与白盒。
20 余篇设计文档:品类分析、核心玩法、战斗、世界观与白盒系统策划案;以及概念图与地图框架。




整备、下探迷宫、搜刮、撤离、结算:一局完整循环拆成两个 Roblox 地图来做。
A two-place Roblox prototype: prepare, descend into the maze, loot, extract, and return.
把一局「整备 → 探险 → 撤离 → 结算」的循环拆成两个地图,并让多人可以并行开发而不互相破坏。
按 place 拆成 Run 与 Maze,跨地图交接单独一条线;共享协议、玩法数据与 UI 辅助各自成包;run / maze / contract 三条交付线,每条一个 worktree。
发起仓库并承担主要贡献(133 / 154 次提交):工程架构、协作流程与最小玩法循环的原型。

三个微交互实验 + 一个界面编辑器:让「手感」像规格一样被调节、复制、交付。
Feel is a spec. Each lab ships tunable parameters and a copy-paste component.
把「手感」从设计师的口头描述,变成可以调节、复制、交付的规格。
每个实验统一结构:预设 → 参数 → 可粘贴代码;支持方向键与 Home / End,减少动态效果时取消拉伸与回弹;编辑器取绝对坐标布局,并把这个取舍写进文档。
三个微交互实验与 Forma Canvas 界面编辑器的设计与实现。




空间本身就是界面:一间可以探索的 3D 赛博办公室。
Hover to reveal. Click to move the camera. The panel stays out of the way.
在 3D 空间里,让界面退到最小,把画面还给空间本身。
悬停高亮可探索的区域,点击后相机平滑移动;信息只放在一块最小的玻璃面板里;配套调试视图,方便调相机与热区。
空间交互、相机运镜与界面的设计与实现。


