本文へ移動
株式会社織翔
← コラム一覧に戻る
AI活用17分で読める

Codexが別人になるSkill/Plugin 9選|設計・UI・テスト・SEOまで導入手順つき

Codexを設計・実装・UI・ブラウザテスト・Skill作成・説明・SEOまで強化するSkill/Plugin 9選を、特徴、導入手順、利用例、安全な選び方とともに紹介します。

#Codex#Skill#Plugin#AIエージェント#開発効率化

執筆・監修:

繰り返し困っている作業から一つ選ぶ

要件整理、UI設計、ブラウザ確認などの手順を毎回説明しているなら、その作業を扱うSkillやPluginが候補になります。この記事では、用途の異なる9候補の導入方法と利用例を紹介します。

選び方は、現在困っている工程を一つ決め、早見表から必要な候補だけを試す方法を推奨します。既に使っているSkillやツールと役割が重なる場合は、追加する前に既存のものを使えるか確認してください。

各候補の仕様・配布手順は2026年8月28日に公式資料を確認した内容です。ローカルではCodex CLI 0.150.1の導入コマンドのhelpと、既存のContext7 Plugin 1.0.1の状態・定義を確認しました。候補の新規インストール、OAuth認証、発動結果の比較は行っていません。

目的から選ぶ早見表

表は横にスクロールできます

目的推奨候補導入前に確認する権限
設計から検証まで開発工程を型化するSuperpowersSkillの指示、Hooks、サブエージェント、シェル実行
確定事項を実装指示書へ変換するimplementation-brief同じ会話または入力メモの読み取り範囲
実装前に要件を質問で詰めるgrill-me会話コンテキストとSkill内の追加指示
業務手順をSkillとして再利用するskill-creatorファイル作成、評価スクリプト、外部CLI
Web UIを設計・実装するBuild Web Appsファイル変更、ブラウザ、MCP、外部サービス
実ブラウザで表示と操作を確かめるplaywright-cliブラウザプロファイル、Cookie、画面入力、保存先
ライブラリの最新仕様とコード例を調べるContext7外部通信、OAuth、質問内容の送信、Read権限
難しい内容を図中心で説明するELI5入力資料、HTML出力先、外部アセット読込
WebサイトをSEO観点で監査するCodex SEOネットワーク、ブラウザ、各API、認証情報、出力先

SkillとPluginの違い

OpenAI公式ドキュメントでは、Skillは、特定の作業を安定して進めるための指示、参考資料、任意のスクリプトをまとめた仕組みとして説明されています。中心になるのはSKILL.mdです。

一方のPluginは、1つ以上のSkillに加え、必要に応じてMCPサーバー、外部サービスとのConnector、Hooksなどもまとめて配布できます。

Codex CLIでは、/skills$からSkillを明示的に選択できます。Pluginは/pluginsで検索・導入し、導入後に新しいセッションを開始して使います。

詳しい仕様は、OpenAI公式のSkill作成ガイドPluginガイドで確認できます。

1. Superpowers:Codexに開発の「型」を入れる

Superpowersは、Jesse Vincent氏(obra)が公開している、AIコーディングエージェント向けの開発方法論です。単に便利なプロンプトを集めたものではなく、アイデアの整理から設計、計画、テスト駆動開発、レビュー、完了確認までを一連の工程として扱います。

導入手順

Superpowersは、Codexの公式Plugin Marketplaceから導入できます。Codexのセッションで次を入力し、Superpowersを検索してインストールします。

/plugins

インストール後は、新しいCodexセッションを開始します。SuperpowersのSkillは依頼内容に応じて自動的に選択されるため、毎回Skill名を指定する必要はありません。

利用例

既存の受注管理システムにCSV一括出力を追加したい。
実装に入る前に、要件、対象外、権限、件数上限、検証方法を整理して。

このような依頼では、まず要件整理と設計の合意を作り、その後に実装計画やTDDへ進む流れを作れます。

向いている人

