frontend-design

SKILL.md

This skill guides creation of distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices.

The user provides frontend requirements: a component, page, application, or interface to build. They may include context about the purpose, audience, or technical constraints.

Before coding, understand the context and commit to a BOLD aesthetic direction:

以专业 UI/UX 设计师和前端工程师的思维方式创建大胆、高端、生产级的前端界面。当用户要求设计或重新设计必须让人感觉有意为之、独特且非通用的 Web 界面（组件、页面、仪表板或应用程序）时，可以使用此技能。 该模型应积极从广泛的现实世界设计参考（例如现代产品界面、编辑布局、设计系统、实验性网页设计、Pinterest、Awwwards、Dribbble 等平台上看到的趋势）中汲取灵感，而不复制任何单一来源。 输出必须是真实的、可实施的代码，但应避免僵化、类似模板或过度对称的“AI 外观”组件。布局、间距、排版、层次结构和交互模式应该让人感觉是设计的，而不是生成的。 优先考虑强烈的视觉指导、深思熟虑的用户体验决策和受控实验，而不是安全或传统的 UI 模式。 来源：le-dat/claude-skill-engineer。

查看原文