highfi-visual-prototype은(는) 무엇을 하나요?
제품 관리자를 위한 고충실도 시각적 프로토타입 Codex 스킬입니다.
이 스킬을 사용하면 텍스트 설명만으로도 고품질의 시각적 프로토타입을 생성할 수 있습니다. SVG, HTML, CSS를 활용하여 실제 제품과 유사한 수준의 인터페이스를 빠르게 제작하고, 반복적인 피드백을 통해 개선할 수 있습니다.
주요 기능
- 텍스트-투-프로토타입: 자연어 설명을 기반으로 즉시 시각적 프로토타입 생성
- 고충실도 디자인: 실제 제품과 유사한 디테일과 스타일링 지원
- 인터랙티브 요소: 버튼 클릭, 호버 효과 등 기본적인 상호작용 구현 가능
- 반복 작업 최적화: 기존 프로토타입을 수정하거나 확장하여 빠르게 반복
사용 방법
- 원하는 프로토타입의 설명을 입력합니다.
- 스킬이 자동으로 SVG/HTML 코드를 생성합니다.
- 생성된 코드를 미리보기하거나 추가로 수정할 수 있습니다.
예시 프롬프트
- "로그인 화면 프로토타입을 만들어 줘"
- "대시보드 레이아웃을 와이어프레임에서 고충실도로 변환해줘"
- "모바일 결제 화면 프로토타입을 생성해줘"
지원 환경
- Codex (예: Cursor, Claude Code)
- 모든 주요 웹 브라우저에서 결과물 확인 가능