用途
AI に「もっと現代的な画面にして」と頼むだけでは、配色、書体、レイアウトがかみ合わないことがあります。UI UX Pro Max は AI アシスタント向けのデザイン Skill です。製品の種類、視覚スタイル、配色、書体、UX の指針を検索し、設計の方向を考える材料にできます。公式の中心となる Skillでは、アクセシビリティ、操作、レスポンシブ表示の確認も重視しています。
提案は検討材料であり、ブランドや利用者、製品の制約を自動で理解するものではありません。スタイル名だけを指定するより、先に制約を伝える方が役立つ、というのが当サイトの編集上の判断です。実測結果ではありません。
利用場面
新しいページの構成を考えるとき、既存 UI の見た目をそろえるとき、フォームやナビゲーション、スマートフォン表示を見直すときに利用できます。公式プロジェクトには技術スタック別の指針もあり、既存実装の条件を踏まえて調べられます。
チームにデザインシステムがあるなら、使うべき部品、色、文字の規則を明示してください。検索結果はチームで検討する案として扱います。
使用例
スマートフォン向けの予約フォームを追加する場合、例えば次のように依頼できます。
UI UX Pro Max で予約フォームの配置、書体、操作の指針を調べてください。利用者はスマートフォンで入力します。既存のブランドカラーとフォーム部品は維持してください。方向性を二つ示して長所と短所を説明し、ラベル、エラー表示、キーボード操作、狭い画面での折り返しを確認してください。
これは当サイトが作成した仮の例で、この Skill を使ってフォームを制作・検証した結果ではありません。提案は実際の文言、端末、利用手順と照らし合わせて判断してください。
制限
検索データと推薦規則は候補を絞る助けになりますが、ブランド、法規制、利用者の要求への適合は保証しません。アクセシビリティのチェックリストは、キーボード、スクリーンリーダー、コントラストの実機確認に代わるものではありません。人による確認とテストが必要です。データ件数や対応プラットフォームは更新されるため、最新情報は公式資料を参照してください。
当サイトは公式資料を整理し、編集上の判断を加えています。成果物の品質や作業速度、すべての環境での動作は実測していません。
導入方法
公式 READMEにある Codex CLI 向けの手順です。ターミナルで CLI をインストールし、Skill を使うプロジェクトで初期化します。
npm install -g ui-ux-pro-max-cli
uipro init --ai codex
検索スクリプトには Python 3 が必要です。python3 --version で確認できます。これらのコマンドは環境やプロジェクトを変更しますが、このページは表示するだけで実行しません。Claude Code の Marketplace を含む他の導入方法は公式 README を参照してください。