AI 디자인 하네스 만들기 + 이너서클 2기 모집 공지
한 줄 핵심
AI 디자인 자동화를 실무 수준으로 끌어올리려면 모델 성능만 믿기보다, 입력 추출·중간 산출물·검증·병렬 실행을 분리한 하네스를 설계해야 한다.
시간별 요약
-
0:24
오랜만의 라이브를 열고, 지난주 진행한 한해스톤 행사 후기와 문제풀이 해설, 그리고 이너서클 2기 모집 공지를 함께 진행한다.
-
3:00
이너서클은 초급 이후 단계의 AI 활용자들이 서로의 워크플로우와 병목을 나누며 성장하는 커뮤니티로, 토론뿐 아니라 함께 코딩하는 방향으로 확장됐다.
-
6:03
행사의 핵심 문제의식은 AI 디자인 결과물이 아직 현업 디자이너 수준에 못 미치므로, 디자인 자동화를 실제 업무에 쓸 수 있는 수준까지 끌어올리자는 데 있다.
-
7:00
UI/UX 디자인은 상당 부분 룰베이스이므로, 잘 정의된 규칙과 MCP 연동만으로도 디자인 작업의 상당 부분을 자동화할 수 있다고 본다.
-
9:03
다만 디자인 이해도가 낮으면 하네스도 제대로 만들기 어렵기 때문에, 개발자가 바이브 코딩보다 훨씬 많은 시행착오를 겪듯 디자이너 사고방식을 학습하는 과정이 필요하다.
-
11:00
한해스톤은 기존 디자인과 PRD를 입력으로 받아 증권앱·데이팅앱 같은 신규 서비스를 만드는 과제를 통해, 범용적인 디자인 하네스를 설계하는 실전 행사였다.
-
16:00
참여자들은 실전적인 과제와 팀 협업 경험을 긍정적으로 평가했지만, 하네스 개념과 목표를 충분히 설명하지 못해 초반 싱크가 맞지 않은 점은 아쉬움으로 남았다.
-
19:00
실제 결과물은 2시간이라는 짧은 시간과 낮은 하네스 완성도로 인해 편차가 있었지만, 일부 팀은 현업 디자이너가 만든 것 같은 수준의 여행 예약 화면을 뽑아냈다.
-
27:01
하네스 구현은 Git 저장소를 클론하고 VS Code에서 연 뒤, MCP 서버를 실행하고 팬팟을 클로드 코드와 연결하는 방식으로 시작한다.
-
34:00
핵심은 입력과 출력을 바로 잇지 않고, 기존 디자인 추출·리서치·화면 기획·UI 저작 같은 중간 단계를 명확히 정의해 AI가 사람처럼 사고하도록 만드는 것이다.
-
47:00
중간 단계가 정리되면 디자인 토큰, 아이콘 셋, 컴포넌트, 화면 상세 명세를 순차적으로 생성하고, 최종적으로 팬팟에 옮겨 그리는 실행 단계로 넘어간다.
-
52:00
이미지를 넣어 하네스 설계를 지시하자 단계 구조와 의존관계, 와이어프레임 누락, 상태 정의 부족 같은 구체적인 피드백이 나오며 설계가 빠르게 보정된다.
-
1:07:08
하네스의 장점은 중간 산출물이 모두 문서화되어 문제 지점을 역추적하기 쉽고, 검증 에이전트를 병렬로 둘 수 있어 개선 포인트를 좁혀서 수정할 수 있다는 점이다.
-
1:51:15
기존 디자인에서 해요체 라이팅 규칙, 색 팔레트, 컴포넌트, 유저 페르소나, 화면 전이, 와이어프레임까지 추출해 단계별로 정리하자, 병렬 처리와 캐싱 효과가 크게 나타났다.
-
2:37:08
이번 경험을 통해 에이전트를 위한 도구는 사람이 쓰기 좋은 UI보다 에이전트가 자연스럽게 결론에 도달하는 UX가 중요하며, MCP 자체도 에이전트 친화적으로 더 발전할 필요가 있다는 점을 느꼈다.
-
3:17:05
기존 하네스가 개발 자동화에만 치우쳐 있다면, 실제로는 기획·디자인·검증까지 포함한 소프트웨어 개발 프로세스 전체를 자동화 대상으로 봐야 한다.
실무 인사이트
- 반복 작업을 AI로 돌릴 때는 프롬프트만 다듬기보다 입력 추출·기획·검증을 분리한 하네스를 먼저 설계해야 결과물이 안정된다.
- 하네스는 길게 만들수록 좋은 것이 아니라, 병렬화·캐싱·검증 분리를 통해 빠르게 반복할 수 있어야 실무에서 쓸 수 있다.
- 결과물이 마음에 들지 않을 때는 최종 화면만 고치지 말고, 어떤 중간 단계가 원인이었는지 역추적해 하네스 자체를 개선해야 한다.