关于 design-engineering-catalogue
按领域整理视觉设计、UI、品牌、色彩、字体和移动端设计技能的导航目录，帮助按设计任务查找合适技能；更广泛的目录可查看 `design-catalogue`。
主要功能
- 01视觉设计与 UI 技能目录
- 02品牌、色彩与字体参考
- 03移动端与平台设计技能
- 04交互与界面润色资源
适用场景
- 01为 UI 改版寻找技能
- 02查找字体或色彩指导
- 03选择移动端设计参考
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/design-engineering-catalogue确认已加载。
附带文件stub.yaml
详细介绍
design-engineering-catalogue
视觉设计、UI 工艺、品牌、色彩、字体排印和移动端设计的领域导航器。 当用户询问如何塑造某项内容的外观与感受时启用。
→ 如需查看涵盖所有领域的完整目录：使用 design-catalogue。
何时使用
当用户：
- 希望获得有鲜明主张的 UI 品味或美学锚点
- 需要品牌识别、色彩科学或字体排印
- 为 iOS、Android 或跨平台移动端进行设计
- 希望构建组件系统或设计系统基础
- 询问交互式设计探索工具
设计工程（有鲜明主张的 UI 品味）
| 技能 | 最适用场景 |
|---|---|
taste-skill | 高级感、非通用的 UI——变化、动效、密度调节 |
impeccable | 23 个命令、Chrome 扩展、浏览器实时模式迭代 |
make-interfaces-better | 润色：微交互、字体排印细节、视觉优化 |
ui-craft | 18 个斜杠命令、反粗劣设计 CLI、3 种风格变体——最全面的设计工程技能 |
frontend-design | 8 种美学锚点（粗野主义、北欧风、赛博朋克……），每种主题均配有锁定的 CSS 令牌 |
huashu-design | 杂志级字体排印、CSS Grid、动画原型、MP4 导出 |
brand-design-md | 运行时获取 62 个世界级品牌（Stripe、Linear、Apple……）的精确令牌 |
ai-graphic-design-skill | 将 15 种 AI 工具映射到设计场景，并提供 2025-26 创意总监路线图 |
logo-designer-skill | 品牌访谈 → 3-5 个 SVG 概念 → 导出 16px–2048px 的 PNG |
distinctive-frontend | 4 种主题设计系统（赛博朋克、粗野主义、蒸汽波、北欧风），带有交错动画 |
design-for-ai | 双模式：CHECKER（7 类审查）+ APPLIER（6 阶段创作） |
superdesign-skill | 无限画布构思：品牌提取、设计草稿、原生 IDE |
styleseed | 69 条设计规则、60 多种品牌皮肤（Toss、Stripe、Linear、Vercel……）、13 个斜杠命令 |
awesome-design-skills | 67 种风格的美学注册表：玻璃拟态、粗野主义、便当盒布局、编辑风、risograph…… |
interaction-design | IxD 原则、组件状态、微交互、可供性、任务流——Norman + Tognazzini |
format-storybook | Storybook 文件结构、模板组合、控件、Chromatic 视觉回归、CSF 模式 |
localization-design | RTL 镜像、各语言文本扩展、非拉丁字体、文化相关的色彩/图标陷阱 |
design-system-governance | 所有权模型、贡献生命周期、语义化版本契约、弃用政策 |
色彩、字体与组件
| 技能 | 最适合 |
|---|---|
color-expert | OKLCH/OKLAB 色彩科学、调色板生成、对比度 |
baseline-ui | 动画时长、字体排印比例、Tailwind 反模式 |
shadcn-ui | shadcn/ui 组件工作流 |
ui-ux-pro-max | 50 多种风格、97 种调色板、9 种技术栈 |
google-fonts-skill | 1,923 种带有氛围标签的 Google Fonts + 73 组搭配 + CSS 变量 + Tailwind 配置 |
design-tokens-skill | W3C DTCG 令牌规范：OKLCH、引用/别名、Terrazzo、Figma 导出 |
ink-google | 用于创作物的墨水风格编辑设计 |
open-design | 31 项技能 + 71 套品牌设计系统——本地优先的 Claude Design 替代方案 |
material-3-skill | Material Design 3 / Material You：动态色彩、色调表面、30 多种组件（Compose + Flutter） |
移动端与平台设计
| 技能 | 最适合 |
|---|---|
mobile-app-design | iOS HIG + Android MD3 + RN 最佳实践——26K 字 |
mobile-app-ui-design | 专业移动端 UI：精心设计、流畅鲜活的界面 |
apple-hig-skills | Apple HIG：iOS、macOS、visionOS、watchOS、tvOS |
hig-doctor | 诊断并修复违反 Apple HIG 的问题 |
swiftui-patterns | SwiftUI 视图与组件最佳实践 |
swiftui-claude-skills | 经 WWDC 2025 验证的 SwiftUI、iOS 26.4 RC、Xcode 26 |
swiftui-design-skill | SwiftUI 视觉设计技艺——避免 AI 垃圾感、字体排印、色彩、品牌 |
liquid-glass-skill | iOS 26 Liquid Glass：.glassEffect()、GlassEffectContainer、迁移模式 |
platform-design-skills | 300 多条适用于跨平台设计的 HIG/MD3/WCAG 规则 |
sleek-design-mobile-apps | Sleek 平台：设计屏幕、项目、素材（需要账户） |
交互与润色
| 技能 | 最适合 |
|---|---|
taste-design-stitch | 评判 Google Stitch 输出的审美水准 |
design-lab | 交互式设计探索、变体生成 |
interface-design-dammyjay | 仪表盘、管理面板、信息密集型 SaaS UI |
bencium-ux-designer | 独具特色、可用于生产环境的前端 |
neo-user-journey | UX 用户旅程映射 + Playwright 测试 + 50 多种模式 + Nielsen 评分 |
simota-agent-skills | 15 项设计子技能：Vision、Frame（Figma 桥接）、Pixel、Clay、Ink、Sketch |
design-auditor | 19 类审查：字体排印、深色模式、RTL、暗黑模式；0–100 分 |
composio-artifacts | 通过 Composio 连接到 GitHub/Slack/Linear 的创作物 |
search-ux | 搜索输入、自动补全、排序、分面筛选、无结果状态、搜索分析 |
interfaces-that-feel | 情感化设计：感受状态 → 物理类比 → 动效/文案/间距调整 |
information-architecture-and-navigation | 北极熊信息架构：组织/标注/导航/搜索、分类体系、寻路、可发现性 |
评论
支持 Markdown