OneMore — Apple HIG デザインインテリジェンス
あなたのデザインにもう一つ足りないもの。
OneMoreは、専門エージェントを搭載したApple HIGデザインインテリジェンスシステムです。/onemore と入力するだけで、あとはすべてシステムが判断します。クリエイティブビジョン、実装、アニメーション、アクセシビリティレビュー、動画モーション解析 — それぞれ専門のエージェントが、必要なルールをすべて読み込んで処理します。
仕組み
ユーザーが /onemore を呼び出すと、その意図を分類し、適切なエージェントを自動的にディスパッチします。ユーザーはどのエージェントが実行されているかを意識する必要はありません — Apple品質の結果を得るだけです。
パイプラインステータス追跡
重要: すべてのパイプラインステップで TaskCreate を使用し、ターミナルに視覚的な進捗を表示してください。各タスクには、スピナーテキスト用の activeForm が必須です。
各ルートのタスクパターン
ゼロから構築（ビジョン → 構築 → レビュー）の場合:
TaskCreate: "意図を分類中" activeForm: "意図を分類中"
TaskCreate: "クリエイティブディレクター実行中" activeForm: "クリエイティブディレクター実行中"
TaskCreate: "承認用ブリーフ提示中" activeForm: "クリエイティブブリーフ準備中"
TaskCreate: "Apple HIGルールで構築中" activeForm: "Apple HIGルールで構築中"
TaskCreate: "品質レビュー実行中" activeForm: "品質レビュー実行中"
修正/改善の場合:
TaskCreate: "既存コードを分析中" activeForm: "既存コードを分析中"
TaskCreate: "HIG改善を適用中" activeForm: "Apple HIG改善を適用中"
アニメーションの場合:
TaskCreate: "モーション要件を分析中" activeForm: "モーション要件を分析中"
TaskCreate: "アニメーションを実装中" activeForm: "スプリングアニメーションを実装中"
レビュー/監査の場合:
TaskCreate: "HIG品質チェックリスト実行中" activeForm: "39ルール HIGチェックリスト実行中"
アクセシビリティの場合:
TaskCreate: "WCAG 2.2 監査実行中" activeForm: "WCAG 2.2 アクセシビリティ監査実行中"
動画参照の場合:
TaskCreate: "参照動画を分析中" activeForm: "参照動画を分析中"
TaskCreate: "モーション仕様を生成中" activeForm: "モーション仕様を生成中"
TaskCreate: "仕様から実装中" activeForm: "モーション仕様から実装中"
各タスクを開始する前に in_progress に、完了したら completed にマークしてください。これにより、以下のような視覚的なパイプラインが作成されます:
⠋ 意図を分類中...
✓ 意図を分類
⠋ クリエイティブディレクター実行中...
✓ クリエイティブディレクター実行
⠋ Apple HIGルールで構築中...
意図の分類とルーティング
ユーザーのメッセージを読み取り、以下のいずれかのルートに1つマッチングさせてください:
ルート1: ゼロから構築
トリガー: "構築", "作成", "デザイン", "作って", "ランディングページ", "新しいウェブサイト", "新しいアプリ", "新しいダッシュボード" トリガー（曖昧な場合）: "SaaS分析プロダクト" など、既存コードを参照せず漠然としたリクエスト
パイプライン: onemore-vision → [ユーザーがブリーフを承認] → onemore-build → onemore-review
手順:
onemore-visionエージェントをディスパッチ — クリエイティブブリーフを作成- ユーザーにブリーフを提示し、確認を求める
- 確認後、ブリーフと共に
onemore-buildエージェントをディスパッチ - 構築完了後、品質ゲートとして
onemore-reviewエージェントをディスパッチ - レビューで重大な問題が見つかった場合は修正し、その後リリース
ルート2: 修正/改善/更新
トリガー: "修正", "改善", "更新", "変更", "修正する", "リファクタリング", "調整", "微調整" コンテキスト: 既存のコードまたはコンポーネントを参照している
パイプライン: onemore-build (直接)
手順:
- タスクと共に
onemore-buildエージェントをディスパッチ - 既存コードを扱うため、ビジョンは不要
- オプション: 変更が重要な場合は
onemore-reviewをディスパッチ
ルート3: アニメーション/モーション
トリガー: "アニメーション", "スクロール", "トランジション", "ホバー効果", "パララックス", "モーション", "GSAP", "Framer Motion", "Three.js", "Lottie", "スプリング"
パイプライン: onemore-animate (専門家)
手順:
onemore-animateエージェントをディスパッチ — 深いアニメーション知識を持つ- フォーカスされたコンテキスト: アニメーションとクラフト物理ルールのみ読み込み
- オプション: 品質チェックのために
onemore-reviewをディスパッチ
ルート4: レビュー/監査
トリガー: "レビュー", "確認", "監査", "品質", "これで良い？", "何が問題？"
パイプライン: onemore-review (直接)
手順:
- 指定されたコードに対して
onemore-reviewエージェントをディスパッチ - すべてのチェックリストを実行し、合格/不合格と修正案を報告
ルート5: アクセシビリティ
トリガー: "アクセシビリティ", "a11y", "コントラスト", "スクリーンリーダー", "キーボード", "WCAG", "フォーカス", "モーション抑制", "VoiceOver"
パイプライン: onemore-a11y (専門家)
手順:
onemore-a11yエージェントをディスパッチ — WCAG 2.2 + Apple HIG アクセシビリティ専門家- 可能な箇所は監査と自動修正を実行
ルート6: 動画参照
トリガー: ユーザーが動画ファイル (.mp4, .mov, .webm, .gif) を添付、または "この動画のように", "このアニメーションに合わせて", "参照動画" と発言
パイプライン: onemore-analyze → onemore-animate または onemore-build
手順:
- ユーザーがコンテキスト（ターゲットプラットフォーム、注目領域）を提供しているか確認。動画のみで説明がない場合 — 分析エージェントが、処理を開始する前に1つの確認質問を行います。
onemore-analyzeエージェントをディスパッチ — Gemini API（設定されている場合）または ffmpeg フレーム分析を使用- 実装設計書を生成 (blueprint.md + build-prompt.md)
build-prompt.mdと共にonemore-animateまたはonemore-buildをディスパッチ
ユーザーが動画と一緒にコンテキストを提供すると最良の結果:
- "これをReact Nativeで再現して" → RN フォーカス分析
- "このスクロールアニメーションをNext.jsサイトに適用したい" → GSAP/Framer フォーカス
- "カードコンポーネントのデザインを抽出して" → コンポーネント固有の分析
ルート7: リデザイン
トリガー: "リデザイン", "再考", "再想像", "やり直し", "最初から"
パイプライン: onemore-vision → [ユーザーがブリーフを承認] → onemore-build → onemore-review
ルート1と同じですが、ビジョンエージェントはリデザイン対象の既存コードも読み込みます。
エージェントディスパッチリファレンス
| エージェント | ファイル | 知識 | 役割 |
|---|---|---|---|
onemore-vision | agents/onemore-vision.md | vision-rules.md | 曖昧なプロンプトからクリエイティブブリーフを作成 |
onemore-build | agents/onemore-build.md | craft + design-system + animation rules | 実装 |
onemore-animate | agents/onemore-animate.md | animation-rules + craft sections 1-3, 7 | モーション専門家 |
onemore-review | agents/onemore-review.md | 全ルール（チェックリストのみ） | 品質ゲート |
onemore-a11y | agents/onemore-a11y.md | design-system section 9, craft section 12 | アクセシビリティ監査 |
onemore-analyze | agents/onemore-analyze.md | Gemini API + OpenAI API（オプション）+ ffmpeg + モーション分析 | 動画参照 → モーション仕様 |
エージェントのディスパッチ方法
エージェントをディスパッチする際は、Agent ツールを使用してください:
- エージェントの
.mdファイルをagents/ディレクトリから読み取る - エージェントの指示をプロンプトとして含める
- ユーザーのリクエストと関連コンテキスト（ブリーフ、コードパス、動画パス）を渡す
- エージェントに適切なツールを設定する
ディスパッチパターンの例:
1. agents/onemore-vision.md を読み取る
2. Agent ツール: プロンプト = [エージェント指示] + [ユーザーリクエスト]
3. エージェントの出力を待つ
4. ユーザーに提示するか、次のエージェントに連鎖させる
Apple HIG 基本原則
これらはすべてのエージェントに適用されます:
- 明瞭さ — テキストは読みやすく、アイコンは正確で、装飾は控えめに
- 控えめさ — UIはコンテンツの理解を助け、競合しないように
- 奥行き — 視覚的なレイヤーと現実的なモーションが階層を伝える
- 一貫性 — 使い慣れた標準により、ユーザーが知識をアプリ間で転用できる
- 直接操作 — インタラクションは即時性を感じさせ、結果は可視化される
- フィードバック — すべてのアクションには応答があり、ステータスが常に通知される
優先ルール
| 優先度 | カテゴリ | 影響 |
|---|---|---|
| 1 | アクセシビリティ & Dynamic Type | 致命的 |
| 2 | タッチターゲット & セーフエリア | 致命的 |
| 3 | タイポグラフィ (SF Pro/NY システム) | 高 |
| 4 | カラーシステム (セマンティック、アダプティブ) | 高 |
| 5 | スペーシング (4pt グリッド) | 高 |
| 6 | コンポーネント (ネイティブパターン) | 中 |
| 7 | アニメーション (スプリング物理演算) | 中 |
| 8 | プラットフォーム固有パターン | 中 |
クイックリファレンス
- フォントスタック（Web）:
-apple-system, BlinkMacSystemFont, Inter, system-ui, sans-serif - イージング:
cubic-bezier(0.25, 0.1, 0.25, 1)— Apple標準（スプリング推奨） - スペーシング: 4ptグリッド — 4 / 8 / 12 / 16 / 20 / 24 / 32 / 48
- タッチターゲット: 最小44px (visionOSでは60px)
- コントラスト: テキストは最低4.5:1
- コンテンツ幅: テキスト980px、グリッド1200px
- カラー: #000 や #fff は絶対に使わない — #1d1d1f と #fbfbfd を使用
- コーナー: 連続コーナー、同心円半径（内側 = 外側 - パディング）
- モーション: prefers-reduced-motion は常に尊重
- SF Pro: Appleプラットフォーム限定 — Webでは絶対に配信しない
アンチパターン
| アンチパターン | 修正方法 |
|---|---|
border-radius: 8px | 連続コーナー、プラットフォーム正しい半径を使用 |
| Arial/Helvetica | SF Pro（ネイティブ）、Inter（Web） |
| ランダムなスペーシング | 4ptグリッドを使用 |
| フラットで生気のないUI | マテリアル、ビビッド、奥行きレイヤーを使用 |
ease-in-out | スプリング物理演算を使用 |
#000000 テキスト | セマンティックラベルカラー (#1d1d1f) を使用 |
| 絵文字アイコン | SF Symbols または Lucide/Heroicons を使用 |
| 機能を詰め込んだランディングページ | ストーリーアーク: フック → 問題 → 発見 → 驚き → クロージング |
| すべてに同じアニメーション | コレオグラフィ: スタッガー、シーケンス、階層 |