multi-platform-apps-multi-platform

マルチプラットフォーム機能開発ワークフロー

APIファーストアーキテクチャと並列実装戦略を使用して、Web、モバイル、デスクトッププラットフォーム全体で同じ機能を一貫して構築・デプロイします。

[拡張思考: このワークフローは複数の専門エージェントを編成し、プラットフォーム固有の最適化を維持しながらプラットフォーム間の機能パリティを確保します。調整戦略は、共有コントラクトと定期的な同期ポイントを伴う並列開発を重視します。APIコントラクトとデータモデルを事前に確立することで、チームは独立性を保ちながら一貫性を確保できます。このワークフローの利点には、市場投入までの時間短縮、統合の問題の削減、保守可能なクロスプラットフォームコードベースが含まれます。]

このスキルを使用する場合

• マルチプラットフォーム機能開発ワークフローのタスクやワークフローに取り組む場合
• マルチプラットフォーム機能開発ワークフローに関するガイダンス、ベストプラクティス、チェックリストが必要な場合

このスキルを使用しない場合

• タスクがマルチプラットフォーム機能開発ワークフローと無関係な場合
• この範囲外の別のドメインやツールが必要な場合

手順

• 目標、制約、必要な入力を明確にします。
• 関連するベストプラクティスを適用し、成果を検証します。
• 実行可能なステップと検証を提供します。
• 詳細な例が必要な場合は、resources/implementation-playbook.md を開いてください。

フェーズ 1: アーキテクチャと API 設計 (順次)

1. 機能要件と API コントラクトの定義

• subagent_type="backend-architect" で Task ツールを使用します
• プロンプト: "機能の API コントラクトを設計してください: $ARGUMENTS。以下を含む OpenAPI 3.1 仕様を作成してください:
  • 適切な HTTP メソッドとステータスコードを備えた RESTful エンドポイント
  • 複雑なデータクエリに該当する場合は GraphQL スキーマ
  • リアルタイム機能向けの WebSocket イベント
  • 検証ルールを備えたリクエスト/レスポンススキーマ
  • 認証と認可の要件
  • レート制限とキャッシュ戦略
  • エラーレスポンスの形式とコード すべてのプラットフォームが利用する共有データモデルを定義してください。"
• 期待される出力: 完全な API 仕様、データモデル、統合ガイドライン

2. デザインシステムと UI/UX の一貫性

• subagent_type="ui-ux-designer" で Task ツールを使用します
• プロンプト: "API 仕様 [前回の出力] を使用して、機能のクロスプラットフォームデザインシステムを作成してください。以下を含めます:
  • 各プラットフォーム向けのコンポーネント仕様 (Material Design、iOS HIG、Fluent)
  • Web 向けのレスポンシブレイアウト (モバイルファーストアプローチ)
  • iOS (SwiftUI) と Android (Material You) 向けのネイティブパターン
  • デスクトップ固有の考慮事項 (キーボードショートカット、ウィンドウ管理)
  • アクセシビリティ要件 (WCAG 2.2 レベル AA)
  • ダーク/ライトテーマの仕様
  • アニメーションとトランジションのガイドライン"
• 前回からのコンテキスト: API エンドポイント、データ構造、認証フロー
• 期待される出力: デザインシステムのドキュメント、コンポーネントライブラリの仕様、プラットフォームガイドライン

3. 共有ビジネスロジックのアーキテクチャ

• subagent_type="comprehensive-review::architect-review" で Task ツールを使用します
• プロンプト: "クロスプラットフォーム機能向けの共有ビジネスロジックアーキテクチャを設計してください。以下を定義します:
  • コアドメインモデルとエンティティ (プラットフォーム非依存)
  • ビジネスルールと検証ロジック
  • 状態管理パターン (MVI/Redux/BLoC)
  • キャッシュとオフライン戦略
  • エラー処理と再試行ポリシー
  • プラットフォーム固有のアダプターパターン モバイルには Kotlin Multiplatform、Web/デスクトップの共有には TypeScript の使用を検討してください。"
