Devotd Github
新着コーディングエージェント

albertirgi/replica — 参考画面ベースのUI再構築スキル

albertirgi/replicaは、サイトや画面録画をもとにインターフェース複製版を作り、4つの軸で比較するコーディングエージェント向けスキルである。

リポジトリ情報albertirgi/replica ↗

albertirgi/replicaは、サイトや画面録画をもとにインターフェース複製版を作り、4つの軸で比較するコーディングエージェント向けスキルである。

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のほか他のコーディングエージェントでも利用できる。リポジトリの説明によると、複製版をレイアウト、スタイル、ピクセル、動きの4軸で採点し、基準を通過するまで改善する流れを提供する。特定のバージョンのリリース情報は、提示された資料にはない。

このツールはレンダリングされたページをデザイントークン、要素ごとのボックス、計算済みスタイルを含む仕様に変換し、複製版と比較する。採点結果は4つの軸に分けて示され、修正すべき項目の影響と予想されるスコア増分は、レポートと機械可読の資料に記録される。比較コマンドは、設定した基準に届かない場合は失敗コードで終了する。READMEは比較に仮想クロックと固定の実行条件を使い、基準に到達するか最大8回反復した時点で終了すると説明している。参考画面と複製版の差異をエージェントが繰り返し確認し、修正する助けをする構成である。

リポジトリには複製版と参照版のテスト資料および独自のテストスクリプトがあり、基本的な検証の流れは確認できる。ただし、一般的な視覚比較の精度がどの程度かについては、READMEの説明だけでは独立して検証できない。したがって、このリポジトリで確認できるのは比較と反復的な改善のための手順であり、不同な画面でも結果が正確だと断定できる根拠は提示された資料にない。