mcpField
A
app-planner

app-planner

github.com/pproencaデザイン・UI218234 回インストール11 週間前に更新
リポジトリ

app-planner について

app-plannerは、ユーザーの目標とApple Design DNAのパターンに沿って機能を整理し、更新し続けるアプリ設計計画を作るスキルです。段階的なアプリ改修を計画し、画面ごとにパターンを割り当てたビルドマイルストーンを作成します。

主な機能

  1. 01ユーザー目標に沿った機能整理
  2. 02Apple Design DNAパターンの割り当て
  3. 03利用頻度に基づくマイルストーン順
  4. 04テスト可能な受け入れ基準
  5. 05すぐ使えるios-tasteプロンプト

活用シーン

  1. 01複数セッションにわたるアプリ改修の計画
  2. 02利用頻度の高い画面の優先
  3. 03画面単位のビルドマイルストーン作成

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/pproenca/dot-skills --skill app-planner

インストール後、Claude Code で/app-plannerを入力して読み込まれたか確認します。

同梱ファイルmetadata.json

詳細

アプリプランナー

exec-plans と同じ形式の、継続的に更新するドキュメントである デザインプラン を作成します。アプリのドメインを、Apple Design DNA のパターン別に整理した機能グループに対応付けます。各機能グループは1つのマイルストーンとなり、ios-taste の1回のセッションで構築できる単位です。

出力は docs/design-plans/(またはプロジェクトでプランを管理している場所)に保存する Markdown ファイルです。複数のセッションにまたがる、構築プロセス全体の指針となります。

作成するもの

以下のセクションを含むデザインプランドキュメントです。

  1. 目的/全体像(再設計で実現すること)
  2. ユーザーと利用シーン(ペルソナ+頻度順に並べたインタラクション)
  3. 進捗(各セッションで更新する継続的なチェックボックス)
  4. デザインマイルストーン(画面ごとに1つ、パターンに対応付け)
  5. 意図的な対象外(スコープに含めないもの)
  6. 意思決定ログ(実行中に更新)
  7. 発見と気づき(実行中に更新)

作成しないもの

  • SwiftUI コードやデータモデル
  • レイアウト、ワイヤーフレーム、モックアップ
  • 色、タイポグラフィ、間隔の選択
  • ナビゲーションアーキテクチャの図
  • アプリ全体を一度に作ること

構築は後で行います。一度に1つのマイルストーンを、ios-taste を使って進めます。

パターン優先のアプローチ

ios-taste スキルディレクトリにある references/apple-design-dna.md (~/.claude/skills/ios-taste/references/apple-design-dna.md)を読んでください。そこには、6つの Apple アプリから抽出した22のパターンが含まれています。これらが構築の基盤となります。

パターン出典最適な用途
タイムグリッドCalendarスケジュール、予約、日々の計画
ポスターディテールContacts人物/エンティティのプロフィール、アイデンティティ表示
グラデーション上のグラスContactsプレミアムな詳細表示、レコード表示
ダッシュボードカードFitness一目で把握できる指標、日次サマリー
モジュラーカードグリッドWeather複数指標の表示、ステータスダッシュボード
階層ズームCalendar時間軸や詳細レベルをまたいだ閲覧
触覚フィードバック付き状態遷移Calendarモード変更、ドラッグ操作、スナップ位置
指標詳細テンプレートHealthグラフと解説を組み合わせたデータの詳細確認
意味的なドメインカラーHealth視覚的な分類が必要な複数カテゴリのシステム
高密度グリッドPhotos画像/サムネイルの一覧
注釈レイヤーPhotos Markup画像への描画/マーク/注釈付け
署名の記録Photos Markup同意、承認、手書き入力
カードと行の文法Fitness/Contactsダッシュボード(カード)と詳細表示(行)
インラインデータ強化Contacts/Fitness行に埋め込まれたプレビュー
空状態のスケルトンFitnessデータが存在する前に構造を表示

出力形式

デザインプランを Markdown ファイルとして保存します。構成は次のとおりにしてください。

# [App Name] Design Plan — [Focus]

This DesignPlan is a living document. Progress, Decision Log, and
Surprises & Discoveries must stay up to date as work proceeds.

## Purpose / Big Picture

[1-3 sentences: what the user can do AFTER this plan is executed.
Outcome-focused, not feature-list.]

## User & Moments

- **[Persona 1]**: [who, when, device context]
- **[Persona 2]**: [who, when, device context]

| Frequency | Moment | What they do |
|-----------|--------|-------------|
| 50x/day | [moment name] | [one line] |
| 10x/day | [moment name] | [one line] |
| 5x/day | [moment name] | [one line] |
| 1x/day | [moment name] | [one line] |
| 1x/week | [moment name] | [one line] |

## Progress

- [ ] Milestone 1: [screen name]
- [ ] Milestone 2: [screen name]
- [ ] Milestone 3: [screen name]
...

## Design Milestones

### Milestone 1: [Screen Name]

**User goal**: "[What the user is trying to do — in their words]"
**Pattern**: [Apple Design DNA pattern name] (from [source app])
**Priority**: Must-have
**Frequency**: [how often this screen is used]
**Existing TCA domain**: [which reducer/feature this touches]

**Features**:
- [Feature] — [why the user needs it]
- [Feature] — [why the user needs it]
- [Feature] — [why the user needs it]

**Acceptance criteria**:
1. [Observable proof — what the screen shows/does]
2. [User test — "show to [persona], they say X"]
3. [Technical — builds, tests pass, no raw design tokens]

**ios-taste prompt** (use this to start the build session):
> "[Exact prompt to give ios-taste to build this screen, including
> user context, emotional intent, and which pattern to reference]"

---

### Milestone 2: [Screen Name]
...

## Deliberate Omissions

- [Feature] — [why it's excluded]
- [Feature] — [why it's excluded]

## Decision Log

_Updated during execution._

## Surprises & Discoveries

_Updated during execution._

ルール

  1. 技術カテゴリではなく、ユーザーの目標ごとにグループ化します。「カレンダーモジュール」ではなく「一目で今日の予定を確認する」とします。

  2. 各マイルストーンは、1つの画面=1つのパターン=1回の ios-taste セッションです。 2つのパターンが必要なマイルストーンは、2つに分割します。

  3. 構築順は頻度に従います。 1日に50回使う画面がマイルストーン1です。

  4. マイルストーンは最大8つです。 8つを超える場合はスコープが広すぎます。統合するか、後回しにします。

  5. すべての機能に「理由」を含めます。「患者検索」ではなく、「患者検索 — 電話中に片手で発信者の記録を見つける必要があるため」とします。

  6. ios-taste のプロンプトを含めます。 各マイルストーンには、構築セッションを始めるための事前作成済みプロンプトを含めます。構築する人が何を尋ねるか考える必要はありません。そのまま貼り付けて使えます。

  7. 既存のコードを参照します。 プロジェクトに既存のリデューサー、モデル、ドメインがある場合は、構築する人が作業対象を把握できるよう、各マイルストーンにその名前を記載します。

  8. 受け入れ基準はテスト可能にします。「見た目がよい」ではなく、「受付担当者が2秒以内に次の患者を特定できる」とします。

コメント