每一个决定，都留下一圈年轮
一款围绕威士忌收藏与会员体验的 iOS App 概念设计。我将自己的设计方法整理成 Super UI UX Skill，借助 Agent 推进从 Brief、UX 到高保真 UI 的工作，并在各个阶段判断与把控设计方向与产出质量。
项目意图
为什么从私人酒窖开始
我以麦卡伦的品牌语境与会员场景为题，设计了一款以「我的酒窖」为中心的 iOS App：用户可以收藏酒款，记录并回看自己与每一瓶酒有关的经历，再从这些记录出发，探索下一款酒。麦卡伦克制的品牌语言，以及收藏、品鉴与持续记录之间的关系，给了这套体验具体的设计空间。整个项目以 AI Native 的方式与 Agent brief 任务，从需求分析、产品定位一直推进到 UX、视觉方向与 UI。
我的工作流
从 Brief 到界面的设计过程
我把这个项目组织成一条从产品定位到落地 UI 的工作流，并把自己的设计方法写进 Super UI UX Skill，每个环节产出什么、用什么格式、依据来自哪里、修改如何审阅并衔接版本，都通过 Agent 内 Skill 的规则设定进行约束。在各个阶段，我用 Agent 梳理资料、扩展分析、起草文档、生成候选方案并检查前后一致，我再进一步定义问题、筛选方案、审阅产出和判断质量。
过程节选
01 · 需求分析与产品定位
我首先确定这款 App 的定位和核心体验，以「我的酒窖」为中心，连接用户的典藏酒款与个人经历，并让发现内容从已有酒款和口味偏好延伸，为用户提供相近的风味与新的选择。在这个框架下，我用 Agent 对品牌资料、使用场景和功能可能性做更系统的梳理，再从中筛选、修正，形成一份可审阅的 Brief 与产品结构。
02 · UX
定位确定后，我依据需求框架，让 Agent 梳理 Function List、提出可能的 Main Use Cases，再从中挑出值得作为 App 主链路推进的任务。这些任务先用 User Flow 理清页面之间的链路和交互逻辑，再在关键页面的 Wireframe 中确定内容沟通的结构、信息层级、操作与页面关系。每次修改后，文档与界面都会同步检查，让 Wireframe 成为 UI 设计可以直接依据的结构源。
03 · 视觉方向
我从麦卡伦的品牌视觉中提炼出适配 App 的 look and feel，以酒液、玻璃与自然光的影像承载品牌感，用字体、字重、留白和界面节奏组织阅读。最终将方向收敛为清晰、明确的界面设计语言。我把这些原则让 Agent 写进 Design MD，作为后续页面设计的依据。
04 · 关键页面 UI 设计
基于确认的 UX 结构与视觉方向，我先完成若干核心页面的高保真 UI。借助 Figma MCP，Agent 依据页面规格与 Design MD 中的视觉方向和视觉原则搭建页面。在产出部分 Key Page 后，我再进行精修、反馈，或直接在 Figma 中调整，保持页面的信息层级、品牌表达与跨页面的一致性。
05 · 设计系统
关键页面确定之后，我再让 Agent 基于核心页面的设计语言提炼设计系统，从 Design MD 的方向与已经打磨过的核心页面中归纳共性、校准差异、沉淀设计语言，决定哪些样式值得沉淀为规则，再在 Figma 中整理颜色、文字与间距等 Design Foundation，以及可复用组件和必要的变体。目前它覆盖已完成的核心页面，为后续扩展提供一份可以接手和复用的设计源文件。
这个项目留给我最有用的，是一套通过 Agent 与 Skill 的工作流程，沉淀出一套可复用的 UX/UI Vibe Design Workflow。过去在需求分析、UX、视觉和系统化交付中积累的做法，被我拆成明确的步骤、产出标准和审阅方式，写进了 Skill。于是 Agent 能沿着同一套方法稳定地协助产出，我可以把注意力留给真正需要判断的地方：产品该是什么，设计往哪里走，效果够不够到位。麦卡伦是这套框架的一次完整实践。