Superpowersは、Codexへ大きな作業を任せたときに、確認不足のまま実装が進むことを避けたい人に向いています。工程ごとの承認や検証が増えるため、数行の軽微な修正より、複数ファイルにまたがる機能開発で効果を感じやすいPluginです。

2. implementation-brief:確定事項を引き継ぐ

Orito Codex Pluginsで公開するSkillです。会話や意思決定メモを、確定事項・提案・未決事項が分かる実装指示書へ整理します。

codex plugin marketplace add orito-inc/codex-plugins
codex plugin add implementation-brief@orito

新しいセッションで、意思決定メモと一緒に呼び出します。

$implementation-brief
以下のメモを実装指示書にしてください。
- 受注一覧に、現在の絞り込み条件でCSV出力を追加する
- 管理者だけが実行できる
- 出力上限は未決定

同じ会話で要件整理を終えた場合は、そのまま呼び出せます。出力例と確認事項はimplementation-briefの紹介を参照してください。

3. grill-me:曖昧なアイデアを質問で詰め切る

grill-meは、Matt Pocock氏のSkill集に含まれる、ユーザーへの質問に特化したSkillです。名前のとおり、計画や設計について容赦なく質問し、判断の枝を残さないことを狙います。

grill-meは質問処理の入口で、実際の質問ルールは同じリポジトリのgrilling Skillが担います。実装を始めるためのSkillではなく、実装前に人とCodexの認識をそろえるためのSkillです。

導入手順

Codexを含む対応エージェントには、skills CLIから対象Skillだけを導入できます。

npx skills add https://github.com/mattpocock/skills --skill grill-me

インストーラーで導入先を聞かれた場合は、Codexを選択します。Skillが表示されない場合は、Codexを再起動して新しいセッションで確認します。

利用例

$grill-me
社内向けの問い合わせ管理画面を作りたい。
実装前に、決めておくべきことを質問してください。

対象利用者、問い合わせ状態、通知、権限、検索条件、保持期間、監査ログなど、最初の依頼では抜けやすい判断を順番に掘り下げられます。

使うときのポイント

質問数が多くなることがあるため、すでに決まっている前提は最初にまとめて渡すと効率的です。また、質問が終わっただけでは実装仕様書になりません。決定事項を別資料へ残す場合は、「確定事項、推奨事項、未決事項を分けてまとめて」と追加で依頼します。

4. skill-creator:自分の仕事を再利用できるSkillにする

OpenAIのskill-creatorは、Codexに組み込まれている、Skillを作成・更新するためのSkillです。Skillの目的、発動条件、期待する出力、スクリプトが必要かどうかを対話しながら整理できます。

社内のレビュー手順、定型レポート、固有の開発規約など、何度も説明している作業をCodexへ再利用可能な形で渡したい場合に向いています。

導入手順

Codex向けのSkillを作る場合は、組み込み版を推奨します。追加インストールが不要で、現在のCodex環境に合わせてSkillを作成できるためです。

$skill-creator

利用例

$skill-creator
このリポジトリでコードコメントを追加・変更するときに、
業務用語を優先し、物理名の直訳コメントを避けるSkillを作りたい。
発動条件とテスト例も一緒に整理してください。

評価機能を追加したい場合は、Anthropic版もあります。Codex組み込み版と同名なので、Claude CLIなどの依存と必要な評価機能を確認してから選びます。

5. Build Web Apps:Web制作に必要なSkillをまとめて追加する

Build Web Appsは、OpenAIの公式openai/pluginsリポジトリで公開されている、フロントエンド開発向けのCodex Pluginです。

Plugin内には、次の分野を扱うSkillが収録されています。

  • 新しいフロントエンドアプリの設計と実装
  • ブラウザを使った表示確認とデバッグ
  • React/Next.jsのパフォーマンス
  • shadcn/uiの導入と構成
  • Stripeの決済設計
  • Supabase/Postgresの設計と最適化

デザインだけ、実装だけに偏らず、画面を作り、ブラウザで確認し、必要に応じて決済やデータベースまで扱える点が特徴です。

導入手順

CodexのセッションでPlugin一覧を開き、Build Web Appsを検索してインストールします。

