K-디자인 하네스를 소개합니다

한 줄 핵심

이 영상은 한국형 앱 UI/UX를 빠르게 초안·검증·보강하는 오픈소스 디자인 하네스를 소개하며, PRD와 원칙을 넣으면 15분 안팎에 개발 가능한 수준의 화면 플로우를 뽑아내는 방법을 보여준다.

시간별 요약

1. 0:00
   시작 대기 라이브 시작 인사와 함께 오늘의 주제가 디자인 하네스 소개라는 점을 밝히고, 광고 협찬과 기본 진행 안내를 짧게 정리한다.
2. 3:56
   이너서클 멤버들과 만든 디자인 하네스 이너서클 스터디에서 함께 개발한 오픈소스 디자인 하네스를 소개하며, 여러 참여자가 함께 PR과 머지로 다듬어 온 결과물이라는 점을 강조한다.
3. 5:22
   PRD 한 장이 화면 흐름 캔버스가 되기까지 PRD를 넣으면 화면 흐름이 연결된 HTML 결과물이 생성되고, 온보딩부터 로그인·예약·결제까지 이어지는 플로우를 한 번에 검토할 수 있다는 점을 보여준다.
4. 15:06
   파운데이션과 컴포넌트 라운딩, 섀도우, 스페이스, 타이포그래피 같은 파운데이션과 버튼·CTA·칩 같은 컴포넌트를 확인하며, 디자인 토큰과 UI 구성 요소를 함께 점검하는 구조를 설명한다.
5. 16:12
   사주와 식당 예약 앱 결과물 사주, 청첩장 모임, 여행 일정, 식당 예약 같은 다양한 사례를 통해 한국형 앱 스타일로 일관된 결과물이 나오는지 보여주고, 일반적인 AI 생성 디자인보다 덜 어색하다는 점을 설명한다.
6. 22:34
   설치하고 go로 돌리기 Claude 플러그인 방식으로 설치한 뒤 고와 맥스 두 모드로 실행하는 방법을 설명하고, 고는 빠른 초안용, 맥스는 엣지 케이스 보강용이라는 사용법을 정리한다.
7. 26:04
   15분 동안 하네스가 하는 일 명세 추출, 사용자 페르소나 생성, 핵심 목표 정의, 이미지 탐색, 디자인 생성, 자동 검증과 수정이 병렬로 돌아가며 빠르게 결과를 만드는 내부 흐름을 보여준다.
8. 40:56
   초안은 go, 빈 화면과 오류는 max 초기 초안은 주요 흐름 중심으로 빠르게 만들고, 이후 맥스로 빈 화면·오류·결제 실패 같은 엣지 케이스를 보강하는 방식이 효율적이라고 설명한다.
9. 55:33
   모든 디자인 에이전트가 같은 원칙을 읽는다 모든 에이전트가 공통 원칙 문서를 읽도록 설계해 이해하기 쉬운 UI를 우선하고, 사용자 여정·여백·색상·CTA 규칙을 한 번에 강제하는 구조를 설명한다.
10. 1:06:04
    꿈 일기 PRD로 디자인 시작 꿈 해석 서비스 예시를 새로 넣어 PRD 작성부터 디자인 실행까지 이어가며, 한국 사용자 맥락에 맞춘 UI/UX가 어떻게 적용되는지 다시 보여준다.
11. 1:13:13
    AI끼리 반박하게 하기 초기 디자인을 여러 관점의 에이전트가 직관성, PM 관점, 재사용성 측면에서 반박하게 하여 기능 과잉과 UX 누락을 줄이는 검토 과정을 보여준다.
12. 1:18:14
    화려한 디자인보다 한눈에 보이는 디자인 예쁘기보다 한눈에 기능이 이해되는 디자인이 중요하며, 화려한 그래픽보다 사용자가 무엇을 해야 하는지 즉시 보이게 만드는 것이 전환과 사용성에 유리하다고 정리한다.
