plannotator/effective-html

해결하는 문제

AI 에이전트가 고품질의 자체 포함형 HTML 아티팩트를 생성할 수 있도록 전문적인 기술 세트를 제공합니다. 이로 인해 에이전트는 텍스트 기반 응답에 그치지 않고, 개발자와 디자이너에게 더 나은 맥락과 명확성을 제공하는 웹사이트 레이아웃, 프로토타입, 다이어그램과 같은 시각적 도구를 생성할 수 있습니다.

작동 방식

이 프로젝트는 창의적 방향성과 기술적 신뢰성을 분리하는 6가지 독립된 기술로 기능을 구성합니다. 일반적인 html 기술은 라우팅과 광범위한 요청을 처리하며, 전문화된 기술은 특정 정밀도 수준을 관리합니다: html-wireframe는 저정밀도 레이아웃, html-prototype는 상호작용 기능, html-diagram는 시스템 시각화, html-plan은 로드맵용입니다. 별도의 design-artifact 기술은 특정 시각적 스타일을 강제하지 않고 디자인 프로세스를 제공합니다.

대상 사용자

Claude Code나 Codex와 같은 AI 코드 에이전트 사용자 중, 코드나 텍스트 외에도 시각적 문서, 상호작용 프로토타입, 아키텍처 다이어그램을 생성하고 싶어하는 사용자를 대상으로 합니다.

주요 특징

• 전문적인 아티팩트: 저정밀도 웹사이트 레이아웃부터 완전히 상호작용 가능한 프로토타입까지 다양한 출력을 지원합니다.
• 자체 포함형: 생성된 모든 아티팩트는 반응형이며, 브라우저에서 검증된 접근성 기능을 갖추고 있습니다.
• 모듈식 설치: CLI 도구를 통해 전체 컬렉션 또는 개별 기술로 설치할 수 있습니다.
• 에이전트 통합: Claude Code 및 Codex에 대한 네이티브 플러그인 지원이 제공됩니다.