SKILL.md
Preview Slides Skill
Marionette MCPを使用して、実行中のFlutterアプリのスライドをプレビュー・確認するスキル。
作業フロー
1. 接続
起動中のFlutterアプリに接続する。
# ポート番号を確認
lsof -i -P -n | grep flutter_d | grep LISTENポートが見つかったら mcpmarionetteconnect で接続。 見つからない場合はユーザーにアプリの起動を依頼する。
2. 現在のスライドをプレビュー
mcpmarionettetake_screenshots でスクリーンショットを取得。
3. スライドナビゲーション
- 次のスライド:
mcpmarionettetapwithkey: "nav_next" - 前のスライド:
mcpmarionettetapwithkey: "nav_previous"
4. 全スライド一括プレビュー
ユーザーが「全スライド」や「一括」と言った場合：
lib/main.dartからスライド数を確認- 最初のスライドに移動（必要に応じてアプリ再起動）
- 各スライドのスクリーンショットを取得しながら順番に進める
- ステップがあるスライドは全ステップ分進める
for each slide:
take_screenshots
tap key: "nav_next"5. 特定スライドへのジャンプ
特定のスライドを確認したい場合：
lib/slides/slides.dartとlib/main.dartからスライド一覧を取得- 目的のスライドまで navnext/navprevious で移動
- または
initial: trueを設定してホットリスタートで直接ジャンプ
コマンド一覧
| 操作 | コマンド |
|---|---|
| スクリーンショット | mcpmarionettetake_screenshots |
| 次のスライド | mcpmarionettetap key: nav_next |
| 前のスライド | mcpmarionettetap key: nav_previous |
| ホットリロード | mcpmarionettehot_reload |
注意事項
- ナビゲーションボタンは
kDebugModeの時のみ表示される - VS Codeから起動していれば
--disable-service-auth-codesが自動付与される - ホットリロード後はスクリーンショットを再取得して変更を確認する