13. 1:24:00
    가족 여행 PRD 디자인 가족 여행, 청첩장 모임, 예약 같은 사례로 다시 한 번 빠른 디자인을 시연하며, 배포 후 사용자 피드백을 어떻게 수집할지 고민도 함께 공유한다.
14. 1:27:18
    UI보다 UX, 이 하네스가 맞는 사람 디자이너나 기획자가 없는 팀, 바이브 코딩으로 앱을 만드는 개발자, 초기 서비스에서 UX 병목을 줄이고 싶은 사람에게 특히 잘 맞는 도구라고 설명한다.
15. 1:36:02
    한국 서비스 팔레트 29CM, Airbnb, 당근 같은 한국에서 익숙한 서비스의 색상·여백·아이콘 규칙을 참고해 팔레트를 미리 준비해 두고, 이를 기반으로 한국형 느낌을 안정적으로 만든다고 설명한다.
16. 1:48:58
    AI에게 맡기지 않은 것들 색상 선택, 상태 화면 규칙, 실제 데이터 삽입, 검증 스크립트 같은 핵심 품질 요소는 AI가 마음대로 정하지 않도록 고정해 두고, 사람이 설계한 기준을 우선한다.
17. 1:54:45
    15분 안에 끝나도록 일을 쪼갠 방법 기획 분석, 페르소나 정리, 기본 파일 세팅, 화면 생성, 검증, 수정, 사진 선택을 병렬화해 전체 작업 시간을 줄이는 스케줄링 전략을 설명한다.
18. 1:58:12
    그대로 개발해도 쓸 수 있는 디자인 — 모임 앱 결과 청첩장 모임 앱 결과를 보여주며 초대, 응답, 일정 확정, 공유 같은 실제 서비스 흐름이 누락되지 않아 거의 그대로 개발 가능한 수준의 산출물이 나온다고 강조한다.
19. 2:12:55
    요즘 하네스, 얼마나 중요할까 특정 스타일과 워크플로를 강제하는 데는 유용하지만, 범용 성능 향상 도구로 보기엔 한계가 있어 목적이 분명한 팀에 더 적합하다고 정리한다.
20. 2:14:12
    이너서클 소개 AI 실무자들이 토론과 개발을 함께 하는 이너서클의 모집 방식, 일정, 운영 취지와 오프라인·온라인 활동 구조를 소개한다.
21. 2:19:47
    로컬 LLM 장비 이야기 로컬 LLM을 위한 장비로 Mac Studio와 DGX Spark를 비교하며, 보안과 내부 데이터 활용을 고려하면 로컬 인프라의 가치가 커질 수 있다고 본다.
22. 2:23:39
    디자인 시스템도 코드로 짜야 할까 디자이너가 직접 운영하는 디자인 시스템은 HTML·CSS 기반으로 두고, 실제 컴포넌트 소스는 개발자가 관리하는 분리가 더 현실적이고 유지보수에 유리하다고 제안한다.
23. 2:29:47
    마무리 디자인 하네스의 사용법과 설계 원칙, 그리고 개선을 위한 피드백 요청을 정리하며 라이브를 마친다.

실무 인사이트

• 초기 AI 디자인에서는 미감보다도 핵심 사용자 여정이 막히지 않는지가 더 중요하므로, 초안은 빠르게 만들고 검토 단계에서 엣지 케이스를 보강하는 방식이 효율적이다.
• 한국 사용자용 서비스는 글로벌 평균 스타일보다 카피라이팅, 여백, 색감, 상태 화면의 관습이 중요하므로, 도메인별 규칙을 미리 토큰화해 두면 결과물의 일관성이 크게 좋아진다.
• 디자이너가 아닌 팀이 AI로 UI를 만들 때는 완성된 화면 생성보다 검증 스크립트와 원칙 문서를 함께 설계하는 편이 실전 품질을 높인다.