yang20040317-svg
User通用设计工作流技能——五层串联模型(场景→感知物料→形式组织→信息叙事→主观输出),含 12 个专项子技能
Categories
Indexed Skills (19)
design-workflow
通用设计工作流——五层顺序执行模型。按「第一层 场景 → 第二层 感知物料 → 第三层 形式组织 → 第四层 信息叙事 → 第五层 主观输出」逐层操作;各层为可编辑模块(场景层合并为单文件,其余层按子位置分文件)。支持三种调用模式:领域适配(默认)/ 吸睛 / AI自主。专项方法论(数据图表/图形字/图标批量/照片手绘线稿/前端设计/移动端 App/隐喻统摄叙事长页)已抽离为 subskills/ 子技能,按载体/任务特征路由。当需要按流程一步步构思/审视设计时触发。触发词:「设计工作流」「五层设计」「按流程做设计」「逐层设计」「帮我搭设计」「灵感」「随机种子」。
design-chart
数据可视化图表专项方法论。当载体是数据图表/HTML/报告且需要"把数据变精致可读的图"时触发。覆盖:数据形状选图主键、一图一结论、标题写结论、细读型vs快读型、视觉编码诚实性、色彩语义、交互三问、库外新图现场造句、敢于说不、图表交付自检13项。触发词:「数据可视化」「图表」「做几张图」「把这数据画一下」「dashboard」「report」「一图一结论」。
design-frontend
前端/数字产品设计通用原则专项方法论。当产出是 Web/App 界面、交互数字产品、或含动效的页面,需要"像专业前端设计师一样"打磨信息架构、文案、视觉观感与动效时触发。覆盖:结构装置即信息、反模板校准(避免AI默认观感)、复杂度匹配愿景、文案即物料(UX写作)、动效编排时刻、动效语义与具体手法、前端设计通用原则。触发词:「前端设计」「网页界面」「数字产品」「UX写作」「反AI模板」「结构装置」「文案」「动效编排」「signature元素」。
design-icon-batch
图标/图形符号批量生产 + AI生图透明背景抠图专项方法论。当任务要产出"一套视觉素材"(整套图标、一组插画、贴纸集、图形符号)且需"像一个人画的、批量一致、去背景透明PNG"时触发。覆盖:套系一致性、共享几何/线宽/圆角/权重、多尺寸可读、具象名词prompt、AI透明背景陷阱与抠图、网格批量+逐格兜底、风格锚点验证门控、对称翻转复用。附可运行工具 chroma_key.py / slice_grid.py。触发词:「一套图标」「图标套系」「批量生成图标」「抠图」「透明背景」「去背景」「网格切图」「icon set」。
design-ip-assets
专属视觉资产体系(IP 化本体)。定义可跨作品复用、可识别的专属视觉资产——角色/吉祥物 IP、固定符号母题、专属配色签名、字体人格、图形语言。与 design-taste(审美方向容器)并列:taste 定"调性",ip-assets 定"这是你的"。走「模式 2 吸睛」或任何要形成品牌识别的设计时激活,保证产出带专属资产而非匿名通用设计。触发词:「IP 化」「专属资产」「品牌识别」「我的角色」「吉祥物」「签名元素」「视觉资产库」。
design-metaphor-narrative
隐喻统摄的叙事型长页专项方法论。当一个页面要承载"一段经历 / 一串时间节点 / 一份履历 / 一个产品故事",且希望观者"走进去"而不是"扫一眼"时触发。覆盖:单一隐喻统摄信息架构(隐喻映射覆盖率判据)、门禁序章(可跳过/一次性/可回退/失败放行)、数据字段的实物替身、叠放式缩略预览、极窄色板+单点语义强调色、三字体系统、长页 reveal 错峰编排、固定底栏渐进模糊、长文 gutter 章节标签、收尾落在"人"上、重型效果前置能力检测。触发词:「作品集」「简历页」「个人主页」「时间轴」「叙事长页」「滚动叙事」「隐喻统摄」「门禁序章」「开场仪式感」。
design-mobile-app
移动端 App 界面/原型专项方法论。当载体是**手机 App 界面或原型**、且当前产出"像 AI 默认模板 / 只换皮肤不换骨架 / 卡片从上往下等距堆叠"时触发。核心价值是把**结构手法**落到移动范式上——用拇指热区、safe area、一屏一焦、密度节奏、字号极端跳档+字重对比、网格对齐、不对称、原生组件语汇与手势驱动版面,把 App 做出"人做的"结构感。改版顺序以**用户指令为准**:默认可先调皮肤,结构按用户要求再动或一起动,不强行每轮改骨架。触发词:「移动端设计」「App 界面」「App 原型」「手机 UI」「iOS 设计」「移动端结构」「反移动 slop」「拇指热区」「底部导航」「bottom sheet」「移动端排版」「App 组件」「线框图」「低保真」「PRD 走查」「全流程巡查」「页面巡查」「写 APP」。
design-motion-vocabulary
动效术语反查词典——把对 web 动效/效果的模糊描述翻成确切术语(「popover 打开时那弹一下」→ Pop in;「iOS 拉过头的回弹」→ Rubber-banding)。当用户问「这叫什么」或描述一个不知名的动效想找对词去 prompt AI/设计师时用。命名而非设计/构建。
design-photo-sketch
照片为底 + 手绘线稿叠加 / 实况图 live-photo draw-on 动画 / 照片读图与抽象化专项方法论。当任务输入是一张真实照片,要"以照片为起点做设计",或要把照片加手绘线稿做活泼气质,或要做"一笔笔画出来的"实况图动效时触发。覆盖:读图卡片(保真/提取)、抽象化地图、纪实×手绘对撞、线稿叠加技法、自动线稿提取边界、live photo draw-on 管线与红线、手绘线条质感。附可运行脚本 live_photo_drawon_recipe.py。触发词:「照片做设计」「照片加手绘」「手绘线稿」「线稿叠加」「live photo」「实况图」「draw-on」「以照片为起点」「涂鸦叠加」。
design-prototype-divergence
原型发散——把同一件 UI 件建成 3–5 个**真正不同**的版本,放在可视化选择器后让用户实时翻选并晋升胜出者。偏探索/发散,进 design-workflow 模式2(吸睛/探索)最顺。当用户说「给我几个方向看看」「这个组件有几种做法」「发散一下」时触发。
design-reference-sourcing
联网找素材做参考专项。**模式 1 默认路径的强制前置步骤**——用户输入任务 brief 后自动触发,去参考站找「对应的设计」作本次设计依据;用户主动说「找参考/找灵感/找配色/找音效/看看别人怎么做/搜一下案例」时同样触发。覆盖:12 个策展源(Pinterest 与爱给网需登录;Cosmos/ArtStation/Behance/Unicorn Studio/Refero Design/Awwwards/ThreeUI/React Bits/Spline Community/Codrops Creative Hub 开放可直抓)、**agent-browser CLI 截图读图(复用 Chrome 登录态,首选用于登录源与 JS 渲染画廊)**、开放源直抓与登录源带会话抓取的两种手法、合规红线(仅作参考不擅发、版权与署名)。接入设计工作流第二层「感知物料」,作为真实素材补给线。
design-taste
独特品味档案容器(模式2吸睛的本体)。当 design-workflow 走「模式 2 吸睛」时激活:从 taste-profiles/ 选取品味实例,注入独特审美判断与反套路手法。实例档案**强制三段式(🟦参考图事实 / 🟥品味维度 / 🚫红线)**;**只收录用户显式定义的维度原话**(当前 athens-week:排版/交互/颜色 三维,AI 不增补);参考图内容事实与品味档位分离;品味是判断准则(档位),不规定任何版式骨架。每次生成从容器选取实例,而非永远套同一张脸。触发词:「独特品味」「吸睛」「强传播」「模式二」「我的审美」「风格注入」。
design-typographic-glyph
图形字/合字设计(pictogram typography,以字寄形 + 填字共生)专项方法论。当任务要求"在一个汉字里寄具象图形"或"让真实物品形态承载中文书法文字、文字填充并生长出主体",或"汉字本身就是视觉主体(而非仅承载信息)"——字即图、字做主视觉、书法构成画面主体——时触发。覆盖:合字字体选型、以字寄形、墨朱三色制、图字共生四型(形嵌字/笔成形/包围形/填字共生)、共享笔画1-2处、设计三轴、系列化延展、双重可识别与物品优先识别验收、红线。触发词:「图形字」「合字」「以字寄形」「墨朱」「画个鸡字」「XX字配XX图形」「节令物产字」「文字填充物品」「物品里填字」「文字长成物品」「书法构成主体」「字即图」「字做主视觉」「汉字是视觉主体」「字是画面主体」。
apple-fluid-motion
把 Apple「Fluid Interfaces」(WWDC) 的流畅动效原则转成 Web 实现——响应性/直接操作/可中断/弹簧/速度交接/动量/橡皮筋/材质透明/排版。做 iOS 风 UI、手势驱动交互动效时由 ae-factory 经 overlay 调用。
motion-foundations
动画与 UI 动效的「决策框架 + 铁律 + 取值表」。做前端/动效前先过本技能——是否该动→目的→工具→属性→缓动/时长→中断→reduced-motion。提供 GPU 属性铁律、Never Ship 清单、自定义缓动曲线与时长表。由 ae-factory 在 DISCOVER/EXECUTE 阶段经 overlay 调用。
motion-opportunities
在代码库/界面里找「本该动却没动」的地方,并拒绝一切不该动的。只读,给出带确切数值的建议,不实现。DISCOVER/规划阶段由 ae-factory 经 overlay 调用,定位该补动效的缝隙。
motion-recipes
常见动效的「开箱即用」实现——button press / dropdown / tooltip / modal / drawer / toast / accordion / stagger / hold-to-confirm / tab indicator / scroll reveal / drag-to-dismiss。每个给齐 CSS/JS 配料(属性·缓动·时长·transform-origin)。由 ae-factory 在 EXECUTE 阶段经 overlay 调用,从本技能取落好地的实现而非从零写。
motion-review
按高工艺标准审查动画/动效代码(Emil Kowalski 动画哲学)。默认 flag、批准需挣得。输出「Before/After/Why」表 + 分层裁决(Block/Approve)。作为 ae-factory 前端/动效任务的 RELEASE 闸门——交付前用本技能审一遍。
ui-library-selector
从精选、有品味倾向的清单里,按任务挑对的库——数字/OTP/图表/命令菜单/虚拟列表/拖拽/Toast/状态/样式等。工程选型决策,由 ae-factory 在 EXECUTE 阶段经 overlay 调用。清单外不替,除非用户要求。
Bio shown is the top-scored skill's repo description as a fallback — real GitHub bios land in a future update.