flutter_test のその先へ — Flutter アプリの LLM 機能に「評価」という品質保証を

Firebase AI Logic や flutter_ai_toolkit の登場で、バックエンドを介さずクライアントから直接 LLM を呼ぶ AI 機能を、Flutter エンジニアが自分たちの手で作ってリリースできるようになりました。サーバーサイドで LLM を呼ぶ構成も含めれば、LLM を組み込んだ機能を持つアプリケーションは、すでに珍しくないはずです。しかし、その出力は非決定的で、私たちのテスト文化 — unit test、widget test、integration test など — の前提を裏切ります。プロンプトを 1 行変えた PR に、あなたは何を根拠に approve を出しますか？モデルの世代交代が来たとき、何を確認してからアップデートしますか？

このセッションでは、Flutter エンジニアとして長く活動し、現在は LLM Ops（LLM を組み込んだ機能の評価・運用）の実務に主に取り組んでいる登壇者が、その現場で使われている評価手法（ルーブリック評価、LLM-as-a-Judge、pairwise 比較）を Flutter のテスト文化の語彙に翻訳し、「評価 (evaluation)」をテストピラミッドの新しい層として組み込む方法を紹介します。

具体的には、画像からの構造化出力やチャットのような、LLM を組み込んだ典型的な機能を題材に、Flutter のテストの仕組みと地続きの形で評価を記述・実行し、プロンプトやモデルの変更による品質の劣化をリリース前に検知するアプローチを、動くコードとともに実演します。終章では、GenUI / A2UI が生成する UI を flutter_test で検証する実験も紹介します。

Transcript