• 前回からのコンテキスト: API コントラクト、データモデル、UI 要件
• 期待される出力: 共有コードアーキテクチャ、プラットフォーム抽象化レイヤー、実装ガイド

フェーズ 2: 並列プラットフォーム実装

4a. Web 実装（React/Next.js）

• subagent_type="frontend-developer" を指定して Task ツールを使用します
• プロンプト：「次の技術を使用して、機能の Web 版を実装してください。
  • React 18+ と Next.js 14+ App Router
  • 型安全性のための TypeScript
  • API 統合用の TanStack Query：[API spec]
  • 状態管理用の Zustand/Redux Toolkit
  • デザインシステムを適用した Tailwind CSS：[design specs]
  • プログレッシブウェブアプリ（PWA）機能
  • 適切な箇所で SSR/SSG を最適化
  • Web Vitals を最適化（LCP < 2.5s、INP ≤ 200ms） 共通のビジネスロジックに従ってください：[architecture doc]」
• 前のコンテキスト：API コントラクト、デザインシステム、共通ロジックのパターン
• 期待される出力：テストを含む完全な Web 実装

4b. iOS 実装（SwiftUI）

• subagent_type="ios-developer" を指定して Task ツールを使用します
• プロンプト：「次の技術を使用して、iOS 版を実装してください。
  • iOS 17+ の機能を活用した SwiftUI
  • async/await を使用する Swift 5.9+
  • API 用の Combine を使用する URLSession：[API spec]
  • 永続化用の Core Data/SwiftData
  • デザインシステムへの準拠：[iOS HIG specs]
  • 該当する場合はウィジェット拡張機能
  • プラットフォーム固有の機能（Face ID、触覚フィードバック、Live Activities）
  • テスト可能な MVVM アーキテクチャ 共通のパターンに従ってください：[architecture doc]」
• 前のコンテキスト：API コントラクト、iOS のデザインガイドライン、共通モデル
• 期待される出力：ユニットテスト／UI テストを含むネイティブ iOS 実装

4c. Android 実装（Kotlin/Compose）

• subagent_type="mobile-developer" を指定して Task ツールを使用します
• プロンプト：「次の技術を使用して、Android 版を実装してください。
  • Material 3 を使用する Jetpack Compose
  • Kotlin コルーチンと Flow
  • API 用の Retrofit/Ktor：[API spec]
  • ローカルストレージ用の Room データベース
  • 依存関係の注入に Hilt
  • Material You のダイナミックテーマ：[design specs]
  • プラットフォーム機能（生体認証、ウィジェット）
  • MVI パターンを採用したクリーンアーキテクチャ 共通ロジックに従ってください：[architecture doc]」
• 前のコンテキスト：API コントラクト、Material Design の仕様、共通パターン
• 期待される出力：テストを含むネイティブ Android 実装

4d. デスクトップ実装（任意 - Electron/Tauri）

• subagent_type="frontend-mobile-development::frontend-developer" を指定して Task ツールを使用します
• プロンプト：「次の技術を使用して、デスクトップ版を実装してください。Tauri 2.0 または Electron を使用します。
  • 可能な限り Web のコードベースを共有
  • OS とのネイティブ統合（システムトレイ、通知）
  • 必要に応じたファイルシステムへのアクセス
  • 自動更新機能
  • コード署名と公証の設定
  • キーボードショートカットとメニューバー
  • 該当する場合はマルチウィンドウ対応 Web コンポーネントを再利用してください：[web implementation]」
• 前のコンテキスト：Web 実装、デスクトップ固有の要件
• 期待される出力：プラットフォーム用パッケージを含むデスクトップアプリケーション

フェーズ 3：統合と検証

5. API ドキュメントとテスト

• subagent_type="documentation-generation::api-documenter" を指定して Task ツールを使用します
• プロンプト：「次の内容を含む包括的な API ドキュメントを作成してください。
  • インタラクティブな OpenAPI/Swagger ドキュメント
  • プラットフォーム固有の統合ガイド
  • 各プラットフォーム向けの SDK サンプル
  • 認証フロー図
  • レート制限とクォータの情報
  • Postman/Insomnia コレクション
  • WebSocket 接続のサンプル
  • エラー処理のベストプラクティス
  • API のバージョニング戦略 プラットフォーム実装を使用して、すべてのエンドポイントをテストしてください。」
