Agent Skills by ALSEL
Anthropic Claudeデザイン・クリエイティブ⭐ リポ 0品質スコア 50/100

feature-design-assistant

アイデアを自然な対話を通じて、完成度の高い設計仕様へと落とし込みます。新機能の計画立案、アーキテクチャ設計、またはコードベースへの大規模な変更を検討する際に活用してください。

description の原文を見る

Turn ideas into fully formed designs and specs through natural collaborative dialogue. Use when planning new features, designing architecture, or making significant changes to the codebase.

SKILL.md 本文

フィーチャーデザインアシスタント

構造化された情報収集と協調的な検証を通じて、アイデアを完全に形成されたデザインと仕様に変えるのを支援します。

開始時にお知らせください: 「このフィーチャーのデザインに feature-design-assistant スキルを使用しています。」

フェーズ 1: コンテキストディスカバリー

まず、コードベースを探索して以下を理解します:

  • プロジェクト構造とテックスタック
  • 既存のパターンと規約
  • 関連フィーチャーやモジュール
  • 関連エリアの最近の変更

フェーズ 2: 構造化情報収集

AskUserQuestion を使用して、情報を効率的にバッチ収集します。各呼び出しで最大 4 つの質問ができます。

ラウンド 1: コア要件(4 つの質問)

{
  "questions": [
    {
      "question": "このフィーチャーの主な目的は何ですか?",
      "header": "目的",
      "multiSelect": false,
      "options": [
        { "label": "新機能", "description": "システムに完全に新しい機能を追加" },
        { "label": "機能強化", "description": "既存フィーチャーを改善または拡張" },
        { "label": "バグ修正", "description": "不正な動作または問題を修正" },
        { "label": "リファクタリング", "description": "動作を変えずにコード品質を向上" }
      ]
    },
    {
      "question": "このフィーチャーの主なユーザーは誰ですか?",
      "header": "ユーザー",
      "multiSelect": true,
      "options": [
        { "label": "エンドユーザー", "description": "プロダクトを使用する外部顧客" },
        { "label": "管理者", "description": "内部管理者またはオペレーター" },
        { "label": "開発者", "description": "API または SDK を使用する他の開発者" },
        { "label": "システム", "description": "自動化されたプロセスまたはバックグラウンドジョブ" }
      ]
    },
    {
      "question": "このフィーチャーの予想される範囲は何ですか?",
      "header": "スコープ",
      "multiSelect": false,
      "options": [
        { "label": "小(1~2 日)", "description": "単一コンポーネント、限定的な変更" },
        { "label": "中(3~5 日)", "description": "複数コンポーネント、中程度の複雑さ" },
        { "label": "大(1~2 週間)", "description": "横断的関心事、大幅な変更" },
        { "label": "不確定", "description": "見積もるにはさらに探索が必要" }
      ]
    },
    {
      "question": "厳しいデッドラインまたは制約がありますか?",
      "header": "タイムライン",
      "multiSelect": false,
      "options": [
        { "label": "緊急", "description": "できるだけ早く、数日以内に必要" },
        { "label": "このスプリント内", "description": "現在のスプリント内に完了すべき" },
        { "label": "柔軟", "description": "厳しいデッドラインなし、品質重視" },
        { "label": "計画のみ", "description": "今は設計のみ、後で実装" }
      ]
    }
  ]
}

ラウンド 2: 技術要件(4 つの質問)

