Devotd Github
새 소식코딩 에이전트

albertirgi/replica — 참고 화면 기반 UI 재구성 스킬

albertirgi/replica는 사이트나 화면 녹화를 바탕으로 인터페이스 복제본을 만들고 네 축으로 비교하는 코딩 에이전트용 스킬이다.

저장소 정보albertirgi/replica ↗

albertirgi/replica는 사이트나 화면 녹화를 바탕으로 인터페이스 복제본을 만들고 네 축으로 비교하는 코딩 에이전트용 스킬이다.

GitHub 설명: Rebuild any UI from a reference and prove it with a score. An Agent Skill for Claude Code and other coding agents: captures a site, screenshot or screen recording, then scores the clone on layout, style, pixels and motion until it passes.

스타
★ 11
포크
0
언어
JavaScript
라이선스
MIT
원문 보기 ↗GitHub에서 보기 ↗

albertirgi/replica는 참고 사이트, 스크린샷, 화면 녹화를 바탕으로 인터페이스를 재구성하는 코딩 에이전트용 스킬이다. Claude Code와 다른 코딩 에이전트에서 사용할 수 있다. 저장소 설명에 따르면 복제본을 배치, 스타일, 픽셀, 움직임 네 축으로 채점하고 기준을 통과할 때까지 개선하는 흐름을 제공한다. 특정 버전의 출시 정보는 주어진 자료에 없다.

이 도구는 렌더링된 페이지를 디자인 토큰과 요소별 상자, 계산된 스타일을 담은 명세로 바꾸고 복제본과 비교한다. 채점 결과는 네 축으로 나뉘며, 수정할 항목의 영향과 예상 점수 이득을 보고서와 기계 판독 자료에 기록한다. 비교 명령은 설정한 기준에 도달하지 못하면 실패 코드로 끝난다. README는 비교에 가상 시계와 고정된 실행 조건을 쓰고, 기준에 도달하거나 최대 8회 반복하면 종료한다고 안내한다. 참고 화면과 복제본의 차이를 에이전트가 반복해서 확인하고 고치도록 돕는 구조다.

저장소에는 복제본과 참조본의 시험 자료, 자체 시험 스크립트가 있어 기본 검증 흐름은 확인할 수 있다. 다만 범용 시각 비교가 얼마나 정확한지는 README 설명만으로 독립 검증되지 않는다. 따라서 이 저장소에서 확인되는 것은 비교와 반복 개선을 위한 절차이며, 다양한 화면에서도 결과가 정확하다고 단정할 근거는 주어진 자료에 없다.