AIが書いたコードをAIが検証する！自律的なモバイルアプリ開発の実現

Transcript

1. AIが書いたコードをAIが検証する！ 自律的なモバイルアプリ開発の実現 henteko
2. 今井健太@henteko • DeployGate inc. Co-founder/CPO • 2児の父
3. AIが書いたコードをAIが検証する！ 自律的なモバイルアプリ開発の実現
4. Vibe Coding
5. 人間がコードを一切書かず に、 AIに要件を伝えるだけでアプリを開発する
6. Vibe Codingの課題 「品質」
7. 複雑なものを作ろうとすると 動くものがうまく作れない
8. 動かすことができる最小単位 での開発
9. 「人間がコードに一切触れない 」が影響して デグレが発生する
10. AI自身に動作確認を行わせる
14. カスタムコマンドの利用 現在の差分を確認し、影響範囲において動作確認項目を作成してください。 作成した動作確認項目を isc を利用して iPhone 16 Pro(iOS 18.2) を起動し確認 してください。 WDA pathには '/your/path/WebDriverAgent' を利用してください。 画面を操作する際には必ずiscのelements sourceを利用して、画面要素を確認し て、操作にはできる限りelements clickを利用してください。 動作確認実施時は必ず画面を録画してください。
15. 実際の開発を通して紹介
16. フェーズ1: プロジェクト基盤構築
17. フェーズ2: デザインシステムとナビゲーション骨格
18. フェーズ2: デザインシステムとナビゲーション骨格 • タブバーの作成 • 各画面の作成 • 本を追加するボタンの作成
20. フェーズ3: 書籍登録フローと蔵書一覧
21. フェーズ3: 書籍登録フローと蔵書一覧 • 本の登録フォーム • 作成された本の一覧画面
22. フェーズ4: 書籍詳細画面と進捗更新
24. 詳細画面に遷移すると クラッシュ！
25. エラーログと一緒に再修正を指示
27. 更新を保存すると クラッシュ！
28. 実装が気づかなかった画面の不具合を AIがキャッチ
29. Re: エラーログと一緒に再修正を指示
30. フェーズ5: ホームダッシュボード
31. フェーズ6: 読了ログタブ
34. エラーログと一緒に再修正を指示
36. ラストフェーズ: 全体確認
37. プロンプト アプリの内容と現在のUI実装とを確認し、できる限りユーザーストーリーにそう形で の動作確認項目をまとめてください。 まとめた動作確認項目を isc を利用して iPhone 16 Pro(iOS 18.2) を 起動し確認してください。 WDA pathには '/your/path/WebDriverAgent' を利用してください。 画面を操作する際には必ずiscのelements sourceを利用して、画面要素を確認し て、操作にはできる限りelements clickを利用してください。 動作確認実施時は必ず画面を録画してください。
39. 更新を保存すると クラッシュ！(2度目)
40. エラーログと一緒に再修正を指示後 完成
41. AIによる動作確認は万能ではないが 一定有用である
42. 「影響範囲がわからない」 「そんな画面いつの間に作ってたの」 しっかりと確認してくれる安心感
43. デメリット 時間がとにかくかかる
44. モデルの進化で来年には解決していそう
45. Vibe Codingにおいては 頻出するバグの箇所のみ テストをAIに書いてもらうのが有用
46. まとめ • 影響範囲をしっかりと確認してくれる • AIによる動作確認は現状時間がかかる ◦ これはモデルの性能が解決する可能性が高い • AIによる動作確認で得られた知見をテストコードに反映する
47. さいごに https://zenn.dev/henteko/articles/4e4c4de127d7a4