educlopez/ui-craft

解決する問題

UI Craft は、フロントエンド開発における「AIスロップ」問題（AIコーディングエージェントが一般的で未完成、または視覚的に魅力のないユーザーインターフェースを生成することが多い）に対処します。AIエージェントにプロフェッショナルなデザイン知識、意見のあるルール、検証ツールを提供し、結果として得られるUIが本番品質であり、確立されたデザイン法則とユーザビリティヒューリスティックに従うことを保証します。

仕組み

UI Craft は、スキルまたはCLIを介してインストールできるデザインエンジニアリングシステムとして機能します。AIコーディングハーネス（CursorやClaude Codeなど）に統合され、エージェントを構造化されたデザイン成熟度の「はしご」に導きます：

• ラング0（質問）： 基本的なインストールにより、エージェントは既存のプロンプトを使用してより良いUIを生成できます。
• ラング1（直接）： 特定のサーフェスに焦点を当てたパス用に、特定のスラッシュコマンド（例：/craft、/polish、/animate）を提供します。
• ラング2（永続化）： プロジェクトに保存されたブリーフとトークンを介して、永続的なデザインコンテキストを確立します。
• ラング3（強制）： 品質ゲート、レビューエージェント、CIチェックを実装して、デザインの退行を防ぎます。

このシステムは、既存のプロジェクトスタイルを分析するための発見フェーズを使用し、「ノブ」（クラフトレベル、モーション強度、視覚密度）を使用して出力を調整します。また、ニールセンのヒューリスティックと古典的なデザイン法則に基づく決定論的スコアリングシステムを含み、UIを客観的に批評します。

対象者

AIコーディングエージェントを使用する開発者向けに設計されており、毎回プロのデザイナーを必要とせずに、高品質でデザイナーレベルのユーザーインターフェースを出荷したいと考えています。

ハイライト

• 決定論的批評： 10のユーザビリティヒューリスティックと6つのデザイン法則に基づいて、スコア可能なスコアカードを生成します。
• クロスハーネスサポート： Claude Code、Cursor、Codex、Gemini、OpenCodeと互換性があります。
• デザインメモリ： .ui-craft/ を使用して、セッション間でデザインブリーフとトークンを永続化します。
• 品質ゲート： MCPゲートと ui-craft-detect を含み、CI/CD統合によりUIが退行しないようにします。
• スタイルバリアント： ミニマル、エディトリアル、高密度ダッシュボードの美学に特化したプリセットを提供します。