Embed Size (px)
DESCRIPTION
DevLOVE HangarFlight -Snow Barrageでのプレゼンテーション資料です
Citation preview
ユーザーストーリーという地図を携えて
マーケットという大空を飛ぶために
Yoshinori Wakizaka | 10th Dec 2011 at DevLOVE HangarFlight - Snow Barrage -
11年12月11日日曜日
yoshinori wakizaka@wackiesrock
経歴Experiences
2002.4 - 2008.7（株）東芝・User Researcher・UI Designer
2008.8 - 2010.3ノキアジャパン（株）・Usability Engineer
2010.04 - 2011.12楽天（株）・Usability Specialist・Project Manager
Project Manager, Mobile/ SmartphoneYoshinori Wakizaka
Work experience
11年12月11日日曜日
Work experience
• UIデザイナー
• ユーザーリサーチャー
• HCDスペシャリスト
• ユーザビリティエンジニア
• サービスディレクター
11年12月11日日曜日
ストーリーでより良いUXを設計する•ユーザーの利用コンテクストを理解する
•デザインのアイディアを創造する
•サービスやソフトウェアのクオリティを改善する
Key message
11年12月11日日曜日
Background
11年12月11日日曜日
•様々なデバイスでインターネットを利用これまで：デバイス主導の時代
11年12月11日日曜日
PC DigitalCameraMobile
Mobile
Messaging
Sync Sync
Access
デバイスは単独で世界を形成
Internet
Web
11年12月11日日曜日
これから：サービス主導の時代
11年12月11日日曜日
PCDigitalCameraMobile
Sync
Access
Sync
Internet
Search, Share, SNS, Storage
Access Access
サービスプラットフォームが中心に
11年12月11日日曜日
•サービスのマルチデバイス対応•プロダクトからプラットフォームへ（主従関係の逆転）•サービスを使うためのデバイス
マルチデバイス化
11年12月11日日曜日
デバイスへの最適化
11年12月11日日曜日
Unbox the digital camera to take picture
UnboxSetting Shooting
picture
Start Start
Shooting
パッケージデザイン ドキュメンテーション
ハードウェアデザイン ソフトウェアデザイン
User experience
ユーザーエクスペリエンスのフロー
11年12月11日日曜日
店舗での購入経験
Webでの購入経験
開梱、セットアップ 製品利用
サービス利用経験
Web/アプリ利用経験
物語の中での利用経験MIX
Story for customer experience•製品だけで完結しないユーザー経験•アプリの購入/インストール•サービスの利用を通じた長期的な利用経験
11年12月11日日曜日
TV Everywhere – Thoughts on designing for multiple devices
http://sherylyulin.com
利用コンテクストの多様化
11年12月11日日曜日
•ストーリーについて
•ストーリーのつくり方、使い方
Agenda
Try to draw a big picture about Story
Crafting a story, telling the story
11年12月11日日曜日
Drawing a big picture about Story
ストーリーについて
11年12月11日日曜日
ストーリーとは？
11年12月11日日曜日
時間軸に沿った出来事の流れ
Event
Context Event
Event
Context
Context
Emotion
ストーリーとは？
11年12月11日日曜日
11年12月11日日曜日
Event Event Event Event
シナリオ：連続した出来事を説明するもの
Event
プロット： キャラクターに起こった出来事の筋立て
Event Event Event
アネクドート（逸話）： 個人的な体験を表す出来事
Event Event Event
11年12月11日日曜日
11年12月11日日曜日
Event Context Event Event
ナラティブ： 個人的な経験に関する物語
Context Emotion
ストーリー：最も広義の意味で使われるストーリー
Event
Context Event
Event
Context
Context
Emotion
ジャーニー：個人的な感情の変化を含めた流れ
Event EventEmotion Emotion
11年12月11日日曜日
プロファイル デモグラフィックデータ＋コンテクスト
キャラクターをストーリーに組み込む
11年12月11日日曜日
キャラクター ペルソナ＋内面的な心の動き＆行動
ペルソナ エモーショナルなゴール＋UXの全体像
プロファイル デモグラフィックデータ＋コンテクスト
キャラクターをストーリーに組み込む
11年12月11日日曜日
キャラクター ペルソナ＋内面的な心の動き＆行動
ペルソナ エモーショナルなゴール＋UXの全体像
プロファイル デモグラフィックデータ＋コンテクスト
Event
Context Event
Event
Context
Context
Emotion
キャラクターをストーリーに組み込む
11年12月11日日曜日
Concrete, Rich
EventEvent
Event Event
ストーリーシナリオRichConcrete
Concrete(シナリオ)情報を切り出して再利用しやすい形に纏める
Rich(ストーリー)リッチコンテクスト、エンゲージメント
11年12月11日日曜日
Event
Context Event
Event
Context
Context
Emotion
•UXストーリー：リッチな要素により理解を深める
Event Event Event Event
•タスクシナリオ：タスク手順を可視化して設計に応用
Scenario & Story
11年12月11日日曜日
User Story Mapping
11年12月11日日曜日
Experience journey map献立 買い物 調理 食事 片付け 献立
Experience Journey Map ~Cooking~
日付：2011.3.24重さ：300g
ETCレジ
￥￥￥
スーパー XX
トマトモン＊能力：リコピン爆弾＊体力 ：15 日
ミルク
今日の晩御飯は何にしようかしら？
今日は カレー、肉じゃが、豚肉の生姜焼きが、おすすめです。
＊冷蔵庫の中身＊賞味期限＊スーパーのセール情報＊旬の食材＊家族の健康状態
などから、メニューをレコメンド。あらかじめ 家族構成、好き嫌い、アレルギー などの情報を入力。
カレーとサラダにしましょう。
メニューを選ぶと、必要な食材が買い物リストに追加。
買い物リストがモンスターの捕獲リストととして表示。
スマート冷蔵庫
冷蔵庫アプリ
食べモン（アプリ）
スマート計りゆっくり買い物ができるわ。
よーし、モンスターつかまえるぞー！
トマトモン見つけた！
スマートフォンをかざすと、食材がモンスターに見える。 モンスターのステータスは、栄養素や賞味期限と対応。
トマト苦手だけど、モンスターつかまえたいからゲットしよう！
レジ ETCを通ると、自動的にカード決済され、購入した食材リストのデータは自宅の冷蔵庫に転送。
あら、便利！！
モンスター集めて強くなるぞ！
あれ？カレーのルーはどこかしら？
ルーはどこ？
カレールー は、棚の２段目左奥にあります。
冷蔵庫や棚など、キッチン周りにある食材や調味料の場所をサイネージにマッピング。 音声認識によって通知。
お母さん、最近ツナ缶モンの元気がないよ。
あら、そうなの？ じゃあ、ツナ缶モンもトマトサラダに入れてあげましょうか。
食材の賞味期限が近付くと、モンスターが弱ってくる
ツナサラダモンって、すごく強いんだよ。
ツナと玉ねぎは食べ合わせの相性がいいからね～♪最近のゲームは
すごいなー！
食材と食材が融合し料理モンスターとなる。相性の良い食材を合わせると強いモンスターができるので子供の食育にはもってこいのアプリ。
余ったものは、はかりに乗せるだけね。
はかりに料理や食材を乗せると、日付や分量などの情報がシールとなって出てくる。もちろん、冷蔵庫にもデータが転送される。また、シールにはICチップが埋め込まれ、調味料などに貼れば、位置情報なども発信され冷蔵庫に入っていない物でも管理が可能。
タカシ くんは、カルシウム が不足しています。
大変！ 牛乳！牛乳！
『食べモンスター』のアバター情報（アバター＝子どもの分身）が冷蔵庫に表示され、母親は子どもの健康状態が一目で分かる。
昨日の摂取カロリー1525kcal
はい、今日からちゃんと牛乳を飲みましょうね。
はーい !!
＊にんじん＊だいこん＊じゃがいも＊たまねぎ
＊
＊
まき子の特製カレー
慶応大学 武山研究室 Experience journey lab http://experience-journey-lab.com/theme01/journeymap_zukuri/
11年12月11日日曜日
How to create stories?
ストーリーのつくり方
11年12月11日日曜日
利用の状況の把握と明示
システムが特定のユーザ及び組織の要求事項を満たす
設計による解決策の作成
ユーザと組織の要求事項の明示
要求事項に対する設計の評価
人間中心設計の必要性の特定
11年12月11日日曜日
利用の状況の把握と明示
システムが特定のユーザ及び組織の要求事項を満たす
設計による解決策の作成
ユーザと組織の要求事項の明示
要求事項に対する設計の評価
人間中心設計の必要性の特定
ストーリーを選ぶ
ストーリーを作るUXチーム
分類してまとめたストーリー
ストーリー ストーリー
ストーリー ストーリー
ストーリーを使うUXチーム
ストーリー
デザインアイデア
ストーリーを集める
UXの担当者 ユーザビリティ調査の参加者
そして私は…テストシナリオとしてのストーリー
11年12月11日日曜日
利用の状況の把握と明示
システムが特定のユーザ及び組織の要求事項を満たす
設計による解決策の作成
ユーザと組織の要求事項の明示
要求事項に対する設計の評価
人間中心設計の必要性の特定
ストーリーを選ぶ
ストーリーを作るUXチーム
分類してまとめたストーリー
ストーリー ストーリー
ストーリー ストーリー
ストーリーを使うUXチーム
ストーリー
デザインアイデア
ストーリーを集める
UXの担当者 ユーザビリティ調査の参加者
そして私は…テストシナリオとしてのストーリー
・ユーザーリサーチ・フィールドワーク・エスノグラフィ・文脈的質問法・インタビュー
・カードソーティング・親和図法・KJ法・ペルソナ
・シナリオ・ストーリーボード・ワイヤーフレーム・プロトタイピング
・ウォークスルー・ユーザビリティテスト・分析
11年12月11日日曜日
ストーリーを集める11年12月11日日曜日
• サーチログ• サーバログ• オンラインフォーラム / コミュニテイ• カスタマーサービスの記録• トレーニングとセールスデモの記録• マーケティング部門 / 顧客満足度調査• ユーザビリティ調査ログ
ストーリーを集める方法
• ヒアリング - ユーザー - ビジネスステークホルダー - 同僚• 観察
ログをみる 聞く、観察する
11年12月11日日曜日
定性的データ• オンラインフォーラム / コミュニテイ• カスタマーサービスの記録• トレーニングとセールスデモの記録• マーケティング部門 / 顧客満足度調査• ユーザビリティ調査ログ
定量的データ• サーバログ• サーチログ
ログをみる
11年12月11日日曜日
聞く、観察する
よい聞き手になる• アクティブリスニング
観察する• 「当たり前」は話さない• 「無意識」の行動は話せない
11年12月11日日曜日
アクティブリスニング
•関心を向ける、受け入れる•確かめたいフレーズを復唱する•相手の意図について振り返る•相手の言いたいことを解釈する•気持ちや経験を要約する、統合する•思いや共感をフィードバックする•相手の言うことを支持する•知覚したものが妥当かどうか確かめる•黙っている：考える時間を与える
11年12月11日日曜日
インタビューの構成1. あなたが話したい活動についての話題を築く質問から始める。
「○○をしたことがありますか？」質問はオープンクエスチョン（「はい」「いいえ」で答えられる質問）から始める。
2. テーマが相手にどれだけあてはまっているのかを質問する。
「○○はよくどのようにしますか？」「なぜ○○しようと決めたのですか？」「会社や家でいつもすることを教えてください。」この質問への標準的な回答を示唆してもよい。
3. 特定の事例について考えてもらう。
「最近○○をしたのはいつですか？」4. 特定の出来事が頭に浮かんだら、その状況を繰り返して、正しく理解する。
「そのことについて教えてください。」11年12月11日日曜日
ストーリーを選ぶ11年12月11日日曜日
いいストーリーを選択する
Event
Event
Log
Log
Logデモグラフィックス・２０代中盤・どこかの大学生・自宅でウェブを利用している・造園家として働いている
P5 - ジミー
・私はただ、これを自分のホームページとして使います。何故ならウェブでサイン アップした時に、そのページが表示されるからです。・ストーリー：彼の妹は、インターネットで誤って自分が欲しいものとは別のものを 買ってしまった。この注文をキャンセルしようとしたが、それはできなかった。彼 らは彼女の返品を受け付けようとはしなかった。そこで彼女は、最終的にその商 品の代金をクレジットカードで支払った。それは、さほど高い買い物ではなかっ たが、家族は皆、この悲惨な物語を彼女から聞かされている。そして長い間、彼 をオンラインから遠ざけている。・試合結果を控えておくのに、ESPNを使っている。友達は、携帯電話にスコアを 送るのに”何か”を使っていて、ジミーもそれを使いたいと思っている。・Youtubeが大好きで、友達と”おばかな”ビデオをたくさん見ている。
お気に入りのページ：ISP（ホームページ）ヤフーESPNTravelocity and ExpediaYouTubeWebMDSportsAuthority
ニーズ：慣れ親しんだサイトでする様に”失敗すること”を恐れないようにしたい
コメント、引用、ストーリー
安心してオンラインバンキングを利用することはできないが、オンラインショップで買い物をするだろう。スポーツの試合結果をみるためにウェブを利用する。ホテルをオンラインで予約したことがある。新しいことはウェブで検索して調べる。
素材 選択 ストーリーボード
ペルソナ
UXストーリー
11年12月11日日曜日
Juicyなストーリーとは？
•複数の人から聞いたストーリー•詳しい行動を述べたストーリー•ユーザーを理解しやすくするストーリー•UXチームの興味を惹くストーリー
•意見を覆すが、説得力のあるストーリー
11年12月11日日曜日
デモグラフィックス・２０代中盤・どこかの大学生・自宅でウェブを利用している・造園家として働いている
P5 - ジミー
・私はただ、これを自分のホームページとして使います。何故ならウェブでサイン アップした時に、そのページが表示されるからです。・ストーリー：彼の妹は、インターネットで誤って自分が欲しいものとは別のものを 買ってしまった。この注文をキャンセルしようとしたが、それはできなかった。彼 らは彼女の返品を受け付けようとはしなかった。そこで彼女は、最終的にその商 品の代金をクレジットカードで支払った。それは、さほど高い買い物ではなかっ たが、家族は皆、この悲惨な物語を彼女から聞かされている。そして長い間、彼 をオンラインから遠ざけている。・試合結果を控えておくのに、ESPNを使っている。友達は、携帯電話にスコアを 送るのに”何か”を使っていて、ジミーもそれを使いたいと思っている。・Youtubeが大好きで、友達と”おばかな”ビデオをたくさん見ている。
お気に入りのページ：ISP（ホームページ）ヤフーESPNTravelocity and ExpediaYouTubeWebMDSportsAuthority
ニーズ：慣れ親しんだサイトでする様に”失敗すること”を恐れないようにしたい
コメント、引用、ストーリー
安心してオンラインバンキングを利用することはできないが、オンラインショップで買い物をするだろう。スポーツの試合結果をみるためにウェブを利用する。ホテルをオンラインで予約したことがある。新しいことはウェブで検索して調べる。
ペルソナカード
11年12月11日日曜日
ストーリーを作る11年12月11日日曜日
構造×要素
構造
要素 Context Image
視点 コンテクスト キャラクター 心的イメージ 言葉遣い
11年12月11日日曜日
構造×要素
構造 Context
ImageContext Context
Image
ImageImage
11年12月11日日曜日
ストーリーの構造
•規範的構造：穴埋めで作るストーリー
•英雄的構造：英雄が旅に出て帰ってくる構造
•新しいものに親しむ：次第に新しいトピックを混ぜる
•フレーム化：始まりと終わりが似ている構造
•階層化：ユーザーエクスペリエンスを階層的に構成
11年12月11日日曜日
日常の世界
冒険の世界
冒険へのきっかけ
はじまりと試練
日常世界への帰還
目的の達成
世界の境界線
英雄的構造
ストーリーの構造•構造（パタン）を使ってユーザーストーリーをつくる
11年12月11日日曜日
バスを待つ（英雄的構造）［アクションへの呼びかけ］氷雪の中で作業させられることほど気の滅入るものはありません。公共の交通機関を使うときは特にそうです。［拒絶］サンドラは毛布を頭までかぶって、病欠の電話をしようかどうかを考えていました。自分がどれだけ雪を好きじゃないかを考えながら、ラジオの広告を聞いていたのです。何十回も聞いたことがある広告でしたが、ちゃんと聞いたのはこれが初めてでした。 ［超自然的な］「RideFindがあれば」、「バスが今どこにいるのか、二度と考える必要はないでしょう。」と、広告は説明していました。［冒険を受け入れる］「そうよ」、彼女は思った。「これを試す時がきたんだわ。」 ［儀式と試練］一時間後、彼女は起き上がり、着替えて出発の準備をしました。［試練］外に出ると、彼女の家の玄関の両側に雪がかき分けられ、山のように積上っていました。 ［試練］歩道を歩いていると、地面が凍っているせいで滑って転んでしまいました。彼女は地面に尻餅をつきながら、玄関を物欲しそうに眺めて思いました。今なら無事に家に帰って、病欠の電話ができるのです。［試練］彼女は立ち直りながら、1台のバスがゆっくりと通り過ぎて行くのを見ました。彼女が乗る路線のバスでしょうか？それとも違うバスでしょうか？これは、RideFindの番号を試すのにちょうどよいタイミングに思えました。［試練］彼女はバス停の標識があるポールの前に滑り込み、標識から雪を払って、ラジオ広告が言う通りに停留所の番号を見つけました。 ［目標の達成］そこで彼女は携帯を取り出しました。そして、手袋を外しました。番号を打って…返事が来るのを待ちます。この時もしバスが15分以上来なかったら、引き返して家に帰っていたでしょう。数秒後、さっそく返信が来ました。［帰還（暗黙的）］バスはあと10分で到着するそうです。 ［知識を利用する］彼女が待っている間に他にも人が来たので、サンドラはよい知らせを教えてあげました。［解決］その朝、二人とも無事仕事に間に合いました。
11年12月11日日曜日
•視点：ストーリーが語られる視点
•コンテクスト：環境、いつ？どこで？
•キャラクター：どんな人が？
•心的イメージ：ストーリーが喚起する視覚的イメージ
•言葉遣い：キャラクターの言葉遣い、話のスタイル
ストーリーの要素
11年12月11日日曜日
コンテクストの種類
•物理的コンテクスト - 時刻、月/時期、物理的な場所、場所の広さ、大きさ
•情緒的コンテクスト - キャラクターの心の動き、嬉しい、悲しいなど
•知覚的コンテクスト - 臭い、味、音、質感
•歴史的コンテクスト - 歴史的な背景；携帯電話の無かった頃は～
•記憶コンテクスト - 過去への個人的な結びつき
11年12月11日日曜日
心的イメージ•オーディエンスが想像する視覚的なイメージのこと
ロボットの研究開発を行っているiRobot社は、自社のウェブサイトでPackBotという自社製品のビジョンストーリーを伝えています。PackBotは小さなタンク型のロボットで、人間が立ち入るには危険な場所で活動するために設計されています。全て遠隔操作で、写真を送ったり単純な機械的作業を行うことができます。PackBotの機構は複雑で、大勢のエンジニアが長い年月をかけて開発しました。特に機構設計では、いつもの挑戦と挫折がありました。 PackBotが活躍する場所の一つに、不発弾の危険が残る戦争地域があります。そこでは、PackBot Scooby-Dooと名付けられた兵団がたくさんの不発弾を探索しました。彼らはその義務を立派に果たした後、現在iRobotの本社で展示されています。彼らは自分が見つけた爆弾によって破壊されました。しかし兵士たちは何一つ置き去りにせず、彼らの全ての破片を入念に集めて持ち帰ってきたのです。 Scooby-Dooは現在、粉々の状態で会社のロビーに展示されています。この展示は、もしロボットの代わりに人間が被害に遭っていたらどうなっていたのかを想像させてくれます。技術的な挑戦や避けがたい挫折に対処する中でiRobotの従業員がしていることは、突き詰めると人の命を救うことになるです。Scooby-Dooは、毎日ビルに入る度にこのことを思い出させてくれます。
11年12月11日日曜日
心的イメージを加える
［イメージ要素なし］・5時。彼女はレポートに取り組んでいた。
［物理的コンテクストを追加］・一日が終ろうとしていた。彼女のオフィスの壁は、今朝行ったブレインストーミングの要点を説明したポストイットで覆われていた。レポートはうまく進んでいた。
［物理的＋情緒的コンテクストを追加］・もうどれぐらい時間が経ったのか彼女には分からなかったが、オフィスは静かだった。オフィスの壁は今朝行ったブレインストーミングの要点を説明したポストイットで覆われていた。机の上にはプリントの山が積み重なっていた。半分かじりかけのサンドイッチがデスクの端においてあり、長い間忘れ去られている。そこで聞こえるのは、彼女の指がキーボードの上をカチカチと走る音だけだった。
11年12月11日日曜日
Storytelling Workshop @webUX研究会
•”読書体験”をお題にして、ストーリーを作成•アクティブリスニングによりアネクドートを抽出•階層構造を使って”読書体験”のバリューを表現
•ターゲットオーディエンスにストーリーを語る
11年12月11日日曜日
Findings from the Workshop
成果
•要素の抽出とストーリーへの反映はうまくいった•個人の経験に基づいた話には、感情移入できる•コンテクストやディテールをリッチにすることができた
課題
•ゴールや視点を規定しないとナラティブになりがち•ストーリーの客観性を担保する意識づけが必要•ストーリーの妥当性を評価するステップが必要
11年12月11日日曜日
ストーリーを使う11年12月11日日曜日
•ターゲットオーディエンスの理解を得る - オーディエンスについて理解する• ストーリーはオーディエンスの言葉で語ること• オーディエンスの興味のポイントからそれないこと• ターゲットオーディエンスの視点から語ること
- ミラーストーリーにならないよう気をつける• ミラーストーリー（自分自身のストーリー≒ナラティブ）にならないようにする• 何人かの視点を入れる、客観性を担保する• オーディエンスをストーリーに取り込んでしまう
ストーリーで共感を得る
11年12月11日日曜日
ストーリーで評価する
•ストーリーがユーザ評価のシナリオになる - ユーザビリティ評価のタスクシナリオに活用する• ストーリーはユーザビリティ評価のタスクに使うことができる• 実際の利用コンテクストに沿ったユーザビリティ評価が可能になる• 評価結果をストーリーに反映することで、ストーリーをブラッシュアップ
- デザインレビューにストーリーを活用する• ストーリーを元にシステムをウォークスルーすることで、評価の精度があがる• ユーザーの視点で評価対象を見ることができる• ストーリーも同時に評価することができる
11年12月11日日曜日
デザインのアイディアを生む
•ストーリーを利用して新しいデザインを生み出す - ストーリーからはじまるブレインストーミング• ブレインストーミングゲーム：穴埋め形式で新しいストーリーをつくる• アイディアの発散：テンプレをもとにストーリーを出してアイディアを量産する• アイディアの深堀：一つのストーリーを選んでディテールを検討する
- デザインのアイディアをストーリーでわかりやすく伝える• 規範的なストーリー：仕様やシナリオの詳細を補足する• アイディアを始めて聞く人にもわかりやすく伝えることができる• 技術仕様をユーザーエクスペリエンスをベースにわかりやすく伝えることができる
11年12月11日日曜日
ストーリーを開発に活用する
Event Event Event
User Story User Story User Story User Story
Event
Context Event
Event
Context
Context
UIの設計
利用コンテクストの理解11年12月11日日曜日
UXストーリーの使い分け
•利用コンテクストの理解•コンセプトの共有•創造のための触媒
•要件の洗い出し•タスクの可視化•重要度の整理
EventEvent
Event Event
ストーリーシナリオRichConcrete
11年12月11日日曜日
まとめより良いUXを設計するために•ストーリーには２つの使い道がある
•UXストーリー：理解、エンゲージメント
•シナリオ：可視化、設計
•目的に応じた構造（パタン）がある
•オーディエンスのことを考慮して話す
11年12月11日日曜日
ユーザーエクスペリエンスのためのストーリーテリングよりよいデザインを生み出すストーリーの作り方と伝え方
Twitter @story4uxFacebook page: Story4UXWhitney Quesenbery & Kevin Brooks [著]UX TOKYO [訳][出版社] 丸善出版[原著出版社] Rosenfeld Media
UX TOKYOとは？グローバルなUX関連読書会ムーブメント「UXBC」の東京支部を前身とするUX実務家向けの勉強会・ネットワーキングを目的としたコミュニティ。
Our website http://uxtokyo.org Twitter @uxtokyo
Rosenfeldmedia Blog & book sitewww.rosenfeldmedia.com/books/storytelling/Illustrations available under Creative Commonswww.flickr.com/photos/rosenfeldmedia/
Appendix: reference book & contacts
11年12月11日日曜日
