← ClaudeAtlas

frontend-design-directionlisted

Set an ECC-specific frontend design direction for production UI work. Use when building or improving websites, dashboards, applications, components, landing pages, visual tools, or any web UI that needs stronger product-specific design judgment.
userInner/SKILLS · ★ 3 · Web & Frontend · score 72
Install: claude install-skill userInner/SKILLS
# Frontend Design Direction Use this skill when the work is not just making UI function, but making it feel purposeful, polished, and appropriate to the product domain. Source: salvaged from stale community PR #1659 by `linus707`. Note: ECC intentionally does not rebundle the canonical Anthropic `frontend-design` skill. Install that from `anthropics/skills` when you want the official upstream skill. This skill is the ECC-specific design-direction salvage of the useful local guidance from #1659. ## When to Use - The user asks to build a web page, app, dashboard, artifact, component, or UI. - The user asks to make an interface more polished, distinctive, beautiful, or less generic. - The implementation needs visual hierarchy, typography, color, motion, layout, and interaction choices. - The current UI works but reads as flat, generic, templated, or mismatched to the audience. ## Design Direction Before coding, choose a specific direction: 1. Purpose: what job does the interface do? 2. Audience: who repeats this workflow, and what do they need to scan first? 3. Tone: utilitarian, editorial, playful, industrial, refined, technical, maximal, minimal, dense, calm, or another explicit direction. 4. Memorable detail: one design idea that makes the result feel intentional. 5. Constraints: framework, accessibility, performance, responsiveness, and existing design system. Match the direction to the domain. A SaaS operations tool should usually be dense, quiet, and s