AIによってUXデザインは変わるのか!?
2024年7月26日(金)
1
Twitterの
ハッシュタグは
#CR社
画面キャプチャ
投稿OK!
代表取締役CEO / HCD-Net認定 人間中心設計専門家
配信のチャットで
いっしょに
盛りあがってね
CREATIVE VILLAGE セミナー 「AIとUXデザイン」 Vol.1
羽山 祥樹 @storywriter
「チャット」で盛りあがろう!
2
チャット
チャットへ
どんどん書いてね!
(Twitter感覚で)
「全員」
で送信!
Q&Aに
投稿したものは
質疑応答で
答えます
Q&A
「チャット」で盛りあがろう!
3
さいしょに「チャットに投稿する練習」をしています!
今回はどうしようかなと思いまして・・・
暑い日が続きますね・・・
4
引用: ふたりの愛ランド - 石川優子とチャゲ
夏
夏
ナ
ツ
ナ
ツ
コ
コ
夏
愛
愛
ア
イ
ア
イ
愛
ラ
ン
ド
「全員」で送信
「チャット」で盛りあがろう!
5
なつなつなつ
なつなつなつ
なつココナッツ
練習
・・・と投稿してみよう!!
「なつ」の数は
心意気で自由だよ!
羽山 祥樹 @storywriter
6
日本ウェブデザイン株式会社 代表取締役CEO
使いやすいプロダクトをつくる専門家
HCD-Net認定 人間中心設計専門家
Web業界に25年、AIシステムのプロダクトマネージャーとUXデザインを7年
主な実績など
2009年 日経パソコン 企業サイトランキング2009
日本の主要企業696サイト中、ユーザビリティ/アクセシビリティ分野で第3位
2011年 Webユーザビリティランキング2011 企業サイト編
日本の大手企業150サイト中、第4位
主な専門分野
ユーザーエクスペリエンス、人間中心設計、情報アーキテクチャ、アクセシビリティ、ライター
7
現場で使える! Watson開発入門
Watson API、Watson StudioによるAIアプリ開発手法
Amazonで購入
https://www.amazon.co.jp/dp/4798158496/
UXデザイナーですが
AI の本を執筆したりも
しています
8
まずはこの動画をご覧ください
千凪みかさん
X(Twitter)
@sen7_mika
9
羽山には 「歌ってみた」 の歌い手さんで
10年ほど応援している歌い手さんがいます
千凪みかさん。4オクターブ超の音域
透明な高音とウイスパーボイスで魅了する歌姫
千凪みかさん
10
先ほどの動画は 千凪みかさん 「歌ってみた」 新曲
『またねがあれば』 のMVです
羽山が制作をさせていただいています(制作中)
11
お気づきでしょうか
この動画、じつは100%、生成AIでつくっています
実写のシーンはひとつもありません
使用している生成AI:
• Midjourney V6(alpha)
• Midjourney V5.2
• Runway Gen-2
• Runway Gen-1
• Adobe Firefly
12
先ほどの生成AI 100%の動画は完成したら
千凪みかさんYouTubeチャンネルに投稿します
今のうちに、ぜひチャンネル登録お願いいたします!
千凪みかさんYouTubeチャンネル
https://www.youtube.com/@sen7_mika
チャンネル登録
お願いします!
13
動画生成は Stable Diffusion ではじめたが
コードを書く量が多く、時間がかかった
Stable Diffusion Web UI
Google Colab でスタート
Stable Diffusion Web UI に
LoRAが読み込まれない致命的バグ
GitHubのIssuesを見ても
的外れなバグ報告しかない
ソースコードを読んで
エラー箇所を特定し修正
修正コードをGitHubの
Issuesにコメント
devブランチにマージされる
動画生成が進まない
14
羽山は日々の仕事でも
おおいに生成AIを使っています
15
羽山は2016年から
AIプロダクトの PdM(註)兼 UXデザイナーとして7年
「実務でAIにさわってデザインしているUXデザイナー」
としてはおそらく国内でも古参
註: PdM = プロダクトマネージャー(Product Manager)の略称
16
しかし、AIへの勘どころをもつゆえに
「AIでUXデザインはどう変わりますか?」
という質問には慎重になります
世論は AIへの期待、目先の技術に感動する人たち
AIで世界が変わってほしい人たち、プロ驚き屋
映画やアニメに影響された悲観論
よくわからないものへの不安
いろんな感情や思惑がうずまいています
17
今回のセミナー(第1回・第2回)は
ひとつひとつの要素をときほぐしながら
「AIとUXデザイン」 はどのように考えるべきか
考えていきましょう
オ
イ
オ
イ
オ
イ
た
い
し
た
無
茶
で
す
ね
ほ
う
A
I
が
世
の
中
を
変
え
る
と
い
う
風
潮
に
真
っ
向
議
論
で
す
か
…
死
ぬ
わ
ア
イ
ツ
告知:第2回 セミナー 2024年8月30日(金)
19
本日(第1回)では 「AIとUXデザイン」 の概観をお話します。次回のセミナー
(8月30日・金)では 「AIをどのようにUXデザインに活用できるのか」 の具体的
なイメージをお話します。ぜひあわせてご参加ください!(無料)
https://www.creativevillage.ne.jp/category/crv_event/149437/
20
UXデザイン・UXリサーチとは
なにをすることか
私
は
U
X
デ
ザ
イ
ン
が
大
好
き
だ
諸
君
な
ら
ば
U
X
デ
ザ
イ
ン
だ
よ
ろ
し
い
U
X
!!
U
X
!!
U
X
!!
23
“UXデザイン” や “UXリサーチ” とは
見た目のデザインのことではなく
ユーザーインタビューやユーザビリティテストをつかって
ユーザーの深い心理を突きとめる専門技術
インタビュー?
なにそれ?
Photoshop?
なにそれ?
“UXデザイン・UXリサーチ” と “UIデザイン”
24
“UI/UX” と併記されがちなUXデザインとUIデザインですが、まったく別のものです。
ユーザーインタビュー
ユーザビリティテスト
Photoshop
Illustrator
UXデザイナー UIデザイナー
羽山の “UXデザイン・UXリサーチ” の事例
25
住宅の床材(高額商品)をあつかうスタートアップ企業から
「自社商品はいちおう売れているが、なぜ売れるのかわからない。
そのため、今後の事業のリソースをどこに集中させればいいかわからない」
という相談があり、ユーザー調査をしました。
あの人なんでうちの商品
買ってくれたんだろう・・・
羽山の “UXデザイン・UXリサーチ” の事例
26
ユーザーインタビューをしたところ・・・
• ユーザーはふだん暮らしているとき、床材のことなど考えもしない。
• 床の痛みは、そういうものだと諦めている。
羽山の “UXデザイン・UXリサーチ” の事例
27
ユーザーインタビューをしたところ・・・
• ただし10年に1度くらい、およそ2ヶ月間だけ購買を検討しうる期間がある。
羽山の “UXデザイン・UXリサーチ” の事例
28
ユーザーインタビューをしたところ・・・
• それは 「リフォーム or 新築購入」 をしてから 「入居」 するまでの間。
• そのあいだは 「家が新品」 「部屋が空っぽ」 になる。
• ピカピカの床を見て、ユーザーは「今度こそ」と思う。床材のニーズが生まれる。
今度こそ
羽山の “UXデザイン・UXリサーチ” の事例
29
ユーザーインタビューをしたところ・・・
• 入居して「床に家具をおいてしまう」と、面倒でもう購入しない。
• 「リフォーム or 新築購入」 をしてから 「入居」 するまでリミットはおよそ2ヶ月間。
もういいや
面倒くさい
羽山の “UXデザイン・UXリサーチ” の事例
30
ユーザーインタビューをしたところ・・・
• 内装資材なので、ゼネコンから紹介されるのが、ほぼ唯一の接点。
床材
イイっすよ
羽山の “UXデザイン・UXリサーチ” の事例
31
じつは、そのスタートアップ企業は
「ゼネコンの下請け」 に入るのを避けようとしていました。
足を取られやすい(クレームなどが丸投げされてくる)からです。
しかし、羽山の調査結果を受けて、
『ユーザーへの唯一の接点』 がゼネコンのため、
かかわりを避けられないと覚悟し
「建設業界とうまく折衝していく」 という事業判断をしました。
羽山の “UXデザイン・UXリサーチ” の事例
32
このプロジェクトにおいて、
羽山はビジュアルの成果物を一切つくっていません。UIもつくっていません。
しかし、羽山がもたらしたユーザーへの本質的な理解により
スタートアップ企業は意思決定し、前に進むことができました。
33
これが “UXデザイン・UXリサーチ” です。
“UXデザイン”とは
34
UXデザインとは、ユーザーを理解することで
「我々はなにをつくるべきか」 「我々はなにをするべきか」 を
明らかにする専門技術です。
“UIデザイン”とは
35
UIデザインとは、デジタル製品(ウェブサイト、アプリ…)の
画面の構成やビジュアルをつくる専門技術です。
“UXデザイン” や “UXリサーチ” の位置づけ
36
典型的なウォーターフォールシステム開発のフローを浮かべたとき “UXデザイン” や
“UXリサーチ” は要件定義フェーズの「前」にやるのが、もっとも効果が発揮しやす
い。外部設計フェーズでやるのは “UXデザイン” ではなく “UIデザイン” です。
要件定義 外部設計 内部設計 製造 テスト リリース
“UXデザイン” や “UXリサーチ”
ここでやるのは “UIデザイン”
じゃあなんで “UI/UX” ってよく書いてあるの?
37
「UX」という概念は、もともとUIの専門家たちから提唱されたからです。
そのため、混ざって話されてしまうことが多かった。今もそれを引きずっています。
UXの専門家には “UI/UX” という表記を好まない方もいます。
≈
≈
…
あ
ま
り
『
U
I
/
U
X
』
と
い
う
表
記
を
遣
う
な
よ
素
人
に
見
え
る
ぞ
39
今どきのAIでとくに目立っているものは
どんなものがあるか
よく話題になっているAIはどんなものがあるか
40
2024年7月現在、毎日のように新しいAIの話題が飛び込んできます。
いくつかピックアップしてみましょう。
言語生成・チャット
41
ChatGPT Gemini Claude
引用: https://openai.com
引用: https://gemini.google.com/?hl=ja
引用: https://claude.ai
画像生成
42
DALL・E Midjourney Stable Diffusion
引用: https://openai.com/index/dall-e-3/
引用: https://www.midjourney.com/
引用: https://ja.stability.ai/stable-diffusion
引用: https://www.adobe.com/jp/products/firefly.html
Adobe Firefly
Runway Luma Dream Machine Leonardo
動画生成(その1)
43
引用: https://runwayml.com/
引用: https://lumalabs.ai/dream-machine
引用: https://leonardo.ai/
引用: https://pika.art/
Pika
Sora(2024年7月現在は未公開)
Kling
動画生成(その2)
44
引用: https://klingai.kuaishou.com/
引用: https://openai.com/index/sora/
音楽生成・音声合成・リップシンク
45
引用: https://suno.com/
引用: https://coefont.cloud/
引用: https://voicevox.hiroshiba.jp/
引用: https://www.heygen.com/
Suno CoeFont VOICEVOX
HeyGen
議事録作成
46
引用: https://tldv.io/ja/
引用: https://www.notta.ai/
tl;dv Notta
コーディング・プログラミング
47
引用: https://github.com/features/copilot
引用: https://www.mixo.io/
GitHub Copilot Mixo
Microsoft Office
48
Copilot for Microsoft 365
引用: https://www.microsoft.com/ja-jp/microsoft-365/business/copilot-for-microsoft-365
引用: https://www.microsoft.com/ja-jp/microsoft-copilot
Microsoft Copilot
Microsoft Copilot は OpenAI ChatGPT の OEM
いろんなツールに組み込まれたAI
49
引用: https://www.notion.so/ja-jp/product/ai
引用: https://www.figma.com/ja-jp/ai/
引用: https://www.canva.com/ja_jp/features/generative-ai/
Notion AI Figma AI Canva AI
50
ところで AIとはそもそもなんでしょうか
とても賢い? あらゆる会話を理解してくれる?
仕事をなんでも肩代わりしてくれる?
正体不明で怖い?
51
ITは、コードでプログラミングする
AIは、データでプログラミングする
IT AI
コード データ
52
ITと AIの差は
コードでプログラミングするか、データでプログラミングするか
コードでプログラミングする データでプログラミングする
if ...
then ...
else ...
犬
いぬ
ワンコ
53
データでプログラミングする とはなんでしょうか?
「犬」 と 「猫」 の写真を判定するシステムを
考えてみましょう
犬 猫
「犬」 の写真をコードで判定する
54
if 足が4本:
if 耳がある:
if 鼻がある:
if 目がある:
if 口がある:
・・・
55
コードで実現するには
この世に存在する、あらゆる犬と猫の条件を
洗い出しておき
判定したい写真がどの条件と一致するか判定する
現実的にムリ
「犬」 の写真をデータで判定する
56
引用: https://www.google.com/
57
データでプログラミングするとは
犬の写真を100枚、猫の写真を100枚
用意して、システムに入れる
判定したい写真が
犬と猫のどちらに似ているか
教えてくれる
「犬」 の写真をデータで判定する
58
柴犬って
ようはこんな感じ
59
AIの活用パターンは大きく2つ
タスクを自動化(Automation)する
人間の能力を拡張(Augmentation)する
Automation
自動化
Augmentation
拡張
AIでタスクを自動化(Automation)する
60
次のようなときは、AIでタスクを自動化するとよい。
• 人間にタスクをするための知識や能力や余裕が足りないとき。
• タスクが退屈、くりかえし、扱いにくい、または危険なとき。
例:
• よくある問い合わせに自動で回答文を送る。
• ベルトコンベアで流れてくる製品から不良品を見つける。
• 建物内のガス漏れを検知する。
人間の能力を拡張(Augmentation)する
61
次のようなときは、AIで人間の能力を拡張するとよい。
• 人間がタスクの結果に責任を持ちたいとき。
• 人間がタスクを楽しんでいるとき。
• 利害が大きいとき。
例:
• 重要な問い合わせに人間がうまく答えられるよう回答候補を出す。
• 絵を描くときに配色のアイデアをレコメンドしてくれる。
• リスクの大きい株式投資の判断を人間がするための情報を集める。
62
AIは 「あたりまえになると AIと呼ばなくなる」
たとえば Google サジェストは
25年前なら AIと呼ばれたかもしれない
いまや誰も AIだと思ってない
引用: https://www.google.com/
63
「AIでUXデザインは変わるのか?」
という質問はなんであるのか
64
「AIでUXデザインはどう変わりますか?」
世論は AIへの期待、目先の技術に感動する人たち
AIで世界が変わってほしい人たち、プロ驚き屋
映画やアニメに影響された悲観論
よくわからないものへの不安
いろんな感情や思惑がうずまいています
65
質問者も自分がなにを質問しているのかわかっていなさそう
だと羽山は感じています
「タイムボックスを整理しないと正しい判断はできない」
すると 「AIとUXデザイン」 はどのように見えるか
変わるところ・変わりえないところはどこか
わかってきます
66
タイムボックス その1
人類が変革されるのには何年かかるのか?
67
AIによる未来のUXデサイン?
68
ところでコンピューターができてから
今年でおよそ何年たったでしょう?
50年? 100年? 150年?
69
世界初のコンピューターENIACは
第二次世界大戦中の1946年
弾道計算のためにつくられました
70
つまり最初のコンピューターから
世界中にITとWebとスマホが行き渡るまで
およそ80年間かかりました
71
ちなみに産業革命は
およそ何年間を指すかご存知でしょうか?
100年? 150年? 200年?
72
産業革命(第一次)は
1760年代〜1830年代の
およそ80年間を指します
73
ではディープラーニングが
世の中に最初に知らしめられたのは
いつでしょうか
74
画像認識の精度を競う国際大会ILSVRCで
ヒントン率いるトロント大学が
ディープラーニングを用いて圧勝(2012)
75
つまり私たちの生活にAIが行き渡り
自然にとなりあうものになるまで
あと70年(2092年)
76
私たちはAIの普及の
まだ入口にいるにすぎません
77
渡邊 恵太 先生の
「融けるデザイン ハード×ソフト×ネット時代の新たな設計論」
画面引用: https://bnn.co.jp/products/9784861009389
78
渡邊 恵太 先生の
「融けるデザイン ハード×ソフト×ネット時代の新たな設計論」
引用: 融けるデザイン ハード×ソフト×ネット時代の新たな設計論,渡邊 恵太, 2015
ハードウェア、ソフトウェア、
インターネットが融け合う、
身体的で体験的なものづくりの時代には、
新しい設計方法論が求められる。
たしかに!
79
引用: 融けるデザイン ハード×ソフト×ネット時代の新たな設計論,渡邊 恵太, 2015
1946年
ENIAC
1989年
Web
2007年
iPhone
2015年
融けるデザイン
1946 1950 1960 1970 1980 1990 2000 2010 2020 2023
ハードウェア、ソフトウェア、
インターネットが融け合う、
身体的で体験的なものづくりの時代には、
新しい設計方法論が求められる。
たしかに!
2024年の俺
80
引用: 融けるデザイン ハード×ソフト×ネット時代の新たな設計論,渡邊 恵太, 2015
1946年
ENIAC
1989年
Web
2007年
iPhone
1946 1950 1960 1970 1980 1990 2000 2010 2020 2023
もしも「融けるデザイン」が1957年に出版されていたら
ハードウェア、ソフトウェア、
インターネットが融け合う、
身体的で体験的なものづくりの時代には、
新しい設計方法論が求められる。
1957年
融けるデザイン
81
引用: 融けるデザイン ハード×ソフト×ネット時代の新たな設計論,渡邊 恵太, 2015
1946年
ENIAC
1989年
Web
2007年
iPhone
1946 1950 1960 1970 1980 1990 2000 2010 2020 2023
もしも「融けるデザイン」が1957年に出版されていたら
ハードウェア、ソフトウェア、
インターネットが融け合う、
身体的で体験的なものづくりの時代には、
新しい設計方法論が求められる。
なんの話?
1957年
融けるデザイン
67年前の人
82
2012年
ディープラーニング
2023年
GPT-4
2073年
???
2012 2020 2030 2040 2050 2060 2070 2080 2090 2092
AIにおきかえると?
2055年
???
2024年
俺らはイマココ
2045年
シンギュラリティ
83
2012年
ディープラーニング
2023年
GPT-4
2073年
???
2012 2020 2030 2040 2050 2060 2070 2080 2090 2092
AIにおきかえると?
2055年
???
2045年
シンギュラリティ
AIでUXデザインが変わる!
たとえば...
2024年
俺らはイマココ
84
2012年
ディープラーニング
2023年
GPT-4
2073年
???
2012 2020 2030 2040 2050 2060 2070 2080 2090 2092
AIにおきかえると?
2055年
???
2045年
シンギュラリティ
どのくらい確実な
未来への指針が
含まれうるのだろう?
AIでUXデザインが変わる!
たとえば...
2024年
俺らはイマココ
85
2012年
ディープラーニング
2023年
GPT-4
2073年
???
2012 2020 2030 2040 2050 2060 2070 2080 2090 2092
AIにおきかえると?
2055年
???
2045年
シンギュラリティ
2055年
Webに相当する
なにかが登場する
2073年
iPhoneに相当する
なにかが登場する
2024年
俺らはイマココ
86
2012年
ディープラーニング
2023年
GPT-4
2073年
???
2012 2020 2030 2040 2050 2060 2070 2080 2090 2092
AIにおきかえると?
2055年
???
2045年
シンギュラリティ
2055年
Webに相当する
なにかが登場する
2073年
iPhoneに相当する
なにかが登場する
2024年
俺らはイマココ
31年後に Web が
49年後に iPhone が出るが
私たちはそれを知るすべはない
2024年
俺らはイマココ
87
マクロな視点で見たとき
私たちは AI が人類に普及する80年間の
まだ11年目にいるにすぎない
2012 2020 2030 2040 2050 2060 2070 2080 2090 2092
ま
だ
あ
わ
て
る
よ
う
な
時
間
じ
ゃ
な
い
89
この先の70年で AI をとりまく状況は
何度も変わり、そのたび新しいデザイン手法が必要になる
しかし1957年にWebもiPhoneも予測できないように
それがなんであるかは予測できない
2012 2020 2030 2040 2050 2060 2070 2080 2090 2092
2024年
俺らはイマココ
90
いや今回の AI革命は
もっと早くに進むはず!
それ25年前に
インターネット革命のときも
同じこと言ってません
でした?
そのあとに
iPhone が
出てきたでしょ?
人類の進歩をあなどってはいけない
「これで終わり」と思っても進歩は続く
91
タイムボックス その2
AIの進化はフロントエンド技術の流行に似ている
92
AIの進化はフロントエンド技術の流行に似ています
93
2010年
jQueryが席巻
2018年
Angular, React, Vue
2010 2015 2020 2025
フロントエンド技術の流行
2024年
俺らはイマココ
2024年
React 一強
94
2010年、jQuery が世界を席巻していました
そのとき、この質問に正確に答えられた人はいるだろうか?
10年後のJavaScriptは
どうなっていますか?
95
2018年、Angular, React, Vue の三国時代
そのとき、この質問に正確に答えられた人はいるだろうか?
5年後のJavaScriptは
どうなっていますか?
96
2024年、React が一強になりました
この質問に正確に答えられる人はいるだろうか?
5年後のJavaScriptは
どうなっていますか?
こ
の
瞬
間
を
よ
ォ
と
き
!!
“
” 待
っ
て
た
ぜ
ェ
!!
“
”
98
2016年
IBM Watson
2020年
DeepL
2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 2025
AI技術の流行
2024年
俺らはイマココ
2023年
GPT-4
2022年
DALL-E 2,
Midjourney,
Stable Diffusion
99
2016年、IBM Watson が世界中の注目を浴びる
当時は Natural Language Classifier,
Retrieve and Rank の2サービスのみ
そのとき、この質問に正確に答えられた人はいるだろうか?
8年後のAIは
どうなっていますか?
100
2020年、DeepL が日本語に対応
そのとき、この質問に正確に答えられた人はいるだろうか?
4年後のAIは
どうなっていますか?
101
2022年、画像生成AIが次々と発表
DALL-E 2, Midjourney, Stable Diffusion
そのとき、この質問に正確に答えられた人はいるだろうか?
2年後のAIは
どうなっていますか?
102
2022年末、ChatGPT が OpenAI より公開
まだ1年半ほどしかたっていません
GPT-4 は 2023年3月です
この質問に正確に答えられる人はいるだろうか?
1年後のAIは
どうなっていますか?
2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 2025
2024年
俺らはイマココ
103
タイムボックスを短く区切っても
AI技術の流行は猛スピードで変化している
1年後すら正しく予測できない
104
「未来について語るな、今日について語れ」
105
70年後までにAIの分野で
「インターネット」 や 「iPhone」 にあたる革新が起こるが
それがなんなのか2024年現在で予測するのはムリ
106
AIの技術は毎年、新しいものに移り変わるが
それがなんなのか予測するのもムリ
107
「AIでUXデザインは変わるのか」
という問いへの回答は
「刻々と変わるにちがいないが
それがなんであるかを見通すことはムリ
将来予測の議論はあまり意味がない」
2024年現在は
AIへの期待が煽られすぎて
1年後と70年後の話が
混ざって語られがち
108
裏返すと
「今日のAI技術とUXデザインはどう組み合わせられるか」
という議論であれば適切な答えがある
109
羽山の見解は
「AIとUXデザイン」 について語るなら
「未来について語るな、今日について語れ」
110
AIでUXデザインが変わるところ・変わりえないところ
111
UXデザインの源流は
産業革命による人間工学の発祥といわれます
羽山は5000年前(紀元前3000年)の
市場経済の成立(註)までさかのぼるほうがよいと
考えています
ものを売るには顧客の目線で商売しなければならない
「顧客のことを考える」 歴史の起点だからです
註: 市場経済の成立時期については諸説あります
112
つまり 「顧客のことを考える」 という行為は
5000年間、私たちにとって普遍であり続けました
113
「UXデサイン」とは
「ユーザーを中心にものづくりをする」
ことです
114
私たちUXデザイナーは
ユーザーの課題解決に必要なら
その時代時代のAIを使ってものづくりをし
115
ユーザーの課題解決にAIが必要でなければ
AIを使わずに他の方法を用いて
ものづくりを続けるでしょう
116
ユーザーを中心に考えるという意味において
「AIでUXデザインは変わらない」
私たちの基本姿勢は
10年後も20年後も、70年後も変わりません
117
ただし
Web(1989〜)やスマホ(2007〜)が
UXデザインの「設計方法論」を増やしたように
118
次々と発表されるAI技術が
UXデザインの「設計方法論」を増やしてくれる
ことは確実でしょう
119
特 報
120
AI を用いて UXデザインの
「切片化」 「親和図法」 を支援するツール
AIで切片化・親和図法を支援するツール 『toitta』
121
UXデザイン・UXリサーチで用いられる 「親和図法」 や 「KA法(本質的価値抽
出法)」 は優れた定性分析の手法である代わりに、切片(ふせん)の書き出し
と整理に時間がかかるのが悩みでした。
AIで切片化・親和図法を支援するツール 『 toitta 』 が 株式会社はてな 様か
らリリースされます!
さ
す
が
は
て
な
お
れ
た
ち
に
で
き
な
い
事
を
平
然
と
や
っ
て
の
け
る
ッ
そ
こ
に
シ
ビ
れ
る
あ
こ
が
れ
る
ゥ
!
!
!
toitta つかってみた
123
羽山もテストユーザーとして試させていただきました。
toitta を親和図法の前処理(インタビューの書き起こし・切片化)を使うと、ふだ
ん何日もかかる親和図法がなんと1日で仕上がりました!
発話の前後の文脈までちゃんとAIが考慮して切片化するのが感動でした。
AIが俺の能力を
底上げしてくれてる感
パない!
toitta の支援でつくった親和図(価値マップ)
124
発話録の
書き起こしすら
してない状況から
一晩で仕上がった
インタビュー録画60分から
AIが発話録の書き起こし・
102枚の切片化を
してくれた
羽山は
切片のレビューから
すればよい
ユーザーの“声”に向き合う
インタビュー分析ツール
詳細はQRコードから!
発話データの自動書き起こし・切片生成で
定性調査の分析支援を行います
toitta(トイッタ)とは
書き起こし・話者分離 切片一覧
https://ja.toitta.com
miroなどにエクスポート
ま
だ
ア
ク
セ
ス
し
て
い
な
い
の
か
ね
40
秒
間
待
っ
て
や
る
128
まとめ
129
「AIは私たちの仕事を奪いますか?」
「AIは自我をもつようになりますか?」
それを訊いてどうするの・・・?
A
I
が
お
前
の
仕
事
を
奪
う
ん
じ
ゃ
ね
ぇ
お
前
の
甘
さ
が
お
前
か
ら
仕
事
を
奪
う
ん
だ
!!
お
前
な
ぁ
ん
か
勘
ち
が
い
し
と
り
ゃ
せ
ん
か
?
まとめ
131
1. AIでUXデザインの『設計方法論』は刻々と変わるにちがいないが、それがなん
であるかを見通すことはムリ。将来予測の議論にはあまり意味がない。
2. 「今日のAI技術とUXデザインはどう組み合わせられるか」という議論であれば
適切な答えがある。「AIとUXデザイン」について語るなら「未来について語るな、
今日について語れ」
3. ユーザーを中心に考えるという意味においては「AIでUXデザインは変わらな
い」。何十年経ってもその姿勢は普遍。
4. toittaはいいぞ。
次回予告
132
本日は 「AIとUXデザイン」 の概観をお話しました。次回の第2回セミナー(8月
30日・金)では 「AIをどのようにUXデザインに活用できるのか」 の具体的なイメー
ジをお話します。ぜひご参加ください!(無料)
https://www.creativevillage.ne.jp/category/crv_event/149437/
133
ありがとうございました
羽山 祥樹 @storywriter
UXデザイン・UXリサーチの
人材育成のメンタリング
ご相談ください!
羽山のプレゼンのアレ が、
LINEスタンプになりました!
スタンプ名:ハーミィ(CSS編) 作者名:羽山 祥樹
https://store.line.me/stickershop/product/1228201/ja
Web・CSSネタ
全40種類

AIによってUXは変わるのか!? - 2024年7月26日 CREATIVE VILLAGE セミナー 「AIとUXデザイン」 Vol.1