ui-ux-pro-max

コミュニティ製の UI/UX ナレッジベース skill です。ローカルの CSV データ（スタイル、配色、フォントの組み合わせ、UX ルール、チャートの種類、技術スタック）と Python の検索スクリプトで構成され、エージェントがページを書く前にデザインシステムを生成します。

ソース: nextlevelbuilder/ui-ux-pro-max-skill
パス: .claude/skills/ui-ux-pro-max · SKILL.md
上流のコミット: d14efff8ed （参考）
インストール方法: ui-ux-pro-max-cli@2.15.0 （skill 独自の CLI）
ライセンス: MIT

各プロンプトを、Codex ネイティブ、Codex + skill、Claude Code ネイティブ、Claude Code + skill の固定 2×2 で表示します。スクリーンショットをクリックするとページ全体を表示できます。インストールと使い方 ↓

得意なこと

skill 自身のドキュメントが主張している強みを、出典とともに挙げています。これは主張であって結果ではありません。下の実際のページと見比べてください。

Web・モバイル・デスクトップの UI 向けの、検索できるローカルのデザインデータ（スタイル、製品別配色、フォントの組み合わせ、UX ガイドライン、グラフの種類、技術スタック）出典
業種別の配色と推論ルールにより、製品の種類ごとにデザインシステムを生成出典
ダッシュボードと分析向けのグラフの種類の推奨出典

テスト範囲：SaaS のランディングページ、データダッシュボード、個人ブログとポートフォリオ。範囲外のプロンプトは「未実行」ではなく「対象外」と表示します。

v0 の実行後に skill の原文と照合したものです（事前に決めたものではありません）。引用は参照コミット時点のリポジトリからのもので、ギャラリーで実行したのは CLI 2.15.0 の出力ですが、description は同じです。

SaaS のランディングページ

landing-saas

Codex ネイティブ

成功

モデル: gpt-6.1-sol · high
所要時間: 7m 51s
トークン: in 424k · out 24.5k
Skill の使用: 該当なし
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-25

a11y 深刻 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Codex + ui-ux-pro-max

成功

モデル: gpt-6.1-sol · high
所要時間: 7m 14s
トークン: in 462k · out 22.0k
Skill の使用: はい
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-25

a11y 深刻 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Claude Code ネイティブ

成功

モデル: claude-opus-5-5 · high
所要時間: 7m 11s
トークン: in 30 · cache 873k · out 37.6k
Skill の使用: 該当なし
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-26

a11y 深刻 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Claude Code + ui-ux-pro-max

成功

モデル: claude-opus-5-5 · high
所要時間: 13m 48s
トークン: in 76 · cache 3.78M · out 59.1k
Skill の使用: はい
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-26

a11y：問題なし▶ 録画

👍 0 · 投票する

ページを開く run.json

データダッシュボード

dashboard

Codex ネイティブ

成功

モデル: gpt-6.1-sol · high
所要時間: 6m 56s
トークン: in 326k · out 25.8k
Skill の使用: 該当なし
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-25

a11y 致命的 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Codex + ui-ux-pro-max

成功

モデル: gpt-6.1-sol · high
所要時間: 9m 00s
トークン: in 1.30M · out 27.7k
Skill の使用: はい
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-25

a11y 致命的 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Claude Code ネイティブ

成功

モデル: claude-opus-5-5 · high
所要時間: 8m 03s
トークン: in 34 · cache 1.08M · out 46.4k
Skill の使用: 該当なし
外部参照: なし
実行日: 2026-10-26

a11y 深刻 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Claude Code + ui-ux-pro-max

成功

モデル: claude-opus-5-5 · high
所要時間: 7m 12s
トークン: in 28 · cache 1.05M · out 49.9k
Skill の使用: はい
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-26

a11y 深刻 1▶ 録画

👍 0 · 投票する

ページを開く run.json

個人ブログとポートフォリオ

blog-portfolio

Codex ネイティブ

成功

モデル: gpt-6.1-sol · high
所要時間: 4m 59s
トークン: in 218k · out 19.8k
Skill の使用: 該当なし
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-25

a11y 深刻 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Codex + ui-ux-pro-max

成功

モデル: gpt-6.1-sol · high
所要時間: 6m 55s
トークン: in 510k · out 20.3k
Skill の使用: はい
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-25

a11y 深刻 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Claude Code ネイティブ

成功

モデル: claude-opus-5-5 · high
所要時間: 10m 28s
トークン: in 24 · cache 661k · out 41.1k
Skill の使用: 該当なし
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-26

a11y 深刻 1▶ 録画

👍 0 · 投票する

ページを開く run.json

Claude Code + ui-ux-pro-max

成功

モデル: claude-opus-5-5 · high
所要時間: 8m 05s
トークン: in 54 · cache 2.22M · out 45.3k
Skill の使用: はい
外部参照: fonts.googleapis.com, fonts.gstatic.com
実行日: 2026-10-26

a11y：問題なし▶ 録画

👍 0 · 投票する

ページを開く run.json

インストールと使い方

この skill は、skill 独自の CLI（ui-ux-pro-max-cli@2.15.0）がエージェントごとに生成します。ギャラリーの実行ではその出力を使用しました。

Claude Code

インストール

npx ui-ux-pro-max-cli@2.15.0 init --ai claude

現在のプロジェクトに .claude/skills/ui-ux-pro-max/ を書き込みます。

使い方

# 対話モード
/ui-ux-pro-max <タスク>

# または、任意のリクエストの末尾に次の 1 文を付ける
Use the ui-ux-pro-max skill.

# ヘッドレス（ギャラリーの実行と同じ）
claude -p '<タスク> Use the ui-ux-pro-max skill.'

すべてのプロジェクトで使えるようにするには、代わりにフォルダを ~/.claude/skills/ui-ux-pro-max/ に置いてください。Claude Code は、リクエストが skill の説明に一致すると、skill を自動的に読み込むこともあります。

Codex

インストール

npx ui-ux-pro-max-cli@2.15.0 init --ai codex

現在のプロジェクトに .agents/skills/ui-ux-pro-max/ を書き込みます。

使い方

# 対話モード：メンションするか、/skills から選ぶ
$ui-ux-pro-max <タスク>

# ヘッドレス（ギャラリーの実行と同じ）
codex exec -s workspace-write '<タスク> Use the $ui-ux-pro-max skill.'

すべてのプロジェクトで使えるようにするには、代わりにフォルダを ~/.agents/skills/ui-ux-pro-max/ に置いてください。Codex も、skill の説明に基づいて skill を自動的に選ぶことがあります。

補足

検索スクリプトの実行には python3（標準ライブラリのみ）が必要です。
上流の README では npm i -g ui-ux-pro-max-cli を推奨していますが、ギャラリーでは代わりにバージョンを固定して npx を使うため、グローバルには何もインストールしません。