mcpField
O
oma-mobile

oma-mobile

github.com/gracefullight開発49155 回インストール1 日前に更新
リポジトリ

oma-mobile について

oma-mobileは、クロスプラットフォームのモバイルアプリを構築・変更・検証するスキルです。Flutter、React Native、Swiftの開発を対象に、アーキテクチャ、プラットフォーム固有の動作、状態管理、テストを扱います。

主な機能

  1. 01Flutter、React Native、Swiftのモバイル開発手順
  2. 02ドメイン・データ・プレゼンテーション層の指針
  3. 03プラットフォームUIとネイティブ機能への対応
  4. 04ユニット、ウィジェット、統合、E2Eテスト
  5. 05オフライン動作とアプリライフサイクルの確認

活用シーン

  1. 01モバイル画面や機能の実装
  2. 02カメラ、GPS、プッシュ通知の追加
  3. 03オフラインファーストのモバイルフロー構築
  4. 04Maestroによる重要なモバイルフローの検証

インストール

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

$npx skills add https://github.com/gracefullight/stock-checker --skill oma-mobile

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

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

resources/
checklist.md
error-playbook.md
examples.md
execution-protocol.md
screen-template.dart
screen-template.swift
screen-template.tsx
snippets.md
tech-stack.md
variants/
README.md
stack.schema.json
variants/flutter/
api-template.dart
snippets.md
stack.yaml
tech-stack.md
variants/react-native/
api-template.ts
snippets.md
stack.yaml
tech-stack.md
variants/swift-ios/
api-template.swift
snippets.md
stack.yaml
tech-stack.md

詳細

モバイルエージェント - クロスプラットフォームモバイルスペシャリスト

スケジューリング

目標

クリーンなアーキテクチャ、プラットフォームに適した UI、状態管理、パフォーマンス、E2E カバレッジを備えたクロスプラットフォームモバイルアプリの機能を構築、変更、検証します。

インテントシグネチャ
  • ユーザーがモバイルアプリ、Flutter、Dart、React Native、iOS、Android、Riverpod、ウィジェット、カメラ、GPS、プッシュ通知、またはオフラインファーストの作業を求めている。
  • ユーザーが Web フロントエンドではなく、ネイティブまたはクロスプラットフォームのモバイル動作を必要としている。
使用する場合
  • ネイティブモバイルアプリ(iOS + Android)の構築
  • モバイル固有の UI パターン
  • プラットフォーム機能(カメラ、GPS、プッシュ通知)
  • オフラインファーストアーキテクチャ
使用しない場合
  • Web フロントエンド → フロントエンドエージェントを使用
  • バックエンド API → バックエンドエージェントを使用
期待される入力
  • 対象の画面、ウィジェット、機能、プラットフォーム機能、またはモバイルフロー
  • 既存のアプリのアーキテクチャ、状態管理パターン、API コントラクト、プラットフォームの制約
  • ユニット、ウィジェット、インテグレーション、または Maestro E2E カバレッジに関するテスト要件
期待される出力
  • ドメイン、データ、プレゼンテーション、プラットフォーム、またはテストファイルへのモバイルコードの変更
  • 適用可能な場合、Material Design 3 と iOS HIG に沿った UI
  • モバイルのチェックと重要なフローテストによる検証結果
依存関係
  • プロジェクトに応じた Flutter/Dart または React Native ツールチェーン
  • 該当する場合、Riverpod/Bloc、Dio、プラットフォーム SDK、Maestro
  • resources/execution-protocol.md、サンプル、スニペット、チェックリスト、画面テンプレート
制御フロー機能
  • プラットフォーム、状態管理パターン、オフライン要件、ネイティブ権限、テストレベルに応じて分岐
  • モバイルコードベースのファイルを読み書き
  • ビルド、テスト、シミュレーター、エミュレーター、または E2E コマンドを呼び出す場合がある

構造フロー

開始
  1. 対象のプラットフォーム、画面/機能、アーキテクチャ層、状態境界を特定します。
  2. 既存のモバイルパターンと依存関係を確認します。
  3. テストレベルと検証環境を判断します。
シーン
  1. 準備:アプリのアーキテクチャ、プラットフォームの制約、受け入れ条件を読み込みます。
  2. 取得:既存のウィジェット/画面、プロバイダー/Bloc、API クライアント、テストを読み込みます。
  3. 実行:モバイル UI、状態、プラットフォーム連携、オフライン処理、テストを実装します。
  4. 検証:関連するユニット/ウィジェット/インテグレーション/E2E チェックを実行します。
  5. 完了:動作、対象プラットフォーム、検証結果を報告します。
