r/ClaudeAI•약 2개월 전•36•52
Claude Code로 UI/프론트엔드 디자인을 개선하려면 어떻게 해야 할까요?
How to get Claude Code to improve its UI/frontend design?
핵심 요약
Claude Code의 UI 디자인 성능을 높이기 위해 모델 선택, 컴포넌트 단위 설계, 외부 스킬 활용 등 다양한 전략이 논의되었습니다.
- 모델 선택 — Sonnet보다 Opus 5를 사용하여 디자인 품질을 높임
- 설계 방식 — 전체 페이지보다는 컴포넌트 단위로 나누어 개발함
- 외부 도구 — UI-Craft나 Emil-design 같은 Claude 스킬 활용
- 디자인 워크플로우 — 골격(skeleton)을 먼저 잡고 세부 디자인을 입힘
저는 웹사이트 디자인을 위해 코딩 에이전트를 많이 사용해야 하는 여러 프로젝트를 진행 중입니다. Claude Code가 앱이나 웹사이트의 백엔드를 설정하는 데는 정말 뛰어나지만, UI 디자인에는 어려움을 겪는다는 걸 알게 되었습니다. Lovable과 ChatGPT를 사용해 UI 목업을 생성한 뒤 Claude에게 구현하도록 시도해 봤지만, 레퍼런스의 75% 정도를 맞추는 데도 여전히 많은 지시가 필요했습니다.
Claude Design을 사용해 보거나, 21st dev 프롬프트를 Claude에 입력하고 아주 상세한 프롬프트를 제공해 보기도 했지만, 제대로 적용되는 게 없는 것 같습니다.
혹시 추천할 만한 방법이나 조언이 있으신가요?
감사합니다!
