1.0UX TIMEShttps://uxdaystokyo.com/articles菊池 聡https://uxdaystokyo.com/articles/author/satoshi-kikuchi/rich600338<blockquote class="wp-embedded-content" data-secret="xT1I1788pi"><a href="https://uxdaystokyo.com/articles/create-aidriven-project-storyboard-part-2/">ストーリーボードの構成要素と描き方</a></blockquote><iframe sandbox="allow-scripts" security="restricted" src="https://uxdaystokyo.com/articles/create-aidriven-project-storyboard-part-2/embed/#?secret=xT1I1788pi" width="600" height="338" title="“ストーリーボードの構成要素と描き方” — UX TIMES" data-secret="xT1I1788pi" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" class="wp-embedded-content"></iframe><script> /*! This file is auto-generated */ !function(d,l){"use strict";l.querySelector&&d.addEventListener&&"undefined"!=typeof URL&&(d.wp=d.wp||{},d.wp.receiveEmbedMessage||(d.wp.receiveEmbedMessage=function(e){var t=e.data;if((t||t.secret||t.message||t.value)&&!/[^a-zA-Z0-9]/.test(t.secret)){for(var s,r,n,a=l.querySelectorAll('iframe[data-secret="'+t.secret+'"]'),o=l.querySelectorAll('blockquote[data-secret="'+t.secret+'"]'),c=new RegExp("^https?:$","i"),i=0;i<o.length;i++)o[i].style.display="none";for(i=0;i<a.length;i++)s=a[i],e.source===s.contentWindow&&(s.removeAttribute("style"),"height"===t.message?(1e3<(r=parseInt(t.value,10))?r=1e3:~~r<200&&(r=200),s.height=r):"link"===t.message&&(r=new URL(s.getAttribute("src")),n=new URL(t.value),c.test(n.protocol))&&n.host===r.host&&l.activeElement===s&&(d.top.location.href=t.value))}},d.addEventListener("message",d.wp.receiveEmbedMessage,!1),l.addEventListener("DOMContentLoaded",function(){for(var e,t,s=l.querySelectorAll("iframe.wp-embedded-content"),r=0;r<s.length;r++)(t=(e=s[r]).getAttribute("data-secret"))||(t=Math.random().toString(36).substring(2,12),e.src+="#?secret="+t,e.setAttribute("data-secret",t)),e.contentWindow.postMessage({message:"ready",secret:t},"*")},!1)))}(window,document); //# sourceURL=https://uxdaystokyo.com/articles/wp-includes/js/wp-embed.min.js </script> https://uxdaystokyo.com/articles/wp-content/uploads/2025/09/stb2.jpg19201080AI駆動型プロダクトのためのストーリーボード作成 ― 第2回：ストーリーボードの構成要素と描き方 「UX for AI」のグレッグ・ヌーデルマン（Greg Nudelman）氏のブログ記事の翻訳です。原文：https://www.uxforai.com/p/create-aidriven-project-storyboard-part-22024年8月13日 第1回では、AI 主導プロダクトのためのストーリーボードとして、ストーリーボードの重要性と、AI駆動型プロダクトの設計において単なる要件リストよりも優れている理由について説明しました。本記事では、ストーリーボードを構成する要素と、それらを描く際のプラクティスを紹介します。 ストーリーボード作成は、基本的にシンプルであるべきです。しかし、単なる「シンプル」ということではなく、シンプルで且つ、意味のある内容を示さなければその価値は生まれません。 私の4冊目の著書『$1 Prototype』（https://a.co/d/96rMq0R）では、第2章にこのプロセスを解説し、アプリケーションの事例を数多く紹介しました。その内容を簡単に振り帰りながら、AIプロジェクトに最適化に必要な具体的な調整に注目します。 例として、第1回で作成したモバイルアプリ「Mood Ring」の新しいストーリーボードを取り上げましょう。 ストーリーボードの5つの構成要素 一般的なストーリーボードは次の要素で構成されます： 導入カット（Establishing shot） モノ（Things） 人物（People） 表情（Faces） 遷移（Transitions）※次回で解説 結末（Conclusion、別名「決めカット」） 導入カット（Establishing Shot） 導入カットはストーリーボードの最初のスライドです。物語の舞台を設定し、主人公と読者をその環境に引き込みます。 最初のコマには、少し余分に時間をかけるだけの価値があります。もしストーリーボードの描写に行き詰まったら、まずは導入カットに集中して、状況に十分に入り込めるまで時間をかけてください。準備が整ったら自然と次のコマへ進めます。 「MoodRing」のストーリーボードでは、物語は Cafe du Nerd（カフェ・デュ・ナード） から始まります。 モノ（Things） ストーリーボードにおける「モノ」とは、建物、家具、ガジェットなどの無生物を指します。モノを描くのは難しくありません。四角と丸さえ描ければ、人類が知るほとんどすべてのガジェットを表現できます。 ちょっと練習して、コンピュータや電話を描いてみてください。挑戦したい方は自転車を試してみましょう ― 思ったより難しいですよ！ 人物（People） 人物はストーリーボードの中心です。人物と行動によって物語が動き出します。ただし、多くの人にとって人物を描くのは面倒で、専門的にデッサンを学んだ人であっても簡単ではありません。そこでお勧めなのが、棒人間を描く方法です。棒人間は簡単で素早く描け、意味を損なうこともありません。むしろ、読者が物語の中に自分を重ねやすくなります。より凝った人物描写に挑戦したい場合は、ボックス型やヒトデ型を試してみてもよいでしょう。 特に「ヒトデ型」は簡単で楽しく、大きなポスターを使ってライブ描写するスケッチノートアーティストたちに長く愛されてきました。ヒトデ型を描くときは、手をリラックスさせ、大きくのびやかなストロークで線を引き、最後に頭を加えます。少し練習すれば、ビジネスの文脈でも役立つ、さまざまなダイナミックなポーズを描けるようになるでしょう。 最終的にどのスタイルを選ぶかは個人の好みです。装飾は完全にオプションなので、シンプルな棒人間にこだわるのもまったく問題ありません。 表情（Faces） 人物を描いたあとは、「表情」が最も難しい要素のひとつです。Ken Cheng（ケン・チェン）の著書「 See What I Mean」で紹介されているコツは、棒人間の顔に「眉毛」を描き加えることです。 眉毛を加えるだけで、「素晴らしい驚き」と「予期せぬ困惑」、「満足」と「無関心」といった微妙な違いを素早く簡単に区別できるようになります。 結末（Conclusion、いわゆる「決めカット」） 最後の「結末」は最も重要です。結末では、主人公が夢に描いたものが表現されます。また結末は、AIソリューションによって得られる効果を提示する場面でもあります。読者は結末で物語が「一貫しているか」、そして「望む成果が得られそうか」を判断できます。 第１回で紹介した「Mood Ring」アプリの初期版を思い出してください。ステークホルダー役のクラスのメンバーは、結末に描かれた「気分が良くなった」という結果がストーリー全体から自然に導かれていないです。 一方、下記の改訂版の「MoodRing」では、コーヒーショップでの何気ない会話から男女が恋愛的なつながりを見つけるという展開になっており、西洋的な物語構造 ― 異性愛カップルが自然に惹かれ合う筋立て ― に適合していました。 ただし、こうした「なじみ深いシナリオ」も、他の文化圏の人々には異質に映ることがあります。ユヴァル・ノア・ハラリの著書 サピエンス全史（amazon）でもその点が指摘されています。ストーリーボードを作成する際には、対象とする文化や人々を必ず考慮してください。（関連記事：「AIにおけるWMD（白人男性デフォルト）バイアス」https://www.uxforai.com/p/wmd-white-male-default-bias-ai） 結末における「自然な盛り上げ」 結末パネルに「自然な盛り上げ」の重要性を示す例として、オンライン請求支払いサービスのストーリーボードを紹介します。 当時のプロダクトマネージャーは、主人公が「計り知れない喜びに満ちて軽やかにステップを踏む踊りを楽しむ」姿を結末に入れるよう強く主張しました。 私はその結末に反対し、「請求支払いが楽になったことで満足し、今は犬と外でフリスビーを楽しむ時間がある」方が現実的だと伝えました。チームの他のメンバーも賛同し、最終的な広告では、主人公がパソコンに向かって笑顔でうなずき、その後外で犬とフリスビーをしている場面が採用されました。 このように、ストーリーボードはあくまで今後の構想を表したり、人の心や現実的な心理を表すことが重要です。あまりにも現実とかけ離れた内容や空想ではストーリーボードの価値を得ることができません。 まとめ 結末パネルでは、「報酬の大きさ」を現実的に見せることに注力してください。重要なのは感情を描き出し、読者にソリューションがどれだけの価値を生み出すのかを解釈させることです。 そうすれば、ストーリーボードはステークホルダーとの議論やユーザーリサーチの出発点として最適になり、時にはマーケティングや営業資料としても活用できるのです。 ＞AI駆動型プロダクトのためのストーリーボード作成 ― 第3回に続く