/plugins

Codexのバージョンによって画面やコマンド形式が異なる場合があるため、迷ったときは/pluginsから検索する方法が確実です。

利用例

Next.jsで、問い合わせ件数と対応状況を確認できる管理ダッシュボードを作って。
既存のデザインを確認し、スマートフォン表示とキーボード操作も検証して。

新規画面ではデザイン案の整理から始め、React実装後にブラウザ確認までつなげられます。既存画面の小さな文言修正より、画面全体を新しく設計する作業に向いています。

6. playwright-cli:Codexに実ブラウザで確認させる

playwright-cliは、Microsoftが公開している、Playwrightのブラウザ操作をコマンドラインから実行するツールです。画面を開く、入力する、クリックする、スナップショットを取得する、スクリーンショットを撮るといった操作を、Codexが短いコマンドで扱えます。

公式READMEでは、CLI+Skillは大きなツール定義やアクセシビリティツリーを常時コンテキストへ載せずに済むため、コーディングエージェントで効率よくブラウザを操作したい場合に適すると説明されています。

導入手順

Node.js 18以上の環境で、公式READMEが案内するCLIをインストールします。

npm install -g @playwright/cli@latest
playwright-cli --help
playwright-cli install --skills=agents

Skillはプロジェクト内の.agents/skills/playwright-cliへ配置されます。Codexを再起動し、新しいセッションで利用します。Skillを使わず、playwright-cli --helpを確認させながらCLIを直接操作させることもできます。

利用例

playwright-cliを使って http://localhost:3000 の問い合わせフォームを確認して。
必須項目のエラー、正常入力、送信ボタンの可視性を検証し、結果のスクリーンショットを保存して。

MCPやPlaywright Testとの違いは、Playwright・MCP・CLIの選び方にまとめています。

7. Context7:最新のライブラリ資料をCodexへ取り込む

Context7は、Upstashが公式に配布するCodex Pluginです。ホスト型のContext7 MCP Serverと、ライブラリの質問に応じて資料取得を促すSkillが含まれています。

AIコーディングエージェントは、学習時点より後に変わったAPIや、利用中のバージョンとは異なる書き方を提案することがあります。Context7は、ソースリポジトリ由来の最新またはバージョン固有のドキュメントとコード例を取得し、Codexのコンテキストへ加えます。Next.js、React、Prisma、Supabaseなど、更新の速いライブラリやフレームワークの仕様を確認してから実装したい場面に向いています。

導入手順

Upstash公式READMEの手順では、最初にContext7のPlugin Marketplaceを追加し、そこからPluginを導入します。

codex plugin marketplace add upstash/context7
codex plugin add context7@context7-marketplace

Pluginを追加するとブラウザが開き、Context7へのOAuthログインを求められます。導入後は新しいCodexスレッドを開始し、PluginのSkillとMCPツールを読み込ませます。ブラウザを開けないリモート環境やヘッドレス環境では、公式READMEが案内するデバイスフローも利用できます。

npx ctx7 setup --codex

利用例

Context7を使って、このプロジェクトで利用しているNext.jsのバージョンに合う
App Routerのキャッシュ資料を確認して。現在の実装との差分と、変更が必要な箇所を説明して。

バージョンを固定して確認したい場合は、対象バージョンも依頼に含めます。Context7は外部ライブラリの公開ドキュメントを確認するための手段です。リポジトリ固有の仕様や社内ルールはローカルファイルを正とし、一般的なWeb検索やニュース調査とは使い分けます。

権限と外部通信の注意

Context7 Codex Pluginはhttps://mcp.context7.com/mcpのホスト型MCP Serverへ接続します。Plugin manifestに示された権限はReadですが、利用時にはOAuth認証と外部通信が発生し、資料を探すための質問内容がContext7へ送られます。機密情報、認証情報、非公開コードを質問へ含めず、組織の外部サービス利用ルールも確認してください。

8. ELI5:難しい話を「大きな図と少ない言葉」に変える