• 前のコンテキスト：実装済みのプラットフォーム、API の使用パターン
• 期待される出力：完全な API ドキュメントポータル、テスト結果

6. クロスプラットフォームのテストと機能の同等性

• Task ツールを subagent_type="unit-testing::test-automator" で使用します
• プロンプト: 「すべてのプラットフォームで機能の同等性を検証します。
  • 機能テストマトリックス（機能が同じように動作すること）
  • UI の一貫性の検証（デザインシステムに準拠していること）
  • プラットフォームごとのパフォーマンスベンチマーク
  • アクセシビリティテスト（プラットフォーム固有のツール）
  • ネットワーク耐障害性テスト（オフライン、低速接続）
  • データ同期の検証
  • プラットフォーム固有のエッジケース
  • エンドツーエンドのユーザージャーニーテスト プラットフォーム間の不一致があれば、テストレポートにまとめてください。」
• 前のステップからのコンテキスト: すべてのプラットフォームの実装、API ドキュメント
• 期待される出力: テストレポート、同等性マトリックス、パフォーマンス指標

7. プラットフォーム固有の最適化

• Task ツールを subagent_type="application-performance::performance-engineer" で使用します
• プロンプト: 「各プラットフォームの実装を最適化します。
  • Web: バンドルサイズ、遅延読み込み、CDN の設定、SEO
  • iOS: アプリサイズ、起動時間、メモリ使用量、バッテリー
  • Android: APK サイズ、起動時間、フレームレート、バッテリー
  • デスクトップ: バイナリサイズ、リソース使用量、起動時間
  • API: 応答時間、キャッシュ、圧縮 プラットフォームの強みを活用しながら、機能の同等性を維持してください。 最適化手法とトレードオフを記録してください。」
• 前のステップからのコンテキスト: テスト結果、パフォーマンス指標
• 期待される出力: 最適化された実装、パフォーマンスの改善

設定オプション

• --platforms: 対象プラットフォームを指定します（web,ios,android,desktop）
• --api-first: UI の実装前に API を生成します（デフォルト: true）
• --shared-code: Kotlin Multiplatform などを使用します（デフォルト: 評価）
• --design-system: 既存のものを使用するか、新しく作成します（デフォルト: 作成）
• --testing-strategy: 単体テスト、統合テスト、E2E（デフォルト: すべて）

成功基準

• 実装前に API コントラクトが定義され、検証されている
• すべてのプラットフォームで、合意した観測可能な動作マトリックスに適合していること。意図的な違いは記録する
• パフォーマンス指標がプラットフォーム固有の基準を満たしている
• アクセシビリティ基準を満たしている（最低でも WCAG 2.2 AA）
• クロスプラットフォームテストで一貫した動作が確認されている
• すべてのプラットフォームのドキュメントが完成している
• コードの再利用は有用な場合にのみ測定する。恣意的な割合を達成するために、ネイティブの動作を犠牲にしない
• 各プラットフォームの慣習に合わせてユーザーエクスペリエンスを最適化する

プラットフォーム固有の考慮事項

Web: PWA の機能、SEO の最適化、ブラウザーの互換性 iOS: App Store のガイドライン、TestFlight での配布、iOS 固有の機能 Android: Play Store の要件、Android App Bundle、デバイスの断片化 デスクトップ: コード署名、自動更新、OS 固有のインストーラー

初期機能仕様: $ARGUMENTS

例

ユーザーのリクエスト:

API ファーストのアーキテクチャと並行実装の戦略を用いて、Web、モバイル、デスクトップの各プラットフォームで同じ機能を一貫して構築し、デプロイしてください。

制限事項

• タスクが上記の範囲に明確に該当する場合にのみ、このスキルを使用してください。
• 出力を、環境固有の検証、テスト、専門家によるレビューの代わりとして扱わないでください。
• 必要な入力、権限、安全上の境界、または成功基準が不足している場合は、作業を停止して確認を求めてください。