frontend-design

Installation
SKILL.md

Frontend Design

此 skill 指导创建独特、生产级的前端界面,避免通用的"AI slop"美学。实现真正可工作的代码,注重美学细节和创意选择。

用户提供前端需求:要构建的组件、页面、应用程序或界面。可能包含关于目的、受众或技术约束的上下文。

设计思维

在编码之前,理解上下文并确定一个大胆的美学方向:

  • 目的:这个界面解决什么问题?谁使用它?
  • 风格:选择一个极端:残酷的极简主义、混乱的最大化主义、复古未来主义、有机/自然、奢华/精致、玩具般的趣味、编辑/杂志风格、粗野主义/原始、装饰艺术/几何、柔和/粉彩、工业/功利主义等等。有很多风格可供选择。以此为灵感但设计一个符合美学方向的真正方案。
  • 约束:技术要求(框架、性能、可访问性)。
  • 差异化:是什么让这令人难忘?人们会记住的一件小事是什么?

关键:选择一个清晰的概念方向并精确执行。大胆的最大化主义和精致的极简主义都可以工作——关键是有意性,而不是强度。

然后实现可工作的代码(HTML/CSS/JS、React、Vue 等):

  • 生产级且功能完整
  • 视觉上令人难忘且独特
Related skills
Installs
11
GitHub Stars
2
First Seen
Feb 28, 2026