遷移
  • ビジネスロジックが複雑な場合は、プレゼンテーション層の前にドメイン/データ層に配置します。
  • ネットワーク呼び出しが必要な場合は、インターセプターとオフライン処理を備えた Dio を使用します。
  • 重要なユーザーフローに変更を加える場合は、Maestro E2E カバレッジを追加または更新します。
  • バックエンドのコントラクトが不足している場合は、バックエンド/API の作業と調整します。
失敗と復旧
  • プラットフォーム SDK またはエミュレーターを利用できない場合は、検証上の制限を報告します。
  • 権限またはネイティブ機能が不足している場合は、プラットフォーム設定を明示的に追加するか、ブロッカーを記録します。
  • テストが失敗した場合は、引き渡し前に修正するか、失敗したチェックを報告します。
終了
  • 成功:モバイル機能が対象プラットフォームで動作し、関連するチェックに合格している。
  • 部分的な成功:プラットフォーム、シミュレーター、依存関係、または検証上の不足が明示されている。

論理操作

アクション
アクションSSL プリミティブ証拠
モバイルアーキテクチャを調査READドメイン/データ/プレゼンテーションのファイル
状態管理とプラットフォーム戦略を選択SELECTRiverpod/Bloc とプラットフォームの制約
モバイルコードを実装WRITEウィジェット、画面、プロバイダー、クライアント
ライフサイクルと権限を検証VALIDATEDispose、権限、オフライン動作
検証ツールを呼び出すCALL_TOOLテスト、ビルド、Maestro
結果を報告NOTIFY最終概要
ツールと機器
  • Flutter/Dart または React Native スタック
  • Riverpod/Bloc、Dio、プラットフォーム SDK、Maestro
  • ユニット、ウィジェット、インテグレーション、E2E テストコマンド
標準的なワークフローの流れ

設定済みのコードインテリジェンスプロバイダーを使用して、ファイルの場所を特定し、シンボルやコンテンツを調べます。Serena では、find_file、search_for_pattern、get_symbols_overview、find_symbol を使用します。ネイティブ検索は、プロバイダーの除外設定と、プロジェクトの検索ポリシーで許可されているコード以外のパスに限定されます。

次に、プロジェクトのモバイル検証コマンドを実行します。通常は、ユニットテスト/ウィジェットテストと、重要なフローに対する Maestro E2E テストを実行します。

リソースの範囲
範囲リソースの対象
CODEBASEモバイルのソース、テスト、プラットフォーム設定
LOCAL_FSテンプレート、スニペット、リソース
PROCESSビルド、テスト、エミュレーター、シミュレーター、E2E コマンド
NETWORK機能がリモートと連携する場合のバックエンド API
前提条件
  • 対象となるモバイル機能とプラットフォームの範囲を特定できること。
  • 必要な SDK、権限、API コントラクトが利用可能であるか、前提条件が明記されていること。
影響と副作用
  • モバイルのソース、テスト、プラットフォーム設定を変更します。
  • 権限、アプリのライフサイクル、オフラインデータ、パフォーマンスに影響する可能性があります。
ガードレール