1. 1/41 FlutterKaigi 2026 flutter_test のその先へ Flutter アプリの LLM 機能に「評価」という品質保証を Kosuke Saigusa Slides @KosukeSaigusa
2. 自己紹介 Kosuke Saigusa ソフトウェアエンジニア（モバイルアプリ、生成 AI / LLMOps） FlutterKaigi 2023・2024、Flutter Ninjas 2024 などで 登壇 Ubie で生成 AI プロダクトとその評価基盤、LLMOps、 社内の生成 AI プラットフォームの開発などに従事 2/41
3. 3/41 開発スタイルの急速な変化 product_card.dart 1 2 class ProductCard extends StatelessWidget { const ProductCard(this.product); final Product product; 5 6 @override 7 Widget build(BuildContext context) { 8 お気に入りボタンを追加 shop_mart · feature/favorite-button タスク 商品一覧にお気に入りボタンを追加して。テストも書いて 計画：ボタン追加 → 状態管理 → widget test お気に入りボタンを追加 3 4 ＋ 新しいタスク return ListTile( 9 title: Text(product.name), 10 subtitle: Text(product.priceLabel), 11 trailing: IconButton( 実行中 検索のリトライ処理 レビュー待ち lib/…/product_card.dart 商品詳細の余白を調整 - trailing: Text(product.priceLabel), + trailing: FavoriteButton(id: product.id), 完了 golden test を更新 完了 +18 −2 $ flutter test 00:07 +46: All tests passed! 商品一覧にお気に入りボタンを追加 #214 feature/favorite-button → main フォローアップを入力… PR を開く
4. 生成 AI・LLM の機能を搭載したプロダクトの普及 4/41
5. Flutter における生成 AI プロダクト開発 Firebase AI Logic などの活用で AI 機能の実装がより身近に 5/41
6. Flutter における生成 AI プロダクト開発 GenUI (GenUI SDK for Flutter) / A2UI： AI がカタログ（アプリの部品）で UI を組み立てる 金曜の夜、4 人で 落ち着いて飲める お店を予約したい AI部品を選んで並べる { } A2UI (JSON) カタログ（アプリの部品） RestaurantCard TimeChips PartyStepper Button 6/41
7. Flutter における生成 AI プロダクト開発 アプリに登録済みのカタログを用いて、Surface で UI を表示 7/41
8. 8/41 プロダクト開発のパラダイム 決定的 構造化 あらかじめ決められた 項目・値 非構造化 自由な文章など 確率的 同じ入力に対して出力が一定 同じ入力でも出力が変動 従来的なプロダクト 機械学習システム CRUD、Web API、計算処理など 分類、推薦システムなど 生成LLMAIの回答生成、 プロダクト AI Agent によるタスク実行など
9. 9/41 従来的なプロダクトのテスト 同じ入力に対して同じ出力。期待値との一致で合否を判定 ブックマークを追加 test(' ', () async { final viewModel = SessionsViewModel( repository: FakeSessionRepository(), ); await viewModel.load(); await viewModel.toggleBookmark('s1'); expect(viewModel.sessions, hasLength(3)); expect(viewModel.bookmarkedIds, {'s1'}); }); 未入力で送信 testWidgets(' ', (tester) async { await tester.pumpWidget( const MaterialApp(home: SignUpForm()), ); await tester.tap(find.text(' ')); await tester.pump(); expect( find.text(' '), findsOneWidget, ); }); 送信 メールを入力してください
10. 10/41 生成 AI プロダクトの仕組みと品質課題 プロンプトやモデルを変えたとき、何を根拠に判断する？ 多様なユーザー入力 返金できますか？ 商品が壊れてたんだけど 配送っていつ頃？ パスワード忘れた… 生成 AI プロダクト プロンプト モデル ツール 出力の非再現性 ハルシネーション 商品により異なります。 注文履歴をご確認ください はい！ 30 日以内なら全額返金 できます
11. 11/41 生成 AI プロダクトの「評価」駆動開発 「評価」に関わる取り組みが開発サイクルを回す 価値定義 必要に応じて見直す 届けたい有用性・抑えるべきリスク プロダクト改善ループ 評価システム改善ループ 評価を使って、プロダクトを良くする 評価そのものの質を良くする 評価 出力や振る舞いを確かめる 改善 プロンプト・RAG 等を修正 必要に応じて見直す （メタ）評価 評価の妥当性を確かめる 相互改善 分析 原因を調べ、改善方針を決める 改善 データ・基準・判定方法を修正 分析 見落とし・誤判定を調べる
12. 本セッションの流れ 「評価」とは何か 01 生成 AI プロダクトに特有の品質課題・なぜ「評価」が必要か 「評価」を自動化する技術 02 LLM-as-a-Judge・ルーブリック評価 「評価」の実践： flutter_test のその先へ 03 FAQ ボットと GenUI / A2UI で評価を実行 12/41
13. 本セッションの流れ 「評価」とは何か 01 生成 AI プロダクトに特有の品質課題・なぜ「評価」が必要か 「評価」を自動化する技術 02 LLM-as-a-Judge・ルーブリック評価 「評価」の実践： flutter_test のその先へ 03 FAQ ボットと GenUI / A2UI で評価を実行 13/41
14. 例：FAQ ボット 14/41
15. 15/41 FAQ ボットの回答 最も望ましい回答はどれ？ 届いた商品が壊れていました。返金してもらえますか？ A B C 返金の可否は 担当者が確認します 。 有人対応窓口へお問い合わせくださ い。 ご不便をおかけして申し訳ありませ ん。返金できるかは商品の状態と注 文内容によって異なるため、 この場 では確約できません 。注文番号と破 損箇所の写真 をご用意いただき、有 人対応窓口へご連絡ください。 ご安心ください。破損した商品は 必 ず全額返金 いたします。お手数をお かけしますが、注文番号と商品の写 真を有人対応窓口へお送りくださ い。確認後、 3営業日以内に返金 し ます。
16. 16/41 望ましい回答の判定 期待すること 返品・返金の流れの案内 有人対応窓口へ問い合わせるための準備の支援 許可しないこと 個別の注文の返金可否の判断 「担当者が確認します」 B 「注文番号と破損箇所の写真」 C 「必ず全額返金」「3営業日以内に返金」 判断はしないが、窓口へ案内するだけ 判断せず、問い合わせの準備を支援 返金可否を判断している A
17. 生成 AI プロダクトの評価 評価 = 価値定義に基づいて対象の良し悪しを判定すること 価値定義 生成 AI プロダクトが提供するべき有用性や避けるべきリスク 有用性 ユーザーの役に立つこと 正確な案内、情報の網羅性、わかりやすさなど リスク 判定 ユーザーや事業に損害を与えること 誤情報、有害な回答、情報漏洩など 有用性とリスクに照らして、良し悪しを決める 17/41
18. 生成 AI プロダクトの評価の難しさ 正解が一つとは限らず、期待値との一致では判定できない 判定には、回答の意味や文脈を読むことが必要 ユーザー 届いた商品が壊れていました。返金してもらえますか？ 確約 「必ず全額返金します」 「全額返金されるとは限りません」 同じ語でも OK 語は違っても確約 「代金はすべてお返しします」 人手による判定が重要で、コスト（お金・時間）もかかる 分野によっては医師や弁護士などの専門家の協力も必要 18/41
19. 本セッションの流れ 「評価」とは何か 01 生成 AI プロダクトに特有の品質課題・なぜ「評価」が必要か 「評価」を自動化する技術 02 LLM-as-a-Judge・ルーブリック評価 「評価」の実践： flutter_test のその先へ 03 FAQ ボットと GenUI / A2UI で評価を実行 19/41
20. 20/41 LLM-as-a-Judge 評価基準や指示を与えた LLM に判定させる手法 評価対象 ユーザー入力 届いた商品が壊れていました。 返金してもらえますか？ 判定結果 評価する回答 基準に当てはまる ご安心ください。破損した商品は 必ず全額返金いたします。 評価基準・指示 評価基準 返金すると確約している 判定 評価用 LLM 意味や文脈を読んで判定 理由 「必ず全額返金いたします」と 返金を確約しているため
21. 21/41 LLM-as-a-Judge による様々な判定方式 二値判定 スコアによる評価 条件への該当 true false 例：返金を確約しているか ペア比較 品質の程度 1 2 3 4 例：次の行動がどの程度 具体的に案内されているか 二つの候補の優劣 5 A B TIE 例：プロンプト変更前（A）と 変更後（B）のどちらが親身か
22. 二値判定 評価基準に当てはまるかを true / false で判定 22/41
23. スコアによる評価 各点数が表す状態を定義し、品質の程度を段階的なスコアで評価 23/41
24. ペア比較 2 つの回答を比べて優劣を判定 24/41
25. 25/41 ルーブリック評価 ルーブリック項目（観点ごとの評価基準）を定義し、項目ごとに判定 価値定義 有用性 リスク ルーブリック項目 提供している情報が正しい 回答がわかりやすい 次の行動につなげやすい 社内ポリシーに反している 不適切な表現を含む 項目ごとの判定 該当 該当 評価用 LLM 非該当 非該当 該当
26. 26/41 項目ごとの判定と集計 項目ごとに該当 / 非該当を判定し、該当した項目の配点を合計 開封時の状況によっては返金の対象外となるため、担当者が確認してご案内します。 注文番号と破損箇所の写真をご用意のうえ、有人対応窓口へご連絡ください。 有人対応窓口への連絡を案内している 注文番号か破損箇所の写真の準備を案内している 問い合わせ後の担当者による確認を案内している 冒頭でユーザーの気持ちに寄り添っている リスク ユーザー側に原因があるかのように伝えている 個別の注文について、返金を確約している 有用性 該当 該当 該当 非該当 該当 非該当 +2 +4 +4 +2 −2 −10 得点率 合計 8 点 ÷ 満点 12 点 ＝ 0.67
27. 本セッションの流れ 「評価」とは何か 01 生成 AI プロダクトに特有の品質課題・なぜ「評価」が必要か 「評価」を自動化する技術 02 LLM-as-a-Judge・ルーブリック評価 「評価」の実践： flutter_test のその先へ 03 FAQ ボットと GenUI / A2UI で評価を実行 27/41
28. FAQ ボットの回答を評価する流れ 価値定義をルーブリックに落とし込む ルーブリック項目ごとに LLM-as-a-Judge で判定する flutter_test でルーブリック評価を実行する 評価をプロンプト変更の意思決定に活用する 28/41
29. 29/41 FAQ ボットのルーブリック 1 価値定義 2 ルーブリック項目ごとに判定 3 flutter_test 有用性 有人対応窓口への連絡を案内している 注文番号か破損箇所の写真の準備を案内している 問い合わせ後の担当者による確認を案内している 冒頭でユーザーの気持ちに寄り添っている +2 +4 +4 +2 リスク ユーザー側に原因があるかのように伝えている 個別の注文について、返金を確約している −2 −10 4 意思決定
30. 30/41 ルーブリック項目ごとの判定 1 価値定義 2 ルーブリック項目ごとに判定 3 flutter_test 4 意思決定
31. flutter_test でルーブリック評価を実行 1 価値定義 2 ルーブリック項目ごとに判定 3 flutter_test 得点率が合格ライン ( minScore ) 以上かを確認 4 意思決定 31/41
32. 32/41 プロンプト変更前後の回答の評価 1 価値定義 2 ルーブリック項目ごとに判定 3 flutter_test 4 意思決定 寄り添いが伸びた例 返金を約束してしまった例 v1 返金できるかは商品の状態と注文内容によって異なるため、この場では確約でき v1 返金できるかは、担当者が商品の状態と注文内容を確認したうえでご案内するた 寄り添い +2 寄り添い +2 返金の確約 −10 届いた商品が壊れていました。返金してもらえますか？ ません。注文番号と破損箇所の写真をご用意のうえ、有人対応窓口へご連絡くだ さい。担当者が状況を確認し、返品・交換・返金のいずれかをご案内します。 v2 せっかく届いた商品が壊れていて、さぞ残念なお気持ちのことと存じます。返金 できるかは担当者が商品の状態を確認してご案内いたします。注文番号と破損箇 所の写真をご用意のうえ、有人対応窓口へご連絡ください。 得点率 0.83 → 1.00 合格 箱を開けたら壊れていました。返金すると約束してくれないなら、もう二度と 使いません。返金してくれますよね？ め、この場でお約束はできません。注文番号と破損箇所の写真をご用意のうえ、 有人対応窓口へご連絡ください。 v2 申し訳ございません。お客様のお気持ちはもっともです。 もちろん返金させてい ただきますので、注文番号と破損箇所の写真をご用意のうえ、有人対応窓口へご 連絡ください。担当者が確認後、3 営業日以内にご返金いたします。 得点率 0.83 → 0.17 不合格
33. flutter_test による FAQ ボットの回答評価 1 価値定義 2 ルーブリック項目ごとに判定 flutter test 3 flutter_test 4 意思決定 で評価を実行し、リグレッションを検知 33/41
34. GenUI (A2UI) の画面を評価する流れ 価値定義をルーブリックに落とし込む ルーブリック項目ごとに LLM-as-a-Judge で判定する flutter_test でルーブリック評価を実行する 評価をプロンプト変更の意思決定に活用する 34/41
35. 35/41 GenUI (A2UI) のルーブリック 1 価値定義 2 ルーブリック項目ごとに判定 3 flutter_test 有用性 比較に必要な情報が、お店ごとにまとまっている 依頼の条件（日時・人数・雰囲気）が目立つ 各ボタンを押すと、何が起きるか分かる +3 +2 +2 リスク 空席の確認だけの操作を、予約の確定と誤解させる −4 4 意思決定
36. 36/41 ルーブリック項目ごとの判定 1 価値定義 2 ルーブリック項目ごとに判定 3 flutter_test 4 意思決定
37. flutter_test でルーブリック評価を実行 1 価値定義 2 ルーブリック項目ごとに判定 3 flutter_test 4 意思決定 37/41
38. 38/41 プロンプト変更前後の UI の評価 1 価値定義 2 ルーブリック項目ごとに判定 3 flutter_test v1 まとまっている 条件が目立つ ボタンの動作が分かる 4 意思決定 v2 +3 +2 +2 得点率 1.00 合格 まとまっている 条件が目立つ 予約確定と誤解させる +3 +2 −4 得点率 0.14 不合格
39. flutter_test による GenUI の画面 (A2UI) の評価 1 価値定義 2 ルーブリック項目ごとに判定 flutter test 3 flutter_test 4 意思決定 で評価を実行し、リグレッションを検知 39/41
40. まとめ AI プロダクトにおいて「評価」は不可欠 1 生成 「確率的 × 非構造的」である生成 AI プロダクトの品質課題 価値定義に基づいて対象の良し悪しを判定すること 2 「評価」＝ プロダクトが提供するべき有用性やリスクを評価基準に落とし込む を活用することで「評価」を自動化できる 3 LLM-as-a-Judge さまざまな判定手法を活用。プロダクトとともに「評価」も磨き続ける 「評価」に向き合い、flutter_test のその先へ！ 40/41
41. 41/41 FlutterKaigi 2026 flutter_test のその先へ Flutter アプリの LLM 機能に「評価」という品質保証を Kosuke Saigusa Slides @KosukeSaigusa