はじめに

こんにちは、学習トレーニング開発エンジニアの工藤 id:irisuinwl です。最近は加水フォカッチャ作りがマイブームです。

さて、先日学習トレーニングの新機能である「学トレAIコーチ」をリリースしました。
本機能は、生徒自身が学習目標を設定し、AIと伴走しながら継続的な学習を支援する機能となっております。
詳しくは機能紹介動画と紹介ページをぜひご覧になってください！

機能紹介動画:

www.youtube.com

機能紹介ページ: 手軽に個別最適な学習継続を促す-学トレAIコーチ – チエノワ

さて、本記事では「学トレAIコーチ」の企画から開発、リリースまでに参画してきた筆者が開発の上でどのような工夫を行い、上手くいった点、障壁となったかを紹介いたします。

リリースまでの大まかな流れ

本機能の企画スタートからリリースするまでに辿ったプロセスは以下になります

企画立案・価値探索（2024年~2025年9月）
- 市場調査、ユーザーヒアリングなどを通して、企画のコア・バリューを定めて、ユーザーにとって価値あるプロダクトとは何かを検討
- 期間が長いように思えますが、2024年はほぼPoCで、本格的なヒアリングと仮説検証は2025年から開始
- 企画から仕様検討、開発に着手するために必要な情報（企画のWhy、What）を決定してFIXする
- 今回の場合、２つの機能を段階的リリースする方針で進めることとした
機能開発① 生徒が自分の取り組みを把握する機能の仕様検討、開発、リリース（2025年10月~2025年12月）
機能開発② 生徒が自分で設定した目標を学習する機能の仕様検討、開発、リリース（2025/12月 ~ 2026年4月）
- 企画でどんなことを提供したいかを元に、どのようなものを作れば良いのかを明らかにする
- この機能は実現するシナリオが多かったので動くプロトタイプを元に仕様やデザインを詰めつつ実装できる部分から進める「プロトタイプ駆動」開発を行った

以下では各フェーズでどのようなことを行い、作りたいアイデアから実現に至るまでのプロセスを解説します。

企画立案・価値探索

課題仮説、ソリューション仮説の設定

このフェーズではどんなものを開発することがユーザーの価値に繋がるかを考え、プロトタイプの作成、インタビューによって仮説検証を行いました。

具体的には、既存のプロダクトの課題を考え、ユーザー（生徒）は「学習を始めたい意思はあるものの、継続できず困っている」という課題に焦点を当てて、どのような体験を提供するかのループ図を作成しました。

そこから、企画のWhyとWhatにあたる「どんなユーザーが何に困っていて、どのような状態になっていると嬉しいのか」を明らかにするために、ユーザーのペルソナを考えて、提供したい体験を実現するためのバリュープロポジションを作成して、課題仮説の解像度を高めました。

インタビューによる課題仮説の検証

続いて、設定した課題仮説が妥当なものなのかをチェックするために、プロトタイプを用いたユーザーインタビューを行いました。

インタビューする前に1~2週間ほどプロトタイプアプリケーションをユーザーに使用していただきました。

インタビューの目的は、自分たちが考えた仮説が正しいのか、正しくなければどこにギャップがあるのかを検証することです。それを達成するためにインタビュー項目を設計しました。

インタビュー項目として例えば以下のようになります:

「勉強をする際、自分のための勉強だとわかっているが、やる気がでなかったり興味のあることが優先になってしまい、継続的に勉強することができないことに困っていますか？」
- 意図: 課題仮説である「自分のための勉強だとわかっているが、勉強を始められず、継続的に勉強することができないことに困っている」という点を聞く
上記質問を解決する「意思の力にたよらず、コンスタントに勉強ができるような仕組み」があるとすれば、使いたいですか？
- 意図: 解決を求めているか、ソリューションへのイメージを聞く。また、プロトタイプを使っていただいたことで具体的なソリューションのイメージが生徒の課題にフィットしているかをヒアリングする。

インタビュー実施 → フィードバックから仮説の修正 → インタビュー実施という仮説検証サイクルを回してブラッシュアップしていきました。

結果として、プロトタイプを通してユーザーに我々のイメージを伝えやすくなり円滑にインタビューをすることができました。そして、5回以上のインタビューを通して以下のような仮説と体験設計を作ることができました。

このタイムラインから作るべき機能のコア・バリューとして