{
  "questions": [
    {
      "question": "このフィーチャーはシステムのどのレイヤーに影響しますか?",
      "header": "レイヤー",
      "multiSelect": true,
      "options": [
        { "label": "データモデル", "description": "データベーススキーマ、モデル、マイグレーション" },
        { "label": "ビジネスロジック", "description": "サービス、ドメインロジック、ルール" },
        { "label": "API", "description": "REST/GraphQL エンドポイント、コントラクト" },
        { "label": "UI", "description": "フロントエンドコンポーネント、ユーザーインターフェース" }
      ]
    },
    {
      "question": "主な品質要件は何ですか?",
      "header": "品質",
      "multiSelect": true,
      "options": [
        { "label": "高パフォーマンス", "description": "高負荷に対応またはとても高速である必要がある" },
        { "label": "強力なセキュリティ", "description": "機密データ、認証、アクセス制御" },
        { "label": "高い信頼性", "description": "障害が許されない、冗長性が必要" },
        { "label": "保守性", "description": "容易に理解および変更できる必要がある" }
      ]
    },
    {
      "question": "エラーはどのように処理すべきですか?",
      "header": "エラー処理",
      "multiSelect": false,
      "options": [
        { "label": "高速失敗", "description": "エラーが発生したら即座に停止" },
        { "label": "グレースフルデグラデーション", "description": "機能を削減して継続" },
        { "label": "リトライと復旧", "description": "リカバリロジック付き自動リトライ" },
        { "label": "コンテキスト依存", "description": "ケースによって異なる戦略" }
      ]
    },
    {
      "question": "どのテストアプローチを推奨しますか?",
      "header": "テスト",
      "multiSelect": false,
      "options": [
        { "label": "TDD(推奨)", "description": "テストを先に書き、その後実装" },
        { "label": "テスト後", "description": "先に実装し、後でテストを追加" },
        { "label": "最小限のテスト", "description": "クリティカルパスのみテスト" },
        { "label": "テストなし", "description": "このフィーチャーのテストをスキップ" }
      ]
    }
  ]
}

ラウンド 3: 統合と依存関係(4 つの質問)

{
  "questions": [
    {
      "question": "このフィーチャーは外部統合が必要ですか?",
      "header": "統合",
      "multiSelect": true,
      "options": [
        { "label": "データベース", "description": "新しいテーブル、クエリ、またはマイグレーション" },
        { "label": "外部 API", "description": "サードパーティサービス呼び出し" },
        { "label": "メッセージキュー", "description": "非同期処理、イベント" },
        { "label": "なし", "description": "外部統合は不要" }
      ]
    },
    {
      "question": "他のフィーチャーまたはチームへの依存関係がありますか?",
      "header": "依存関係",
      "multiSelect": true,
      "options": [
        { "label": "認証システム", "description": "ユーザー認証または認可" },
        { "label": "他のフィーチャー", "description": "開発中のフィーチャーに依存" },
        { "label": "外部チーム", "description": "別のチームからの入力が必要" },
        { "label": "なし", "description": "完全に独立したフィーチャー" }
      ]
    },
    {
      "question": "後方互換性をどのように処理すべきですか?",
      "header": "互換性",
      "multiSelect": false,
      "options": [
        { "label": "維持が必須", "description": "既存クライアントを壊せない" },
        { "label": "API バージョニング", "description": "新しいバージョンを作成、古いバージョンを廃止" },
        { "label": "破壊的変更 OK", "description": "破壊的変更を行うことができる" },
        { "label": "該当なし", "description": "新しいフィーチャー、既存ユーザーなし" }
      ]
    },
    {
      "question": "どのようなドキュメントが必要ですか?",
      "header": "ドキュメント",
      "multiSelect": true,
      "options": [
        { "label": "API ドキュメント", "description": "エンドポイントドキュメント" },
        { "label": "ユーザーガイド", "description": "エンドユーザー向けのハウツー" },
        { "label": "開発者ガイド", "description": "技術実装の詳細" },
        { "label": "なし", "description": "ドキュメントは不要" }
      ]
    }
  ]
}

ラウンド 4: 質問の明確化(コンテキスト依存)

前の回答に基づいて、フォローアップ質問を質問します。例:

UI レイヤーが選択された場合:

{
  "questions": [
    {
      "question": "どの UI フレームワーク/アプローチを使用すべきですか?",
      "header": "UI 技術",
      "multiSelect": false,
      "options": [
        { "label": "React", "description": "フック付き React コンポーネント" },
        { "label": "Vue", "description": "Vue.js コンポーネント" },
        { "label": "サーバーサイド", "description": "サーバーレンダリング HTML テンプレート" },
        { "label": "既存パターン", "description": "現在のプロジェクト規約に従う" }
      ]
    }
  ]
}

高セキュリティが選択された場合:

{
  "questions": [
    {
      "question": "どのセキュリティ対策が必要ですか?",
      "header": "セキュリティ",
      "multiSelect": true,
      "options": [
        { "label": "入力検証", "description": "厳密な入力のサニタイゼーション" },
        { "label": "レート制限", "description": "乱用と DoS 防止" },
        { "label": "監査ログ", "description": "すべての機密アクションを追跡" },
        { "label": "暗号化", "description": "保存中/転送中のデータを暗号化" }
      ]
    }
  ]
}

