Claude Code에 시각적 출력 기능을 추가했습니다: 코드베이스를 애니메이션 워크스루로 변환하기
I gave Claude Code a visual output: Turn codebases into animated walkthroughs
핵심 요약
코드베이스와 기술 문서를 애니메이션 시각화로 변환해 주는 도구 'Dagflo'를 소개합니다.
- Dagflo 도구 — 코드베이스와 시스템을 단계별 애니메이션으로 시각화함
- 기술적 소통 개선 — 복잡한 코드 구조를 명확하게 전달하여 협업 효율을 높임
- MCP 지원 — Claude Code와 같은 에이전트와 연동하여 시각화 생성 가능
- 지속적 개선 — 사용자 피드백을 수용하며 오픈소스 전환도 고려 중임
다들 안녕!
소프트웨어 팀을 위한 애니메이션 시각화 설명 도구인 Dagflo라는 개인 프로젝트를 만들고 있어!
Dagflo는 Claude, Codex, Cursor 같은 코딩 에이전트가 코드베이스, 풀 리퀘스트, 시스템, 아티클, 다이어그램, 알고리즘을 단계별 애니메이션 시각화 자료로 바꿔주게 해주는 툴이야.
메타에서 4년 동안 GraphQL 인프라 쪽 일하면서 느낀 건데, 기술적 지식이 제대로 전달이 안 돼서 회의나 메신저 대화, 화이트보드에 쏟아붓는 엔지니어링 시간만 엄청나게 날리고, 결국 잘못된 결정 내리는 꼴을 너무 많이 봤거든.
요즘 코딩 에이전트들이 코드베이스 전체를 다 이해하긴 하는데, 설명하는 방식은 여전히 텍스트 뭉치나 깨진 ASCII 아트, 아니면 정적인 Mermaid 다이어그램 수준에 머물러 있잖아.
동적인 시스템을 설명하는 데 정적인 도구만 쓰고 있는 꼴이지.
그래서 Dagflo를 만들었어. 기술 시스템이 실제로 어떻게 돌아가는지 눈으로 직접 보고 싶었거든.
지난 1년 동안 진짜 열정 쏟아서 만든 프로젝트야. 드디어 공개하게 돼서 너무 기쁘다! 이 서브레딧에 반응 보려고 몇 번 글 올렸었는데, 이제 드디어 준비가 끝났어!
지난 1년 동안 Claude랑 Codex 섞어가면서 Dagflo를 개발했어. Dagflo는 Claude Code 같은 코딩 에이전트가 어떤 기술적 개념이든 시각화할 수 있게 해주는 도구야.
얼리 액세스 시작했어 dagflo.com
MCP SETUP
원격 MCP는 무료니까 한번 써봐 :)
Dagflo 업데이트 소식은 내 X에서 팔로우해줘: https://x.com/deepok102
계속해서 툴 개선하고 있으니까 피드백 있으면 편하게 남겨줘!