対象プロジェクトで既定の選択が確立されていない場合に限り、フレームワーク、ライブラリ、アーキテクチャ、データモデルの既定値を適用します。範囲を限定した編集は、スタックの移行や無関係なインフラストラクチャの変更を許可するものではありません。

  1. クリーンアーキテクチャ:domain -> data -> presentation
  2. 状態管理には Riverpod/Bloc を使用します(複雑なロジックに素の setState は使用しません)
  3. Material Design 3(Android)+ iOS HIG(iOS)
  4. すべてのコントローラーを dispose() メソッドで破棄します
  5. 認証/再試行/ログ記録のインターセプターとオフライン処理を備えたプラットフォームのトランスポートを使用します。Flutter では Dio、React Native では TanStack Query の背後で axios、Swift では生成された Client ミドルウェアを使用します。
  6. 目標は 60fps です。サポート対象のプラットフォームを確認します(Swift iOS は iOS のみが必要です)
  7. 重要なユーザーフローの E2E テストには Maestro を使用します
  8. Swift ネイティブ:SwiftUI + @MainActor @Observable ビューモデル(Observation フレームワーク、iOS 17 以降)を使用します。Task から監視対象の状態を変更する非隔離 VM は、Swift 6 の厳密な並行処理チェックでエラーになります
  9. Swift ネイティブ:既存の API レイヤーを使用します。プロジェクトで OpenAPI 生成を採用している場合は、対象エンドポイントに生成済みの Client を使用します。UI のみの編集でジェネレーターを導入しないでください。
  10. Swift ネイティブ:レスポンスキャッシュが必要な場合は、既存の Repository キャッシュを使用します。新たに hyperoslo/Cache を実装する場合は、ResponseCache actor を使用します。デコード済みモデルをキャッシュし(HTTPBody は決してキャッシュしません)、読み取り時には stale-while-revalidate 方式で古いデータを返しながら再検証し、書き込み時にはキーを無効化します。ビューモデルは具象サービスではなく、プロトコルの接続点に依存させます(variants/swift-ios/snippets.md §10 を参照)
  11. Swift ネイティブ:App/Core/Features/Shared のプロジェクト構成に従います
  12. Swift ネイティブ:すべての UI の判断で iOS Human Interface Guidelines に従います
  13. Swift ネイティブ:ユニットテストには XCTest または Swift Testing、重要なフローには XCUITest を使用します。構造化された .task {} で処理をキャンセルします(画面が表示されなくなると自動キャンセルされます)。Swift 6 では deinit は非隔離であり、@MainActor の状態にアクセスできないため、決して使用しないでください(隔離された deinit は Swift 6.2 以降が必要です)
  14. Swift ネイティブ:ルート層でエッジスワイプによる戻る操作を復元します。ナビゲーションバーを非表示にした画面(.toolbar(.hidden, for: .navigationBar))ではこの操作が失われるため、画面ごとではなく、swipeBackDestination ラッパーを使ってプッシュルートを登録します(variants/swift-ios/snippets.md §9 を参照)
  15. Flutter:オフラインレスポンスのキャッシュが必要な場合は、既存のリポジトリーキャッシュを使用します。Drift を追加する場合は、キャッシュ済みのエンティティを読み取ってから再検証し(stale-while-revalidate)、書き込みのたびに影響を受ける行を無効化/更新します。デコード済みエンティティはデータレイヤーでキャッシュし、Dio のトランスポートでは決してキャッシュしないでください(variants/flutter/snippets.md §3、§10 を参照)
  16. React Native:既存のサーバー状態レイヤーを維持します。staleTime/gcTime を明示して TanStack Query を使用する場合は、変更のたびに影響を受けるクエリーキーを無効化します。オフライン永続化が必要な場合に限り、アカウントごとのキャッシュを MMKV に永続化します。画面ではクエリー/ミューテーションフックを使用し、axios を直接呼び出さないでください(variants/react-native/snippets.md を参照)

参照資料

  • 実行手順(選択したタスクに従ってください):resources/execution-protocol.md
  • コードスニペット(Swift):variants/swift-ios/snippets.md
  • コードスニペット(Flutter):variants/flutter/snippets.md
  • コードスニペット(React Native):variants/react-native/snippets.md
  • チェックリスト(引き渡し前に実行してください):resources/checklist.md
  • エラー復旧:resources/error-playbook.md
  • 技術スタックのインデックス(全プラットフォーム):resources/tech-stack.md
  • 技術スタック(Swift):variants/swift-ios/tech-stack.md
  • 技術スタック(Flutter):variants/flutter/tech-stack.md
  • 技術スタック(React Native):variants/react-native/tech-stack.md
  • 画面テンプレート(Flutter):resources/screen-template.dart
  • 画面テンプレート(Swift):resources/screen-template.swift
  • 画面テンプレート(React Native):resources/screen-template.tsx
  • API サービステンプレート(Swift):variants/swift-ios/api-template.swift
  • API サービステンプレート(Flutter):variants/flutter/api-template.dart
  • API サービステンプレート(React Native):variants/react-native/api-template.ts
  • バリアントレジストリ:variants/README.md
  • コンテキストの読み込み:../_shared/core/context-loading.md
  • 明確化:../_shared/core/clarification-protocol.md
  • コンテキスト予算:../_shared/core/context-budget.md
  • 得られた教訓:../_shared/core/lessons-learned.md(過去の失敗に該当する場合、または振り返りを求められた場合)
  • オブザーバビリティの引き継ぎ:../oma-observability/SKILL.md §Integrations — オフラインキューイング、クラッシュ分析、バッテリー消費に応じたサンプリング

コメント