フェーズ 3: アプローチ探索

要件を収集後、2~3 のアプローチを提案:

## アプローチのオプション

### オプション A: [名前](推奨)
**メリット:** ...
**デメリット:** ...
**最適な用途:** ...

### オプション B: [名前]
**メリット:** ...
**デメリット:** ...
**最適な用途:** ...

### オプション C: [名前]
**メリット:** ...
**デメリット:** ...
**最適な用途:** ...

AskUserQuestion を使用してアプローチを確認:

{
  "questions": [
    {
      "question": "どのアプローチで進めたいですか?",
      "header": "アプローチ",
      "multiSelect": false,
      "options": [
        { "label": "オプション A(推奨)", "description": "アプローチ A の簡潔な要約" },
        { "label": "オプション B", "description": "アプローチ B の簡潔な要約" },
        { "label": "オプション C", "description": "アプローチ C の簡潔な要約" }
      ]
    }
  ]
}

フェーズ 4: デザイン提示

セクション別にデザインを提示(各 300~500 語)、各セクション後に検証:

  1. アーキテクチャ概要 - 高レベル構造
  2. データモデル - エンティティ、関係、スキーマ
  3. API デザイン - エンドポイント、リクエスト/レスポンス
  4. コンポーネントデザイン - 内部モジュール、インターフェース
  5. エラーハンドリング - エラーケース、復旧戦略
  6. テスト戦略 - テスト内容と方法

各セクション後、AskUserQuestion を使用:

{
  "questions": [
    {
      "question": "このセクションは正しそうですか?",
      "header": "レビュー",
      "multiSelect": false,
      "options": [
        { "label": "良好です", "description": "次のセクションに進む" },
        { "label": "軽微な変更", "description": "小さな調整が必要" },
        { "label": "大幅な修正", "description": "大幅な変更が必要" },
        { "label": "質問あり", "description": "進める前に明確化が必要" }
      ]
    }
  ]
}

フェーズ 5: ドキュメント作成とタスク生成

デザインドキュメントを保存

docs/designs/YYYY-MM-DD-<topic>-design.md に書き込み:

# フィーチャー: [名前]

## 概要
[簡潔な説明]

## 要件
[フェーズ 2 の回答から]

## アーキテクチャ
[フェーズ 4 から]

## 実装タスク
[タスクチェックリスト]

実装タスクを生成

## 実装タスク

- [ ] **タスクタイトル** `priority:1` `phase:model` `time:15min`
  - files: src/file1.py, tests/test_file1.py
  - [ ] X のテストを書く(失敗する)
  - [ ] テストを実行、失敗を確認
  - [ ] 最小限のコードを実装
  - [ ] テストを実行、成功を確認
  - [ ] コミット

- [ ] **別のタスク** `priority:2` `phase:api` `deps:Task Title` `time:10min`
  - files: src/api.py
  - [ ] テストを書く(失敗する)
  - [ ] 実装して確認
  - [ ] コミット

フェーズ 6: 実行ハンドオフ

{
  "questions": [
    {
      "question": "実装をどのように進めたいですか?",
      "header": "次のステップ",
      "multiSelect": false,
      "options": [
        { "label": "今すぐ実行", "description": "このセッションで /feature-pipeline を実行" },
        { "label": "新しいセッション", "description": "実装用の新しいセッションを開始" },
        { "label": "後で", "description": "デザインを保存、後で手動で実装" },
        { "label": "デザインを修正", "description": "戻ってデザインを修正" }
      ]
    }
  ]
}

主な原則

  • 質問を効率的にバッチ処理 - 適切な場合は 4 つの質問スロットをすべて使用
  • 非排他的オプションに複数選択を使用 - レイヤー、フィーチャー、要件
  • 意思決定に単一選択を使用 - アプローチ、タイムライン、戦略
  • 推奨をマーク - 優先オプションに「(推奨)」を追加
  • 段階的な洗練 - 一般的 → 具体的な質問
  • 段階的な検証 - 各フェーズで理解を確認
  • YAGNI を徹底的に適用 - 不要なフィーチャーをデザインから削除

ライセンス: MIT(寛容ライセンスのため全文を引用しています) · 原本リポジトリ

詳細情報

作者
davila7
リポジトリ
davila7/claude-code-templates
ライセンス
MIT
最終更新
不明

