発表日：2016年2月4日 イベント名：ITフォーラム2016 協働プロジェクト『空気を読む家』 イベントURL：http://www.ipsj.or.jp/event/sj/sj2016/IT-F_AITC.html タイトル：マンガ駆動開発によるデザインプロセス：協働プロジェクトのためのシナリオ設計 概要：「マンガ駆動開発」を用いて『空気を読む家』におけるユーザー体験をデザインしました。そのデザインプロセスと成果についてご説明します。 発表者：原　孝治

1. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved. 1

2. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
2016年2月3日
先端IT活用推進コンソーシアム
UX技術部会 リーダー
原 孝治
人工知能のための
マンガ駆動開発

3. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
自己紹介
原 孝治
AITC UX技術部会リーダー
AITC 運営委員
https://www.facebook.com/harakoji.net

4. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
マンガ駆動
開発とは
4

5. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
ユーザー
エクスペ
リエンス
大切
5

6. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
UXを
デザインする
6

7. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
フレームワークとか
プロセスとか
7

8. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved. 8
UXっぽいもの
ペルソナ
エンパシーマップ
カスタマージャーニーマップ
ロケハン
ユーザーモデリング
ステークホルダマップ
ビジネスモデルキャンバス
課題、アイデアの
グルーピング
シナリオ
ストーリーボード
アクティングアウト
スキッド
寸劇
アイデアソンぽいもの
フィールドワーク
単語をかけあわせた
アイデア発散
マンダラートでの
アイデア発散
ブレインライティング
ペルソナ像作成
カスタマージャニーマップ
現状問題分析ツリー作成
未来マップ
クロス分析での
戦略・戦術創出シート
戦略マップ
リーンキャンパス
マーケティングぽいもの
AIDA
AISAS
PESTe
3C
5F
PLC
KSF
SWOT
あるべき姿/現状
STP
ブランド価値構造
4P
4C
4S
4A
他
MECE
PDCA
CMMI
LOVEM
ビジネスモデルキャンバス
リーンキャンバス
アジャイル開発プロセス
ウォーターフォール
要求定義
要件定義

9. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
一通り
作りました
9

10. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
何を参照して
モノを作るのか
10

11. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
モノを作るときに
立ち戻るべきなのは
何か
11

12. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
リーンキャンバス？
12

13. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
仕様書？
13

14. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
ユーザー経験！
14

15. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
ユーザー経験を
最大限表現出来る手法
15

16. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
マンガ
16

17. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
マンガ駆動開発
MangaDrivenDevelopment
17

18. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
アジェンダ
マンガ駆動開発とは
マンガ駆動開発プロセスについて
簡単に
マンガ駆動開発の「マンガ」について
AIとマンガ駆動開発
18

19. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
マンガ駆動開発
関係者全員が
ユーザー経験を意識し
ながら
プロダクトを開発する
ための、新しい開発プ
ロセスです。
19

20. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
マンガ駆動開発の3つのステップ
９つのフェーズ
20
キャラ取材 分析
プロット ネーム
寸劇 実装 評価
マンガ
キャラ
づくり
シナリオ
づくり
モノ
づくり

21. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
マンガ
21

22. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
マンガが表現するもの
マンガ駆動開発に
おけるマンガは、
こういう要素を表
現しています
22

23. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
背景・利用シーン
ユーザーがどういった状況でシ
ステムを利用するかということ
を表現します。
単に物理的な環境だけでなく、
利用に至ったコンテキストも表
現することが出来ます。
23

24. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
背景・利用シーン
24

25. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
ユーザー
ユーザーの服装、年齢、職業
などを、文章で明示すること
なく表現することが出来ます。
25

26. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
ユーザー
26

27. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
感情・考え
ユーザーの感情、その時の考
えを表現します。
27

28. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
感情・考え
28

29. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
デバイス
デバイスがどういったものな
のかを表現します。
ここでは、ユーザーインター
フェースは表現しません。簡
単な外観で記述します。
29

30. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
デバイス
30

31. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved. 31
マンガ駆動開発のマンガ
背景 利用シーン
考えデバイス ユーザー感情

32. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
AIとマンガ駆動開発
32

33. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
人工知能とUX
33

34. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
ユーザーがAIに
どんな風に考えて欲
しいかを表現する
34

35. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
AI対応マンガ駆動開発
35

36. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
AI対応マンガ駆動開発
36

37. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
まとめ
37
• UXをマンガにすると、豊かな表現が出来
る。
• マンガを使えば、UXをトリガーにして、
開発を駆動することができる。
• 開発手法として3つのステップ、9つの
フェーズにまとめた。
• ついにAIに対応。

38. Copyright © 2016 Advanced IT Consortium to Evaluate, Apply and Drive All Rights Reserved.
http://aitc.jp
https://www.facebook.com/aitc.jp
ハルミン
AITC非公式イメージキャラクター
38