ELI5は、「Explain Like I'm 5」の略で、専門知識がない人にも分かるように説明するSkillです。AnthropicのClaude Codeチームで働くThariq Shihipar氏が公開し、Anthropic社内でよく使われているSkillとして紹介しました。

出力は長い文章ではなく、大きな図と少ない言葉を使ったHTMLの解説ページです。コードの構造、設計上のトレードオフ、障害原因など、文章だけでは関係を追いにくい話題に向いています。

導入手順

元の配布物はClaude Code向けPluginですが、Skill本体はskills CLIを使ってCodexへ導入できます。

npx skills add https://github.com/anthropics/claude-plugins-community --skill eli5

インストーラーではCodexを選び、導入後に新しいセッションを開始します。Claude Codeでは/eli5ですが、Codexで明示的に呼び出す場合は$eli5を使います。

利用例

$eli5
このリポジトリで、問い合わせフォームの入力がAWS SESから管理者へ届くまでを日本語で説明して。

前提知識のない大人へ、具体例・用語・重要な境界まで説明する場合は、eli-newの設計と出力例も参照してください。

9. Codex SEO:専門ワークフローでSEOを監査する

Codex SEOは、Codex向けに作られたSEO分析のSkill Suiteです。1つのオーケストレーターが依頼内容に応じて専門ワークフローを選び、同じ条件で繰り返し実行できるスクリプトで証拠とレポートを生成します。

2026年8月28日時点のリポジトリでは、次のような分野を扱っています。

  • クロール、インデックス、canonical、リダイレクトなどの技術SEO
  • コンテンツ品質、E-E-A-T、検索意図との適合
  • Core Web Vitals、JSON-LDなどの構造化データ、画像SEO、XMLサイトマップ
  • GEO/AEOとAI検索で引用されやすいコンテンツの分析
  • 被リンク、ローカル/マップ、EC、hreflang、トピッククラスタリング
  • DataForSEO、Google API、Firecrawl、Geminiとの任意連携

導入手順

公式READMEの「Review Before Installing」で案内されている手順を使います。リポジトリを取得してから、インストーラーを実行します。

git clone https://github.com/AgriciDaniel/codex-seo.git
cd codex-seo
bash install.sh

インストーラーは、Skill Suiteを~/.codex/skills/、エージェント設定を~/.codex/agents/へ配置し、Python仮想環境と基本依存パッケージを用意します。視覚分析、検索データ、Googleサービスなどの機能には、Playwrightや各種APIの追加設定が必要です。必要な連携だけをREADMEで確認し、導入後はCodexを再起動してください。

利用例

/seo audit https://example.com
技術SEO、構造化データ、Core Web Vitals、GEO/AEOを確認し、
優先順位付きの改善案をまとめてください。

SEOは検索エンジンの仕様変更や計測環境の影響を受けます。レポートの点数だけで判断せず、取得できた証拠、取得できなかったデータ、確認日を合わせて読むことが重要です。

導入前に確認すること

Skillは単なる読み物ではなく、Codexの判断や実行手順に影響します。Pluginには、外部サービスへ接続するMCPや、特定のタイミングでコマンドを実行するHooksが含まれる場合もあります。

導入前に、最低限次の点を確認します。

  1. GitHubの所有者と配布元が想定どおりか
  2. SKILL.mdが依頼範囲を超える操作を指示していないか
  3. scriptsやインストーラーが外部へ送信する情報はないか
  4. Pluginが要求するConnector、MCP、Hooks、権限は何か
  5. 更新日、Release、Issue、ライセンスが確認できるか
  6. チーム利用では、バージョンやコミットを固定できるか

特に、認証ファイル、環境変数、顧客データへアクセスできる環境では、Skillの知名度だけで判断しないことが重要です。最初は検証用リポジトリや制限された権限で試し、生成物と実行コマンドを確認してから業務へ広げます。

チームで同じ内容を使う場合は、バージョンやコミットと更新方法を決めます。ほかの候補を探すときはThe Agent Skills Directoryを利用できますが、実行前には配布元の定義と付属スクリプトを確認してください。

参照元

確認日: 2026年8月28日