Source: https://github.com/davila7/claude-code-templates / ライセンス: MIT

関連スキル

汎用デザイン・クリエイティブ⭐ リポ 1,739

nano-banana-2

inference.sh CLIを通じてGoogle Gemini 3.1 Flash Image Preview(Nano Banana 2)で画像を生成します。テキストから画像を生成する機能、画像編集、最大14枚の複数画像入力、Google Searchグラウンディング機能に対応しています。トリガーワード:「nano banana 2」「nanobanana 2」「gemini 3.1 flash image」「gemini 3 1 flash image preview」「google image generation」

by openakita
汎用デザイン・クリエイティブ⭐ リポ 815

octocode-slides

洗練されたマルチファイル形式のHTMLプレゼンテーションを生成します。6段階のフロー(概要 → リサーチ → アウトライン → デザイン → 実装 → レビュー)で構成されています。各スライドは独立したHTMLファイルとなり、iframeで読み込まれます。「スライドを作成してほしい」「プレゼンテーションを作ってほしい」「HTMLスライドを生成してほしい」「デックを構築してほしい」といった依頼や、ノート・ドキュメント・コードを洗練されたプレゼンテーションに変換する際に使用できます。

by bgauryy
汎用デザイン・クリエイティブ⭐ リポ 482

gpt-image2-ppt

OpenAIのgpt-image-2を使用して、視覚的に優れたPPTスライドを生成します。Spatial Glass、Tech Blue、Editorial Monoなど10種類のキュレーション済みスタイルに対応し、ユーザーが提供したPPTXファイルを模倣するテンプレートクローンモードも搭載しています。HTMLビューアと16:9形式のPPTXファイルを出力します。プレゼンテーション、スライド、ピッチデック、投資家向けPPT、雑誌風PPTの作成依頼などで活用してください。

by JuneYaooo
Anthropic Claudeデザイン・クリエイティブ⭐ リポ 299

nano-banana

Nano Banana PRO(Gemini 3 Pro Image)およびNano Banana(Gemini 2.5 Flash Image)を使用したAI画像生成機能です。以下の場合に活用できます:(1)テキストプロンプトからの画像生成、(2)既存画像の編集、(3)インフォグラフィックス、ロゴ、商品写真、ステッカーなどのプロフェッショナルなビジュアルアセット制作、(4)複数画像での人物キャラクターの一貫性保持、(5)正確なテキスト描画を含む画像生成、(6)AI生成ビジュアルが必要なあらゆるタスク。「画像を生成」「画像を作成」「写真を作る」「ロゴをデザイン」「インフォグラフィックスを作成」「AI画像」「nano banana」またはその他の画像生成リクエストをトリガーとして機能します。

by majiayu000
Anthropic Claudeデザイン・クリエイティブ⭐ リポ 299

oiloil-ui-ux-guide

モダンでクリーンなUI/UXガイダンス・レビュースキルです。新機能や既存システム(Webアプリ)に対して、実行可能なUI/UX改善提案、デザイン原則、デザインレビューチェックリストが必要な場合に活用できます。CRAP(コントラスト・反復・配置・近接)をベースに、タスクファーストなUX、情報設計、フィードバック・システムステータス、一貫性、affordances、エラー防止・復旧、認知負荷を重視します。モダンミニマルスタイル(クリーン・余白・タイポグラフィ主導)を強制し、不要なテキストを削減、アイコンとしての絵文字を禁止し、統一されたアイコンセットから直感的で洗練されたアイコンを推奨します。

by majiayu000
Anthropic Claudeデザイン・クリエイティブ⭐ リポ 299

axiom-hig-ref

Apple Human Interface Guidelines リファレンス — 色(セマンティックカラー、カスタムカラー、パターン)、背景(マテリアル階層、ダイナミック背景)、タイポグラフィ(標準スタイル、カスタムフォント、Dynamic Type)、SF Symbols(レンダリングモード、色、多言語対応)、ダークモード、アクセシビリティ、プラットフォーム固有の考慮事項を網羅したガイドラインです。

by majiayu000
本サイトは GitHub 上で公開されているオープンソースの SKILL.md ファイルをクロール・インデックス化したものです。 各スキルの著作権は原作者に帰属します。掲載に問題がある場合は info@alsel.co.jp または /takedown フォームよりご連絡ください。
原作者: davila7 · davila7/claude-code-templates · ライセンス: MIT