디자이너, AI 부사수를 거느린 작은 디렉터가 되다
피그마(Figma) 디자인 플로우 개선을 위해 AI 기반 개발 도구인 ChatGPT, Gemini, Claude, Codex를 활용하여 프로토타입을 개발
초기에는 ChatGPT와 Gemini를 활용하여 기획 및 설계, Claude를 통해 코드 구현을 시도했으나, 코드 품질 및 유지보수 문제 발생
코덱스(Codex)를 도입하여 코드 품질과 맥락 유지 측면에서 개선을 경험하고, 베타 런칭(Beta Launch)을 준비
플래그(Flag) 시스템 도입으로 QA 시간과 품질을 향상시키고, 삭제 기능 구현 과정에서 엣지 케이스(Edge Case) 처리의 중요성을 인지
AI 기반 개발 환경에서 디자이너는 제품 설계, 정책 결정, 운영 책임 등 핵심적인 역할에 집중해야 함을 강조
바이브 코딩(Vibe Coding)의 기획 및 설계 과정
저자는 ChatGPT와의 대화를 통해 아이데이션(Ideation)과 기획 초안을 만들고, Gemini를 활용하여 개발 친화적인 설계서 형태로 정리했다.
ChatGPT 활용: 서비스의 목표, 기존 방식의 문제점, 사용자 경험(User Experience)에 대한 논의
Gemini 활용: GPT의 기획 내용을 바탕으로 개발에 필요한 제품 설계 문서 생성
설계 문서의 중요성: 초기 기획 단계에서 맥락(Context)을 충분히 확보하여, 개발 과정에서 발생할 수 있는 문제점 최소화
이러한 과정을 통해, 저자는 초기 기획 단계에서부터 제품의 방향성을 명확히 설정하고, 개발팀과의 원활한 소통을 위한 기반을 마련했다.
AI 기반 코드 생성 도구의 활용과 한계
저자는 Claude를 사용하여 코드 구현을 시도했으나, 코드 품질 및 유지보수 측면에서 어려움을 겪었다.
Claude의 한계: A를 수정하면 B에서 문제가 발생하고, B를 수정하면 C가 안 되는 등 의존성 관리(Dependency Management)의 어려움
작업 히스토리(History) 관리: 작업 히스토리 저장, 작업 전후 분석 스킬을 활용했지만, 일관성 있는 제품 맥락 유지(Consistent Product Context)에 실패
코덱스(Codex)의 등장: 코덱스는 프로젝트 전체를 함께 보고 작업하여, 맥락 유지 및 대응 퀄리티(Contextual Awareness) 측면에서 Claude보다 높은 만족도 제공
결과적으로, AI 코드 생성 도구는 초기 개발 속도를 높일 수 있지만, 전체적인 제품 맥락 관리(Overall Product Context Management)는 여전히 어려운 과제임을 보여준다.
베타 제품 개발을 위한 핵심 기능 선정
저자는 코덱스(Codex)와 협업하여 베타 제품의 범위를 결정하고, 핵심 기능에 집중했다.
최소 기능 제품(Minimum Viable Product, MVP) 정의: 피그마(Figma) 디자인 동기화 및 연결선 기능 구현에 집중
코덱스(Codex)의 역할: 기능 우선순위 결정 및 개발 일정 관리 지원
플래그(Flag) 시스템 도입: 개선 전후 디자인 코드를 함께 유지하여, QA 시간과 품질 향상
이러한 과정을 통해, 저자는 핵심 기능에 집중(Focus on Core Features)하고, 불필요한 기능 추가를 최소화하여, 베타 제품의 성공적인 런칭을 준비했다.
엣지 케이스(Edge Case) 처리를 위한 제품 정책 수립
저자는 삭제 기능 구현 과정에서 엣지 케이스(Edge Case) 처리의 중요성을 깨달았다.
삭제 기능의 문제점: 삭제 정보가 브라우저에 저장되어, 삭제 상태의 일관성(Consistency) 문제 발생
엣지 케이스의 복잡성: 브라우저 A와 B 간의 삭제 상태 동기화, 동시 편집 시 삭제 우선순위 등 다양한 경우의 수 발생
단순하고 일관된 제품 정책의 중요성: 예외 처리가 많아질수록 코드 구조가 복잡해지고, AI의 구현 난이도 증가
결과적으로, 저자는 단순한 규칙(Simple Rules)을 통해 제품의 일관성을 유지하고, AI 기반 개발의 효율성을 높이는 방법을 모색했다.
디자이너의 역할 변화와 AI 부사수
저자는 AI 기반 개발 환경에서 디자이너의 역할 변화를 강조하며, AI 부사수를 활용하는 방식을 제시한다.
디자이너의 역할 변화: UI 배경색, 폰트 크기 조정 등 세부적인 작업보다, 제품 설계, 정책 결정, 운영 책임(Product Design, Policy Making, Operation Responsibility)에 집중
AI 부사수 활용: AI는 뚝딱 잘 만들지만, 정책, 운영, 책임(Policy, Operation, Responsibility)은 사람이 계속 관리해야 함
디자이너의 역량 강화: AI 부사수를 활용하여, 제품을 끝까지 끌고 가는 작은 디렉터(Small Director)의 역할 수행
결론적으로, AI 기반 개발 환경에서 디자이너는 창의적인 아이디어를 제품으로 구현하는 리더(Leader)로서의 역할을 수행해야 한다.