Generate 5 custom UI design variations directly in Pencil prototypes via parallel agent teams analyzing your app codebase, domain, personas, competitors, and style guidelines. Teams of designers, reviewers, copywriters, and testers build, evaluate, and refine screens simultaneously for rapid comparison, A/B testing, and design exploration.
アフォーダンス検証の専門家。初見ユーザーの視点でUIを評価し、 各要素が「何のための機能か」「どう操作すればいいか」を一目で伝えられているかを検証する。 ペルソナ駆動モードでは、各ペルソナの視点からウォークスルーを実施する。 mcp__pencil__get_screenshot でデザインを確認し、認知的ウォークスルーを実施する。 ui-variations チームの一員として起動される。
UIコピーライティングの専門家。画面上のテキスト要素を評価・提案する。 ボタンラベル、見出し、説明文、CTA、エラー文、プレースホルダーのコピーを担当。 ペルソナ駆動モードでは、ペルソナの語彙・技術レベル・利用コンテキストに合わせたコピーを提案する。 mcp__pencil__get_screenshot でデザインを確認し、スタイルに合ったコピーを提案する。 ui-variations チームの一員として起動される。
デザインレビューの専門家。Pencil に構築されたUIデザインの品質・一貫性・アクセシビリティを評価する。 ペルソナ駆動モードでは、ペルソナの行動パターンとの適合度も評価する。 mcp__pencil__get_screenshot でデザインを確認し、改善フィードバックを提供する。 ui-variations チームの一員として起動される。
UIデザインの専門家。Pencil (.pen) ファイルに画面デザインを直接構築する。 割り当てられたスタイル方向に基づき、mcp__pencil__batch_design で独自のビジュアルを作成する。 ペルソナ駆動モードでは、ペルソナの行動パターンをUI構造・情報設計レベルで反映する。 ui-variations チームの一員として起動される。
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
Claude Code の開発ワークフローを強化するスキルプラグイン集。
claude plugin add github:sean-sunagaku/claude-code-plugin
Or use the slash command inside Claude Code:
/plugin marketplace add sean-sunagaku/claude-code-plugin
インストール後、Claude Code で / を入力するとスキル一覧が表示されます。
# 例: Git ワークフローを実行
/git-workflow
# 例: 3つの AI でコードレビュー
/multi-ai-review
# 例: マルチエージェントでタスク実行
/agent-team
一部のスキルは外部ツール(Codex CLI, Gemini CLI 等)が必要です。 詳しくは Prerequisites を参照してください。
| Category | Skills | Description |
|---|---|---|
| Product | 8 skills | プロダクトの企画・ユーザーリサーチ・ペルソナ設計・ジャーニーマップ作成 |
| Planning | 6 skills | 機能検討・技術設計の議論・実装計画の策定 |
| Design | 6 skills | UI/UXデザイン・ロゴ作成・デザインバリエーション生成 |
| Development | 11 skills | CI/CD・データベース管理・Gitワークフロー・デバッグ・テスト・デプロイ |
| Review | 6 skills | コードレビュー・プランレビュー・UI検証・品質チェック |
| Marketing | 5 skills | アプリ名決定・ASO最適化・スクリーンショット作成・プレビュー動画生成 |
| Agent Toolkit | 4 skills | エージェントチームの構築・運用・ベストプラクティス |
PostToolUse / PreToolUse 等のフックプラグイン。インストールすると自動的に有効化されます。
| Hook | Description | Event | Keywords |
|---|---|---|---|
| skill-publisher | [Internal] 作者のリポジトリ間でスキルを配置・登録するための内部ユーティリティ。一般利用者向けではありません。自分のプロジェクトにスキルを追加する際の構造化とmarketplace.json登録を自動化します | PostToolUse | `` |
| agent-teams-log | Agent Teams のチーム間通信ログを PostToolUse Hook で自動記録する | PostToolUse | `` |
| task-granularity | タスクの粒度を自動検証し、大きすぎるタスクを分割提案する Hook | PreToolUse | `` |
| ui-quality-hooks | UI コード変更時にアクセシビリティとレイアウト品質を自動チェックする Hook | PostToolUse | `` |
| ui-flow-design | 機能要件から画面構成・ワイヤーフレームまでを段階的に落とし込む Agent Team スキル。6つのエージェント(flow-architect, info-analyst, wireframe-designer, user-liaison, ux-critic, validator)が5ステップで画面設計を行い、PlantUML Salt でワイヤーフレームを生成する。PostToolUse Hook で .puml ファイルの自動バリデーションも提供 | PostToolUse | `` |
[Internal] 作者のリポジトリ間でスキルを配置・登録するための内部ユーティリティ。一般利用者向けではありません。自分のプロジェクトにスキルを追加する際の構造化とmarketplace.json登録を自動化します
Agent Teams のチーム間通信ログを PostToolUse Hook で自動記録する
タスクの粒度を自動検証し、大きすぎるタスクを分割提案する Hook
UI コード変更時にアクセシビリティとレイアウト品質を自動チェックする Hook
機能要件から画面構成・ワイヤーフレームまでを段階的に落とし込む Agent Team スキル。6つのエージェント(flow-architect, info-analyst, wireframe-designer, user-liaison, ux-critic, validator)が5ステップで画面設計を行い、PlantUML Salt でワイヤーフレームを生成する。PostToolUse Hook で .puml ファイルの自動バリデーションも提供
以下は作者の内部リポジトリ向けスキルです。一般利用者向けではありません。
| Skill | Description |
|---|---|
| marketplace-validate | claude-code-plugin リポジトリの marketplace 構造を検証し、エラーを自動修正する内部ユーティリティ |
| hook-publisher | Hook スクリプトを claude-code-plugin リポジトリの正しい構造に配置・登録するための内部ユーティリティ |
Required (all skills)
Optional (skill-specific)
プラグインが正しくインストールされているか確認してください:
claude plugin list
表示されない場合は再インストールしてください:
claude plugin add github:sean-sunagaku/claude-code-plugin
multi-ai-review と plan-review は外部 AI CLI を使用します。
# Codex CLI のインストール
npm install -g @openai/codex
# Gemini CLI のインストール
npm install -g @anthropic-ai/gemini-cli
いずれかの CLI がない場合、そのレビューはスキップされます。
一部のスキルはプロジェクト固有のツールに依存しています:
ci-check → pnpm が必要(npm install -g pnpm)git-workflow → gh が必要(brew install gh / GitHub CLI)すべてのスキルは独立しています。必要なスキルのコマンドをそのまま実行してください。 使わないスキルの依存ツールをインストールする必要はありません。
MIT
npx claudepluginhub sean-sunagaku/claude-code-plugin --plugin ui-variationsプロダクトの基盤情報(課題仮説・ソリューション・市場スコープ・原体験・ビジネスモデル・競合・差別化)を ユーザーとの対話で掘り下げ、構造化されたドキュメント(product-context.md)として整理するスキル。 「自分のプロダクトって結局何なの?」を一緒に整理する壁打ち相手として機能する。 ペルソナ作成、LP設計、機能優先順位、マーケティング戦略など、 プロダクトの方向性に関わるあらゆる意思決定の「前提情報」を1ファイルにまとめる。 コードベースがあれば自動で読み取れる部分は埋め、残りをユーザーにヒアリングする。 Use when: 「プロダクトを整理したい」「ターゲット整理」「コンテキスト作成」 「ペルソナの前に」「誰向けのプロダクトか整理」「プロダクト情報まとめ」 「product context」「プロダクト定義」「プロダクトの前提」 「product discovery」「誰向け」と言われた時。 新しいプロジェクトの立ち上げ時や、方向性を見直したい時にも使う。 ペルソナ作成スキルを使う前に、まずこのスキルでプロダクトの前提を整理すべき。 Triggers: "product discovery", "product context", "プロダクト整理", "ターゲット整理", "コンテキスト作成", "プロダクト定義", "プロダクトの前提", "ペルソナの前に", "誰向け", "プロダクト情報まとめ", "プロダクトって何", "何を作ってるか整理", "どんな需要があるか"
5つの専門エージェント(ブランディング・商標・デジタルプレゼンス・国際展開・コンテキスト管理)がチームで相互フィードバックしながら議論し、最適なアプリ名を決定する
GitHub Actions の CI 失敗を自動検出・ログ取得・修正・再検証するスキル。gh コマンドで PR のチェック状況を監視し、失敗時はログを分析してコードを修正、push 後に再度 CI を確認するループを回す
5つの専門エージェント(UX・ビジュアル・アクセシビリティ・モバイル・コピー)がチームでUIを添削・改善し、Pencilで画面デザインを作成・修正する
実装計画からタスクを分解し、ファイル単位の依存関係を分析して並列実行可能な Wave に自動グルーピング。編集ファイルが被らないタスクは全て同時並列にし、Mermaid 依存関係図 + ディレクトリ分割 TODO を出力する
5つの専門エージェント(UX・ビジュアル・アクセシビリティ・モバイル・コピー)がチームでUIを添削・改善し、Pencilで画面デザインを作成・修正する
Design workflow for coding agents: discovery, research, strategy, inclusive design, critique, and handoff — enforced automatically
Generate distinct UI design variations, collect feedback, synthesize the best elements, and produce implementation plans
A virtual design team for Claude Code, Cursor, Windsurf, Gemini CLI, and Copilot — powered by Naksha. Assembles specialist roles — UI designer, UX researcher, content designer, Figma expert, data viz, email, social, motion, presentation, brand strategy, illustration, video, conversational, spatial, compliance, and more — for any design task. 26 roles, 62 commands, 15,000+ lines of expert design knowledge. Your agency's design brain, inside your terminal.
Streamline design operations with critique frameworks, handoff specs, sprint planning, review processes, and team workflows.
Craft polished user interfaces with layout grids, color systems, typography scales, responsive patterns, and visual hierarchy.