SlideShare a Scribd company logo

UXのためのUIデザイン

どんなにすばらしいUXをユーザーに提供しようとしても、UIがUXのためのデザインになっていないとユーザーは体験することが出来ません。それはいろんな意味で残念。。UXを正しく考慮したUIをデザインするためには、どうすればいいのでしょうか?

1 of 23
UXのためのUIデザイン
対象

デザイン対象
 スマートフォン向けアプリケーションのUI。
 他のデバイス(タブレット、TV)上でのアプリケーションのUIにも応用できます。


対象となる人
 UXデザイナー
 UIデザイナー
 UIに関わっているステークホルダー




                     2
はじめに

どんなにすばらしいUXをユーザーに提供しようとしても、
UIがUXのためのデザインになっていないとユーザーは体験することが出来ません。


それはいろんな意味で残念。。



UXを正しく考慮したUIをデザインするためには、どうすればいいのでしょうか?




                    3
アプリケーションを作るために

UX(体験)と、それを提供するためのUI(表現)と、UIやサービスを実現するための
Software(実現)それぞれの価値の最大化を図ることが大切です。




                                           UX




                                Software        UI




                      4
UXとUIの境界

UX = ユーザー体験
 語られる言葉は、体験です。


UI = ユーザーインターフェイス
 語られる言葉は、インタラクションであり、ビジュアルであり、アーキテクチャです。


UX UI
 UX=UIではありません。ユーザーがUIを通して体験することがUXです。
 UIで語られる言葉がどんなに素晴らしくても、それがすなわちUXを実現しているとは言えません。


UIデザインの理由
 デザインには理由が必要です。
 UXの実現をUIの目的とした場合、『デザインの理由=UXを実現していること』です。
 しかし、体験をUIの言葉で語るには限界があります。そのため、UXとUIをつなぐ言葉が必要になります。


                         5
UXとUIをつなぐ言葉

UXを実現するために必要なアクション(ユーザーの行動)を整理することで、UXをUI
デザイン上の言葉に変換できます。




   UX             アクション              UI
           体験             インタラクション
                          ビジュアル
                          アーキテクチャ

                    6

Recommended

UI&UX / 重要なのは、毎日さわって嬉しい UI UX!
UI&UX / 重要なのは、毎日さわって嬉しい UI UX! UI&UX / 重要なのは、毎日さわって嬉しい UI UX!
UI&UX / 重要なのは、毎日さわって嬉しい UI UX! Akiko Ohtsuka
 
確実に良くするUI/UX設計
確実に良くするUI/UX設計確実に良くするUI/UX設計
確実に良くするUI/UX設計Takayuki Fukatsu
 
サービスにおけるビジュアルデザインの役割
サービスにおけるビジュアルデザインの役割サービスにおけるビジュアルデザインの役割
サービスにおけるビジュアルデザインの役割Kenichi Suzuki
 
UIデザインとUXの超基礎「UI Design & UX for ENGINEER」
UIデザインとUXの超基礎「UI Design & UX for ENGINEER」UIデザインとUXの超基礎「UI Design & UX for ENGINEER」
UIデザインとUXの超基礎「UI Design & UX for ENGINEER」Kazuki Yamashita
 
0528 kanntigai ui_ux
0528 kanntigai ui_ux0528 kanntigai ui_ux
0528 kanntigai ui_uxSaori Matsui
 
エンジニアの立場で考えるUXデザイン
エンジニアの立場で考えるUXデザインエンジニアの立場で考えるUXデザイン
エンジニアの立場で考えるUXデザインMasaya Ando
 
いいデザインのために組織の一人ひとりができること
いいデザインのために組織の一人ひとりができることいいデザインのために組織の一人ひとりができること
いいデザインのために組織の一人ひとりができることMasahiko Yoshikawa
 
“UI/UX”?~恥をかかないための15分UXD入門
“UI/UX”?~恥をかかないための15分UXD入門“UI/UX”?~恥をかかないための15分UXD入門
“UI/UX”?~恥をかかないための15分UXD入門Masaya Ando
 

More Related Content

What's hot

コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意Yasuhisa Hasegawa
 
心地よいUIの温度 - 言葉と気遣いで高めるUI -
心地よいUIの温度 - 言葉と気遣いで高めるUI -心地よいUIの温度 - 言葉と気遣いで高めるUI -
心地よいUIの温度 - 言葉と気遣いで高めるUI -wariemon
 
UX白書サマリー資料20111015
UX白書サマリー資料20111015UX白書サマリー資料20111015
UX白書サマリー資料20111015hcdvalue
 
UXの考え方とアプローチ
UXの考え方とアプローチUXの考え方とアプローチ
UXの考え方とアプローチMasaya Ando
 
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司schoowebcampus
 
