🎩

仮説検証フェーズのWebプロダクトの開発を生成AIで加速する

2023/12/10に公開

この記事はUbie株式会社のUbie Engineering Advent Calendar 2023 10日目の投稿です。
https://adventar.org/calendars/9416

はじめに

現在私はUbieにて新規Webプロダクトの立ち上げメンバーとして仕事をしていて、日々プロダクトの価値を生み出すための仮説検証を行っています。このフェーズではとにかくスピーディにユーザーが触ることができるUIを用意してフィードバックを得ることが大切ですが、ChatGPTのような生成AIの爆発的な発展によって、そのスピードをより上げることができるようになっています。
本記事では私が行ってきた仮説検証フェーズでの生成AIの使い方の例をいくつか紹介します。同じようにプロダクトの立ち上げに関わっているソフトウェアエンジニアにとって少しでも参考になればと思います。

使用する生成AIサービス

本記事では例として無料で利用できるChatGPT(GPT-3.5)を使います。
ただし、会社の業務で使用する際は機密情報の漏洩による問題を起こさないために、会社の規則に従って利用するようご注意ください。もちろん、個人で使う際にも個人情報を入力したりすることは避けるべきです。

ちなみにUbieでは業務利用リスク軽減と利便性拡張の観点から以下の記事にあるとおり内製ツールを作成し、運用しています。
https://note.com/sys1yagi/n/n6b7425df175f
なんか気づいたらどんどん便利な機能が増えててすごいです。

コンテンツデータを生成する

仮説検証するために、プロダクトによってはコンテンツのデータを作成をしなければならないことがあると思います。例えば国内旅行サービスを作成していて、各都道府県の基本データをコンテンツとして表示したい、みたいなことがあるかもしれません。こうした一般に広く知られる情報でコンテンツをとりあえずサクッと作成する場合はChatGPTを利用するととても楽です。

出力文字数の制限も加味してとりあえず東北地方の情報を出してもらいます。

こんな感じで東北地方の6県について教えてくれました。かなりこちらの意図を汲んでくれてていい感じですね。
ただ、見ての通りこのまま情報を使うことはできません。例えば青森県の有名な食べ物として「ねぶた」が含まれています。これらの情報の正しさについては適切なレビューが必要となります。
とはいえ、使えそうな情報も多いので、仮説検証用の間に合わせコンテンツレベルであればイチから自ら調べて書くよりもレビューと書き換えで済む分、作業はだいぶ軽くなります。体感としてはGPT-4を使うとより正確な情報を得ることができるので、可能であればGPT-4を使うことでさらなる工数削減を期待できるでしょう。

さて、上の画像の出力、ちょっとデータとして扱いづらいですね。
例えばCSV形式に指定して出力してもらうと他の人にレビューしてもらったり後工程で利用するのに便利です。

データを整形する

ユーザーに体験を当てて反応を見るような仮説検証段階だと、とりあえずフロントエンドにデータをハードコードする場面も少なくないと思います。ユーザーにとってその体験が良いか否かを短期間で見るのが目的なのに、明日には爆破するかもしれないデータベースのテーブルを設計したり、バックエンドのAPIを作成して丁寧に進めている暇はありません。

ハードコードするために先程作成したデータをTypeScriptで定義した型のオブジェクトに変換してみましょう。

私の指示が悪く、 Prefecture と名付けた型の範囲がおかしい感じはありますが、得たいものは得られました。勝手に型の定義をしてくれてそれを元に prefectures というオブジェクトを作成してくれています。すごすぎる…

この作業、以前はスプレッドシート上に関数を作成して、各セルの文字列繋いでオブジェクト構造にするとか、もしくはCSVを読み込ませてフォーマットに合ったデータを吐き出すスクリプトを書いたりしていたんですが、今ではChatGPTがこっちの意図を汲んで勝手にやってくれます。もちろん出力文字数に制限があるので、大量のデータに対してこれをやるのは難しいでしょう。そういうときは「TypeSctiptの型に合わせてセルデータをいい感じにするスプレッドシート関数を作成して」とか指示を出してあげると出来る気がします。

フォーマット用の関数を作る必要が無くなったのは本当に革命的です。

UIを実装する

フロントエンドのデザイン実装はアイデアを実現するために、しばしば手癖でできる範囲から逸脱する必要があったりします。例えば私は横スクロールコンポーネントの作り方とかよくわかりません。
こういうとき、以前はネット検索して誰かが書いたTipsブログなどを見つつ実装していました。もちろんそれで解決できるのですが、それらの情報には余分な贅肉的な情報が含まれていたり、逆に情報の欠損があったりして、自分が解きたい課題へのピンポイントでの回答を得られることは少ないです。結果として情報の取捨選択、十分な情報の獲得に時間がかかってしまいます。

ChatGPTはこういう実装の困りごとにピンポイントでいい感じに回答してくれます。

回答長いので省略していますが、CSSの実装方法なども詳細にサンプルコードとともに説明してくれています。サンプルコードをコピペしたら概ね想定どおりに動きます。
今では実装に困ったらネットで検索する前にすぐChatGPTに相談するようになりました。確実に検索力とか実装力とか下がってます。どうもありがとうございます。

ログデータで体験を評価する

そうこうして実装し、ユーザーに当てたプロダクトは体験内での行動ログやユーザーからのフィードバックを元に評価したくなるでしょう。その際にもChatGPTは非常に役に立ちます。

例えばBigQueryに溜めたログデータからNPSの計測をしたくなったら?

もはや私がクエリを書くことは無くなりました。

さいごに

新規Webプロダクトの開発において調査やデータ整形、UI実装、ログを元にした評価まで、あらゆる場面で効率化を図ることができる例を紹介しましたが、紹介した生成AIの活用方法はほんの一部過ぎません。他にも様々な場面で私は生成AIのお世話になっています。仮説検証を進める上で重要だけど地道だった作業は生成AIにどんどん任せ、もっと本質的なことに時間を使えるようにしていければと思います。

Ubie テックブログ

Discussion