自分で目の前の学習目標を作る
- 目標設定することで、自分自身の力で学習しようと思ってもらう
自分で設定した目標を学習する
- この勉強をすると成績が上がると思ってもらう
- 自身が勉強に費やせる時間を知ってもらい、その時間に合わせた勉強内容をClassiが提示する
- 「今日やるべきこと（生徒が設定した方針に基づいた勉強内容）」をClassiが提示する
自分の取り組みを把握する
- 行動の積み重ねから、学力の向上を自覚できるように成果を提示する

という２つの機能を段階的に作っていくことを決定しました。

開発フェーズ

「自分で設定した目標を学習する」機能の開発フェーズでは従来のデザインカンプ先行型のフローを見直し、以下の手順で開発しました。

プロトタイプアプリケーションでデザインの骨格を決定
プロトタイプから作るべき機能と要件を決定し、見積もる
開発と詳細なデザイン作成を並行する
作成した機能のQA
機能リリース

今回行ったプロトタイプ駆動な開発方法で上手くいった点、工夫した点を紹介します。

要件定義の時間短縮

今回は作成する機能が多かったため、要件定義にプロトタイプを用いて開発に必要な部分のみ決めて、すぐに開発と詳細なデザインを行う形で進めました。
今までデザイン決定と要件定義を同時に行っていた部分をプロトタイプによって骨格を作ることで短縮できました。
従来では1か月程度掛かっていたものが2週間程度で済み、すぐに開発に入ることができました。
結果として、要件定義・見積もりフェーズを半分程度短縮することに成功しました。

プロトタイプ画面と実際に開発した画面を比較しておおまかなデザインの骨格は変わらないことを見てみます。

デザインやしっかりとした仕様が決まってないプロトタイプを見ながら議論をすすめることで、我々がアプリケーションで達成すべきことは何かという最低限の目線合わせを行いました。その結果、デザインの詳細や実装における詳細はデザイナー、エンジニアが開発していく中で決定していく動きをとることができました。
そして、問題なくリリースを完了することができました。

コンポーネント単位のUIデザインと開発の橋渡しとなったstorybook

プロトタイプを用いて大まかなデザインを決めて開発と詳細なデザインを作っていくうえで、今回のAIコーチでは画面設計とUIパーツ作成を並行して着手しました。

そこで、デザインと開発の連携を円滑にするために、storybookを導入することでデザインコンポーネントレベルで開発・レビュー・テストを可能としました。

storybookとは、UIコンポーネント（ボタンやフォームなど）をカタログのように表示し、画面単体で開発・テストできる無料のOSSです。

storybook.js.org

プロトタイプによるデザインとstorybookを導入した結果として、開発とデザインが独立に動くことに成功して、差し替えも問題なく実装できました。

何が決まっていて何が決まっていないかを明らかにする

プロトタイプによって大まかなデザインは決まっている一方で、開発に必要な情報全てが詳細には決まっていないため、「何を後々詳細に決める必要があるか」、「どこまで実装を進めるか」というところはチームで共通の意識を持ちながら開発を進めていきました。
プランニングなどのスクラムイベントを通して今回作る上で必要なチームの共通意識を持つようにしました。

要件や作りたいもの、デザインの大枠は決まっているものの、開発を進めていく上で、不明瞭な仕様が明らかになる局面もありました。
その際は定例やデイリースクラムなどのイベントや、日頃のslackでのメッセージで都度明らかにしていくことをしていきました。

以前のプロジェクトと比較して、密なコミュニケーションとチーム全体での計画意識が求められたと感じますが、それらはチームイベントやコミュニケーションが十分できていれば問題なく機能するものだと捉えています。

チームが機能し、作りたいプロダクトに意識が向いているというシンプルなことですが、成功させるために最も大切な部分だと私は考えています。

まとめ

新機能「学トレAIコーチ」機能において、価値探索から開発まで一気通貫で携わり、それまでのプロセスを紹介しました。
プロトタイプアプリケーションをインタビューと開発の中で用いました。
- 実際に動いているものを見ることでインタビューでの意思疎通しやすさ、開発を進める上でのチームの共通理解を得やすいという利点がありました。
開発の中でプロトタイプを用いて開発とデザインを並行して行いました。
- その際に何が決定的で何が検討中かを意識、コミュニケーションしながらチームで動くことが開発を成功するうえで大切な要素だと感じました。