9コマシナリオの使い方
9コマシナリオの使い方9コマシナリオの使い方
9コマシナリオの使い方Mayumi Okusa
 
UXデザイン概論 2019
UXデザイン概論 2019UXデザイン概論 2019
UXデザイン概論 2019Masaya Ando
 
”安藤昌也さん”のUX論 ~ 利他的な「私」
”安藤昌也さん”のUX論 ~ 利他的な「私」”安藤昌也さん”のUX論 ~ 利他的な「私」
”安藤昌也さん”のUX論 ~ 利他的な「私」Masaya Ando
 
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたらもしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたらYoshiki Hayama
 
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!Yoshiki Hayama
 
人間中心設計の国際規格ISO9241-210:2010のポイント
人間中心設計の国際規格ISO9241-210:2010のポイント人間中心設計の国際規格ISO9241-210:2010のポイント
人間中心設計の国際規格ISO9241-210:2010のポイントMasaya Ando
 
UXデザインの理論・プロセス・手法の体系とポイント
UXデザインの理論・プロセス・手法の体系とポイントUXデザインの理論・プロセス・手法の体系とポイント
UXデザインの理論・プロセス・手法の体系とポイントMasaya Ando
 
UIデザインの基本
UIデザインの基本UIデザインの基本
UIデザインの基本Roy Kim
 
はじめてのUXとUIの話
はじめてのUXとUIの話はじめてのUXとUIの話
はじめてのUXとUIの話Kazuki Yamashita
 
UXとUXD~長期的ユーザビリティをどう作りどう測るか?
UXとUXD~長期的ユーザビリティをどう作りどう測るか?UXとUXD~長期的ユーザビリティをどう作りどう測るか?
UXとUXD~長期的ユーザビリティをどう作りどう測るか?Masaya Ando
 
ITエンジニアに易しいUI/UXデザイン
ITエンジニアに易しいUI/UXデザインITエンジニアに易しいUI/UXデザイン
ITエンジニアに易しいUI/UXデザインRoy Kim
 
UXデザインとコンセプト評価 ~俺様企画はだめなのよ
UXデザインとコンセプト評価~俺様企画はだめなのよUXデザインとコンセプト評価~俺様企画はだめなのよ
UXデザインとコンセプト評価 ~俺様企画はだめなのよMasaya Ando
 
ユーザーインタビューからその後どうするの? 得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回
ユーザーインタビューからその後どうするの?得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回ユーザーインタビューからその後どうするの?得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回
ユーザーインタビューからその後どうするの? 得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回Yoshiki Hayama
 
顧客体験のデザイン〜そのサービスに“願い”はあるか?
顧客体験のデザイン〜そのサービスに“願い”はあるか?顧客体験のデザイン〜そのサービスに“願い”はあるか?
顧客体験のデザイン〜そのサービスに“願い”はあるか?Masaya Ando
 
アイデア収束からプロトタイピング
アイデア収束からプロトタイピングアイデア収束からプロトタイピング
アイデア収束からプロトタイピングMasaya Ando
 

What's hot (20)

コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意
 
心地よいUIの温度 - 言葉と気遣いで高めるUI -
心地よいUIの温度 - 言葉と気遣いで高めるUI -心地よいUIの温度 - 言葉と気遣いで高めるUI -
心地よいUIの温度 - 言葉と気遣いで高めるUI -
 
UX白書サマリー資料20111015
UX白書サマリー資料20111015UX白書サマリー資料20111015
UX白書サマリー資料20111015
 
UXの考え方とアプローチ
UXの考え方とアプローチUXの考え方とアプローチ
UXの考え方とアプローチ
 
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
 
9コマシナリオの使い方
9コマシナリオの使い方9コマシナリオの使い方
9コマシナリオの使い方
 
UXデザイン概論 2019
UXデザイン概論 2019UXデザイン概論 2019
UXデザイン概論 2019
 
”安藤昌也さん”のUX論 ~ 利他的な「私」
”安藤昌也さん”のUX論 ~ 利他的な「私」”安藤昌也さん”のUX論 ~ 利他的な「私」
”安藤昌也さん”のUX論 ~ 利他的な「私」
 
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたらもしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら
 
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
 
人間中心設計の国際規格ISO9241-210:2010のポイント
人間中心設計の国際規格ISO9241-210:2010のポイント人間中心設計の国際規格ISO9241-210:2010のポイント
人間中心設計の国際規格ISO9241-210:2010のポイント
 
UXデザインの理論・プロセス・手法の体系とポイント
UXデザインの理論・プロセス・手法の体系とポイントUXデザインの理論・プロセス・手法の体系とポイント
UXデザインの理論・プロセス・手法の体系とポイント
 
