OrRon/EpicInfographics

해결하는 문제

일반적인 AI 생성 인포그래픽에서 흔히 나타나는 "AI 제작" 느낌을 제거합니다. 이는 종종 일반적인 그리드, 스톡 템플릿 및 평면적인 미니멀리즘에 의존하지만, AI 에이전트에게 전문적인 스튜디오 수준의 원칙으로 디자인하도록 가르침으로써 해결됩니다. 데이터가 단순히 페이지에 배치되는 것이 아니라 시각적으로 장면에 통합되도록 보장하며, 차트가 수학적으로 정확하고 색맹 안전한지 확인합니다.

작동 방식

이 프로젝트는 AI 에이전트가 브리프에서 최종 이미지로 넘어가기 위해 따르는 "스킬"(지침 및 참조 세트)을 제공합니다. 프로세스는 다음을 포함합니다:

1. 장면 기반 디자인: 페이지 대신, 에이전트는 데이터가 장면 내부에 존재하는 "장소"(예: 청사진, 자연주의자의 폴리오, 또는 어두운 극장)를 생성합니다.
2. 데이터 기반 기하학: 시각적 요소는 눈대중이 아닌 산술(예: 로켓의 높이가 특정 비율에 해당)을 통해 계산됩니다.
3. 기술 파이프라인: 에이전트는 HTML/CSS를 생성하며, 이는 헤드리스 Chromium(Playwright 통해)과 ffmpeg를 사용하여 고해상도 PNG 또는 MP4/GIF 애니메이션으로 렌더링됩니다.
4. 품질 게이트: 필수 렌더-검토-수정 루프는 체크리스트를 사용하여 대시보드 템플릿처럼 보이는 디자인을 실패로 처리합니다. 사전 점검 스크립트는 또한 텍스트 충돌, 클리핑 및 가독성을 검사합니다.

대상 독자

표준 AI 출력의 일반적인 미학을 피하면서 고품질, 전문가 수준의 인포그래픽 및 데이터 시각화가 필요한 AI 에이전트(Claude Code, Codex, Factory Droid 또는 Pi 등) 사용자.

하이라이트

• 다양한 디자인 언어: 청사진, 다크 글래스, 내추럴리스트 플레이트, 아이소메트릭 월드 및 레트로 프린트와 같은 스타일에 대한 특정 사양이 포함되어 있습니다.
• 결정론적 애니메이션: 브라우저에서 프레임을 스크럽하여 HTML/CSS 애니메이션을 비디오로 변환하며, 최종 프레임이 승인된 정지 이미지와 일치하도록 보장합니다.
• 진실된 기하학: 막대가 0에서 시작하고 영역이 값에 따라 정확하게 비례하도록 강제합니다.
• 자동화된 검증: 레이아웃 오류를 방지하기 위해 색맹 검사기 및 글리프 기하학 측정이 포함되어 있습니다.