educlopez/ui-craft

何を解決するか

AIコーディングエージェントは、プロフェッショナルなデザインセンスや使いやすさに欠ける、汎用的で質の低いユーザーインターフェース（「AI slop」と呼ばれる）を生成することがよくあります。UI Craftは、AIエージェントに対して、意見の反映されたデザインルール、検証ツール、および構造化されたワークフローを提供することで、生成されるUIが本番環境に耐えうるデザイナー品質であることを保証します。

仕組み

UI Craftは、AIコーディングハーネス（Claude Code、Cursor、またはGeminiなど）にスキルまたはCLIツールとして統合されます。デザイン制御のレベルをスケールさせるために、4つの段を持つ「ラダー（はしご）」を使用します：

• Rung 0 (Ask): エージェントはデザインの知識を使用して、シンプルなプロンプトに基づいて結果を改善します。
• Rung 1 (Direct): ユーザーは特定のスラッシュコマンド（例：/craft、/polish、/animate）を使用して、集中したデザインパスをトリガーします。
• Rung 2 (Persist): ブリーフやトークンなどの永続的なデザインコンテキストが .ui-craft/ に保存され、セッションをまたいで一貫性を維持します。
• Rung 3 (Enforce): クオリティゲート、MCPサーバー、およびCI検出器が、UIが退行せず、10項目の受け入れ基準を満たしていることを保証します。

また、既存のプロジェクトスタイルを分析するディスカバリーフェーズや、クラフトレベル、モーションの強度、視覚的な密度を調整するための「ノブ（つまみ）」も備えています。

対象者

自身がエキスパートデザイナーである必要はなく、高精度でプロフェッショナルなUIをリリースしたい、AIコーディングエージェントを使用している開発者。

ハイライト

• Scoreable Critiques: ニールセンの10のユーザビリティ・ヒューリスティックと6つの古典的なデザイン法則に基づいた、根拠のあるスコアカードを生成します。
• Stack-Agnostic: さまざまなフレームワークやAIハーネスにわたって動作します。
• Comprehensive Command Set: ワイヤーフレーム作成 (/shape) から本番環境向けの強化 (/harden) まで、25種類の専門的なスラッシュコマンドを提供します。
• Integrated Quality Gates: 「AI slop」が本番環境に到達するのを防ぐために、MCPゲートとレビューエージェントが含まれています。