UIデザインの基本
UIデザインの基本UIデザインの基本
UIデザインの基本
 
はじめてのUXとUIの話
はじめてのUXとUIの話はじめてのUXとUIの話
はじめてのUXとUIの話
 
UXとUXD~長期的ユーザビリティをどう作りどう測るか?
UXとUXD~長期的ユーザビリティをどう作りどう測るか?UXとUXD~長期的ユーザビリティをどう作りどう測るか?
UXとUXD~長期的ユーザビリティをどう作りどう測るか?
 
ITエンジニアに易しいUI/UXデザイン
ITエンジニアに易しいUI/UXデザインITエンジニアに易しいUI/UXデザイン
ITエンジニアに易しいUI/UXデザイン
 
UXデザインとコンセプト評価 ~俺様企画はだめなのよ
UXデザインとコンセプト評価~俺様企画はだめなのよUXデザインとコンセプト評価~俺様企画はだめなのよ
UXデザインとコンセプト評価 ~俺様企画はだめなのよ
 
ユーザーインタビューからその後どうするの? 得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回
ユーザーインタビューからその後どうするの?得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回ユーザーインタビューからその後どうするの?得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回
ユーザーインタビューからその後どうするの? 得られた情報を「UXデザイン」に落とし込む方法 | UXデザイン基礎セミナー 第3回
 
顧客体験のデザイン〜そのサービスに“願い”はあるか?
顧客体験のデザイン〜そのサービスに“願い”はあるか?顧客体験のデザイン〜そのサービスに“願い”はあるか?
顧客体験のデザイン〜そのサービスに“願い”はあるか?
 
アイデア収束からプロトタイピング
アイデア収束からプロトタイピングアイデア収束からプロトタイピング
アイデア収束からプロトタイピング
 

Viewers also liked

UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美
UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美
UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美schoowebcampus
 
企画が考えるスマホUIデザイン
企画が考えるスマホUIデザイン企画が考えるスマホUIデザイン
企画が考えるスマホUIデザインKatsumi Mizushima
 
アプリUI勉強会 in ネットイヤーグループ
アプリUI勉強会 in ネットイヤーグループアプリUI勉強会 in ネットイヤーグループ
アプリUI勉強会 in ネットイヤーグループKenichi Suzuki
 
スマホサービスにおける、UIデザインのノウハウと実例
スマホサービスにおける、UIデザインのノウハウと実例スマホサービスにおける、UIデザインのノウハウと実例
スマホサービスにおける、UIデザインのノウハウと実例yosuke sato
 
UI設計の土台になる考え方-インテリジェントネット社内勉強会
UI設計の土台になる考え方-インテリジェントネット社内勉強会UI設計の土台になる考え方-インテリジェントネット社内勉強会
UI設計の土台になる考え方-インテリジェントネット社内勉強会INI株式会社
 
女子の心をつかむUIデザインポイント - MERY編 -
女子の心をつかむUIデザインポイント - MERY編 -女子の心をつかむUIデザインポイント - MERY編 -
女子の心をつかむUIデザインポイント - MERY編 -Shoko Tanaka
 
最近のUIデザインプロセス
最近のUIデザインプロセス最近のUIデザインプロセス
最近のUIデザインプロセスShingo Katsushima
 
おかんでもわかるUXデザイン Ver.0.1
おかんでもわかるUXデザイン Ver.0.1おかんでもわかるUXデザイン Ver.0.1
おかんでもわかるUXデザイン Ver.0.1Yu Morita
 
当たり前を当たり前だと思ってはいけない!スマートフォンUIデザイン
当たり前を当たり前だと思ってはいけない!スマートフォンUIデザイン当たり前を当たり前だと思ってはいけない!スマートフォンUIデザイン
当たり前を当たり前だと思ってはいけない!スマートフォンUIデザインKonomi Kawaharada
 
ニコニコ超デザイン-Metro考察編-
ニコニコ超デザイン-Metro考察編-ニコニコ超デザイン-Metro考察編-
ニコニコ超デザイン-Metro考察編-Mizushima Kazuhiro
 
Why startups need "Lean Startup" & "Design Sprint"?
Why startups need "Lean Startup" & "Design Sprint"?Why startups need "Lean Startup" & "Design Sprint"?
Why startups need "Lean Startup" & "Design Sprint"?Takaaki Umada
 
Design Sprint 概要 / デザインスプリント概要
Design Sprint 概要 / デザインスプリント概要Design Sprint 概要 / デザインスプリント概要
Design Sprint 概要 / デザインスプリント概要Takaaki Umada
 
UXはじめの一歩
UXはじめの一歩UXはじめの一歩
UXはじめの一歩井上 誠
 
