AgentSkillsCN

frontend-design

前端设计美学秘典。UI美学、组件模式、UX原则。当魔尊需要前端设计、UI/UX指导、组件设计时使用。

中文原作
SKILL.md
--- frontmatter
name: frontend-design
description: 前端设计美学秘典。UI美学、组件模式、UX原则。当魔尊需要前端设计、UI/UX指导、组件设计时使用。
user-invocable: true

🎨 前端设计美学秘典

知识主题

主题文档涵盖
UI美学ui-aesthetics.md色彩理论、排版系统、间距系统、视觉层次、设计令牌、暗色模式、阴影层级
组件模式component-patterns.md布局模板、响应式设计、交互模式、动画、表单设计、卡片组件、导航模式
UX原则ux-principles.md可用性、无障碍、信息架构、用户流程、加载体验、反馈设计、移动端优先、性能感知
状态管理state-management.mdRedux、Zustand、Jotai、Recoil、Context API、性能优化
性能优化performance.md懒加载、代码分割、虚拟滚动、Web Vitals、资源优化
前端测试testing.mdVitest、Playwright、单元测试、E2E测试、视觉回归
构建工具build-tools.mdVite、Webpack、Turbopack、esbuild、构建优化

使用场景

  • •设计系统建立
  • •组件库开发
  • •UI/UX审查
  • •无障碍改进
  • •响应式布局
  • •交互动画设计