높은 디자인 품질을 갖춘 독특하고 운영 수준(production-grade)의 프런트엔드 인터페이스를 생성합니다. 웹 컴포넌트, 페이지, 아티팩트, 포스터 또는 애플리케이션(예: 웹사이트, 랜딩 페이지, 대시보드, React 컴포넌트, HTML/CSS 레이아웃 또는 모든 웹 UI의 스타일링/미화)을 구축할 때 이 SKILL을 사용하세요. 일반적인 AI 미학을 피하고 창의적이고 세련된 코드와 UI 디자인을 생성합니다.
/plugin marketplace add icartsh/icartsh_plugin/plugin install icartsh-plugin@icartsh-marketplaceThis skill inherits all available tools. When active, it can use any tool Claude has access to.
LICENSE.txt이 SKILL은 일반적인 "AI스러운" 미학을 피하고 독특하며 운영 수준의 프런트엔드 인터페이스를 생성하도록 안내합니다. 미적 세부 사항과 창의적인 선택에 각별한 주의를 기울여 실제로 작동하는 코드를 구현합니다.
사용자는 프런트엔드 요구 사항(빌드할 컴포넌트, 페이지, 애플리케이션 또는 인터페이스)을 제공합니다. 여기에는 목적, 대상 사용자 또는 기술적 제약 사항에 대한 컨텍스트가 포함될 수 있습니다.
코딩하기 전에 컨텍스트를 이해하고 대담한(BOLD) 미적 방향성을 정하세요:
중요: 명확한 개념적 방향을 선택하고 정밀하게 실행하세요. 대담한 맥시멀리즘과 세련된 미니멀리즘 모두 효과적입니다. 핵심은 강도가 아니라 '의도성(intentionality)'입니다.
그 후, 다음과 같은 실제로 작동하는 코드(HTML/CSS/JS, React, Vue 등)를 구현합니다:
다음에 집중하세요:
자주 사용되는 폰트 패밀리(Inter, Roboto, Arial, 시스템 폰트), 진부한 컬러 스킴(특히 흰 배경의 보라색 그래디언트), 예측 가능한 레이아웃과 컴포넌트 패턴, 그리고 컨텍스트 고유의 캐릭터가 없는 일률적인 디자인과 같은 일반적인 AI 생성 미학을 절대 사용하지 마세요.
창의적으로 해석하고, 해당 컨텍스트를 위해 진정으로 디자인된 느낌을 주는 예상치 못한 선택을 하세요. 어떤 디자인도 똑같아서는 안 됩니다. 라이트 테마와 다크 테마, 서로 다른 폰트, 서로 다른 미학을 다양하게 적용하세요. 생성 결과물들이 공통적인 선택지(예: Space Grotesk)에 머무르게 하지 마세요.
중요: 구현 복잡도를 미적 비전에 맞추세요. 맥시멀리스트 디자인은 광범위한 애니메이션과 효과를 포함한 정교한 코드가 필요합니다. 미니멀리스트나 세련된 디자인은 절제, 정밀함, 그리고 간격, 타이포그래피, 미묘한 세부 사항에 대한 세심한 주의가 필요합니다. 우아함은 비전을 잘 실행하는 데서 나옵니다.
기억하세요: Claude는 비범하고 창의적인 작업을 수행할 수 있습니다. 주저하지 말고 틀에서 벗어나 생각하며, 독특한 비전에 온전히 몰입했을 때 진정으로 무엇이 창조될 수 있는지 보여주세요.
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.