Claude Code Archify: 아이디어를 즉시 시각화하는 AI 아키텍처 다이어그램 생성 가이드
Claude Code와 같은 AI 에이전트를 사용하여 아이디어, 계획 또는 코드베이스를 대화형 아키텍처 다이어그램으로 즉시 변환하는 방법을 안내합니다. 복잡한 시스템을 명확하게 이해하고 문서화해야 할 때 유용합니다. 출처: https://github.com/tt-a1i/archify
Archify란 무엇인가요?
Archify는 Claude Code, Codex CLI, Cursor와 같은 AI 에이전트와 통합되어 텍스트 설명만으로도 아름답고 상호작용 가능한 아키텍처 다이어그램을 생성해주는 도구입니다. 별도의 저장소 설정 없이 아이디어 구상 단계부터 코드베이스 분석까지, 시스템 아키텍처를 시각적으로 표현할 수 있도록 돕습니다.
Archify 설치 및 기본 사용법
Archify를 AI 에이전트 환경에 추가하는 것은 간단합니다. 다음 명령어를 사용하여 전역적으로 설치할 수 있습니다.
npx skills add tt-a1i/archify -g
설치가 완료되면, AI 에이전트에게 Archify를 사용하도록 지시하고 시각화하려는 아키텍처에 대한 설명을 제공하면 됩니다.
시작하기: 아이디어 설명하기
AI 에이전트에게 Archify를 사용하도록 요청하고, 설명하려는 시스템의 구성 요소를 자연어로 입력하세요. 예를 들어, 웹 요청 처리 과정을 시각화하고 싶다면 다음과 같이 지시할 수 있습니다.
Use Archify to diagram a web request: Browser calls the API,
the API checks Redis, and a cache miss queries PostgreSQL and fills the cache.
이 프롬프트를 받은 에이전트는 제공된 설명을 바탕으로 상호작용 가능한 아키텍처 다이어그램을 생성합니다.
Archify의 추가 기능 및 활용
다이어그램 생성 후에도 AI 에이전트와 계속 대화하며 다이어그램을 수정하거나 상세 정보를 추가할 수 있습니다. 예를 들어, 다음과 같은 후속 요청을 할 수 있습니다.
- "Add authentication" (인증 기능 추가)
- "Highlight the cache-miss path" (캐시 미스 경로 강조)
- "Switch to the light theme" (라이트 테마로 전환)
Archify는 저장소가 없어도 즉시 사용 가능하며, 설명만으로 다이어그램을 만들거나 에이전트가 저장소를 읽어 소스 기반 아키텍처 다이어그램을 생성하도록 할 수도 있습니다.
활용 사례
상황 1: 초기 아이디어 구체화 단계
- 사용자: 새로운 웹 서비스를 기획 중인 기획자
- 목표: 서비스의 핵심 흐름을 빠르게 시각화하여 팀원들과 공유하고 싶음.
- 사용 단계: Archify 설치 후, AI 에이전트에게 "Diagram a user registration flow: User signs up via the website, data is validated, stored in the database, and a confirmation email is sent." 와 같이 서비스의 기본 흐름을 설명.
- 결과: 설명에 기반한 초기 아키텍처 다이어그램을 얻어 서비스 구조에 대한 빠른 이해와 논의를 시작할 수 있게 됨.
상황 2: 코드 리팩토링 전 시스템 이해
- 사용자: 기존 레거시 시스템의 리팩토링을 담당하는 개발자
- 목표: 복잡하게 얽힌 시스템 컴포넌트 간의 관계를 명확히 파악하고 싶음.
- 사용 단계: Archify를 사용하여 "Diagram the interaction between the payment gateway, the order processing service, and the inventory management system." 와 같이 시스템의 특정 부분에 대한 상호작용을 시각화.
- 결과: 시스템의 의존성과 데이터 흐름을 시각적으로 명확하게 파악하여 리팩토링 계획 수립 및 잠재적 위험 요소 식별에 도움을 받음.