Design Sprint Process / デザインスプリントの実際のプロセスについて
Design Sprint Process / デザインスプリントの実際のプロセスについてDesign Sprint Process / デザインスプリントの実際のプロセスについて
Design Sprint Process / デザインスプリントの実際のプロセスについてTakaaki Umada
 
[UX]は投げ捨てろ!
[UX]は投げ捨てろ![UX]は投げ捨てろ!
[UX]は投げ捨てろ!c-mitsuba
 
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化Hiroki Takaba
 
UIの話は会議室でするな
UIの話は会議室でするなUIの話は会議室でするな
UIの話は会議室でするなShingo Katsushima
 
ShibuyaUX - UX and Analytics
ShibuyaUX - UX and AnalyticsShibuyaUX - UX and Analytics
ShibuyaUX - UX and AnalyticsMakoto Shimizu
 
図解で学ぶ「Lean UX」
図解で学ぶ「Lean UX」図解で学ぶ「Lean UX」
図解で学ぶ「Lean UX」Katsuhito Okada
 

Viewers also liked (20)

UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美
UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美
UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美
 
企画が考えるスマホUIデザイン
企画が考えるスマホUIデザイン企画が考えるスマホUIデザイン
企画が考えるスマホUIデザイン
 
アプリUI勉強会 in ネットイヤーグループ
アプリUI勉強会 in ネットイヤーグループアプリUI勉強会 in ネットイヤーグループ
アプリUI勉強会 in ネットイヤーグループ
 
スマホサービスにおける、UIデザインのノウハウと実例
スマホサービスにおける、UIデザインのノウハウと実例スマホサービスにおける、UIデザインのノウハウと実例
スマホサービスにおける、UIデザインのノウハウと実例
 
UI設計の土台になる考え方-インテリジェントネット社内勉強会
UI設計の土台になる考え方-インテリジェントネット社内勉強会UI設計の土台になる考え方-インテリジェントネット社内勉強会
UI設計の土台になる考え方-インテリジェントネット社内勉強会
 
女子の心をつかむUIデザインポイント - MERY編 -
女子の心をつかむUIデザインポイント - MERY編 -女子の心をつかむUIデザインポイント - MERY編 -
女子の心をつかむUIデザインポイント - MERY編 -
 
最近のUIデザインプロセス
最近のUIデザインプロセス最近のUIデザインプロセス
最近のUIデザインプロセス
 
おかんでもわかるUXデザイン Ver.0.1
おかんでもわかるUXデザイン Ver.0.1おかんでもわかるUXデザイン Ver.0.1
おかんでもわかるUXデザイン Ver.0.1
 
当たり前を当たり前だと思ってはいけない!スマートフォンUIデザイン
当たり前を当たり前だと思ってはいけない!スマートフォンUIデザイン当たり前を当たり前だと思ってはいけない!スマートフォンUIデザイン
当たり前を当たり前だと思ってはいけない!スマートフォンUIデザイン
 
ニコニコ超デザイン-Metro考察編-
ニコニコ超デザイン-Metro考察編-ニコニコ超デザイン-Metro考察編-
ニコニコ超デザイン-Metro考察編-
 
Why startups need "Lean Startup" & "Design Sprint"?
Why startups need "Lean Startup" & "Design Sprint"?Why startups need "Lean Startup" & "Design Sprint"?
Why startups need "Lean Startup" & "Design Sprint"?
 
Design Sprint 概要 / デザインスプリント概要
Design Sprint 概要 / デザインスプリント概要Design Sprint 概要 / デザインスプリント概要
Design Sprint 概要 / デザインスプリント概要
 
UXはじめの一歩
UXはじめの一歩UXはじめの一歩
UXはじめの一歩
 
Design Sprint Process / デザインスプリントの実際のプロセスについて
Design Sprint Process / デザインスプリントの実際のプロセスについてDesign Sprint Process / デザインスプリントの実際のプロセスについて
Design Sprint Process / デザインスプリントの実際のプロセスについて
 
[UX]は投げ捨てろ!
[UX]は投げ捨てろ![UX]は投げ捨てろ!
[UX]は投げ捨てろ!
 
UXとブランド
UXとブランドUXとブランド
UXとブランド
 
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化
 
UIの話は会議室でするな
UIの話は会議室でするなUIの話は会議室でするな
UIの話は会議室でするな
 
ShibuyaUX - UX and Analytics
ShibuyaUX - UX and AnalyticsShibuyaUX - UX and Analytics
ShibuyaUX - UX and Analytics
 
図解で学ぶ「Lean UX」
図解で学ぶ「Lean UX」図解で学ぶ「Lean UX」
図解で学ぶ「Lean UX」
 

UXのためのUIデザイン