COSTA流！PO業務におけるAI活用術

こんにちは！

Co-Creation Startup Team（COSTA）でPOリード兼エンジニアとして活動している長田です。

今回はプロダクトオーナー（PO）業務におけるAI活用術をご紹介します！

初めに

プロダクトオーナーって、ユーザーのニーズを拾ってプロダクトバックログにまとめれば終わり…と思われがちですが、実はここにめちゃくちゃ時間を使うんですよね。言葉だけじゃ伝わらないし、イメージ違いも起きやすい。

そこで今回は、ニーズをサッと形にして、開発者にも視覚的に伝えやすくするための「プロトタイプ作成」について、気軽に紹介していきます。

なぜプロトタイプの作成が必要なのか？

PO の役割は「価値を最大化するために何を作るかを決めること」。
その判断の多くは、ユーザーやステークホルダーが持つ 抽象的なニーズ と向き合うところから始まります。

しかし文章だけで、「こんな画面」「この動き」と説明しても、必ずどこかで齟齬が発生します。
そこで力を発揮するのが プロトタイプ です。

• 視覚的に伝わりやすい
• 認識のずれが減る
• PBIの粒度が揃いやすい
• ステークホルダーとの合意形成が早い

と、POにとってはメリットだらけ。

抽象的なアイデアを、まずは“イメージできる形”に落とし込むだけで、議論の進み方がまったく違います。

AIを活用したプロトタイプ作成

プロトタイプ作成には、bolt.newやLobable、base44など様々なツールがありますが、今回はStitchを活用します。
Stitch は、PO のような“非デザイナー・非エンジニア”でも使いやすいWeb/モバイルのUIデザインをAIが自動生成してくれるツールです。

特徴は以下の通り：

• 直感的に操作できる
• 超高速で画面が生成される(30秒~1分)
• 共有して開発者・関係者にすぐ見せられる

今回は例として、ホテル予約サイトのプロトタイプを作ってみたいと思います！

STEP1:初回画面作成

まずはメインとなる 「ホテル一覧画面」 の作成を Stitch に依頼します。
プロンプトを送るだけで、ほんの数十秒で画面が生成されます。

STEP2:画面の微修正

続いて、AI が生成した画面で気になる部分を少し修正してみます。

Stitch のメニューから 「Edit > Annotate」 を選択し、修正したい箇所をクリック。
あとは表示される吹き出しに「変更内容」を入力するだけで、AI が修正版を生成してくれます。

STEP3:成果物の共有

Stitch で作成したプロトタイプは、以下の方法で簡単に共有できます。

• 画像ファイルとしてダウンロード
• HTML ファイルとしてダウンロード（遷移・操作がそのまま体験できる）
• URL をパブリック公開して共有（便利だが、公開範囲には注意）

特におすすめなのが HTML 形式でのダウンロード です。
理由はシンプルで、

• 開発者が「どんな動きをするのか」を実際に触って確認できる
• 必要であれば、そのまま HTML として取り込んで活用できる
• PBI に添付しておくと、実装時の理解がめちゃくちゃスムーズになる

と、メリットが多いからです。

文章だけでは伝わりづらい部分も、HTML のプロトタイプを添えておくだけで一気にクリアに。
認識齟齬の防止にも役立ちますし、「これそのまま使えそう！」と開発スピードが上がるケースもあるので、まさに 一石二鳥の使い方 といえます。

まとめ

プロトタイプ作成というと、PO が一人でコツコツ作るイメージを持たれがちですが、実は チーム全体の会議体の中で活用することこそ最大の効果を発揮します。
その場で「こんな画面？」「この動き？」と意見が出た瞬間に、AI を使って数十秒で形にする。
この “即座に可視化するプロセス” が、認識の齟齬を最小にし、リードタイムを劇的に短くしてくれます。

PO 一人で抱え込むのではなく、会議の中で皆で見ながら、皆で具体化していく。
AI のおかげで「その場で形にする」が当たり前になり、プロダクトづくりの質もスピードも大きく向上します。