WEBでの伝え方
UI ＆UXについて知る
ＵＩとは
ユーザインターフェイスの略→何かを繋げる意味
人が目に触れるものの事
シンプルにわかりやすく伝える事がUIのポイント
例えば
家のマーク ＝ホームだな
虫メガネ＝ 検索ボタンだな
紙に上記のマークがあっても意味が分からない
Ｗｅｂだと認識することをＵＩデザインという
アプリケーションも時代で変わる
ＵＩデザインとは
アイコン バナー 画面レイアウトの事
時代の背景に合わせてデザインも変えてよりシンプルに
ユーザーに認識させることが必要
ＵＸデザインとは
ユーザーエクスペリエンスのこと
ユーザーに体験させて意識づけること
例えば
美味しいご飯を食べて楽しい時間を過ごした
遊園地で遊んで幸せだったという体験
ユーザーが感じる体験や経験のこと
例えばユーザーが自販機でジュースを購入するまでの行動を分析する
UIだと
■ 熱い、喉が渇いた ↓
■ ジュースを買おう→ 購入のしやすさ パッケージをみる
■ さあ飲むぞ→ 飲みやすさなどを求める
UXとは
■ デザインが爽やかで飲みたくなる！
面白いデザインだななど
■ プシュッて音の爽快感などの体験
→潤った!また飲もうと思う体験
つまり
UIで
ユーザーにどんな体験をしてもらいどう感じるのか
UX
その為にどうすれば心地よく使ってもらえるのか設計する事
■ＵＸを改善するには
人の体験を軸に設計する事
設計対象について
①インターフェイス
②コンテンツ
③コンテクスト
① インターフェース（ユーザーが検索した時の動き早さ見やすさなど）
■ どう見えるか
■ どう感じるか
■ ストレスはないかをもとに設計していく事がポイント
UXで大事なのはいかにユーザーにストレスをあたえないかという事
☑ ただ触っているだけで心地よいと思わせる感覚の提供・設計
をすることが大切
☑ 何かを作るときストレスなく作る事が大切
例えば何かを検索した時にぐるぐる回って検索できないなどはNG
ユーザーの行動の意味をくみ取り仕組作りをする事
人と人とのコミュニケ‐ションではないからこそ
わかりやすくすることが大切
② コンテンツ作成のポイント
■ 見て満足
■ 知って満足
■ 感じて満足
感覚の中にある満足感の提供をすること
×テキストが多い
×ボタンの数が多いと見にくい
何が必要かの前に
何が必要でないのかを決めてコンテンツを決める事
こちら側が伝えたい内容とユーザーが知りたい内容に
差がないかも意識する事
情報量が多すぎるとユーザーにストレスを与えます
③ コンテクスト
Ａという事象に対してプラスαの情報を組み合わせることによって
よりAの情報が鮮明になることがコンテクスト
例えばママおかわりちょうだい
どういう風景を思い浮かべるのか?
スナック 食卓 台所?→これがプラスαの情報
ここがわかると内容がより鮮明になる
コンテクストの購買までの流れ
クリックまたはタップすることで↓
ページが変わる↓
認知 共感 理解する（見る・知る・感じる）
情報見た時に↓
ワクワク 楽しいなどの感情がわいて満足する
アクション→ 購入するなど
これがコンテクスの物の流れ
一つの行動や感情には体験や行動が隠れている
コンテクストとは
☑ 無意識に利用させる
☑ 無意識に操作させて
購入までの流れを作る事
※想定外の感覚をあたえるのはNGです
例えば検索してページが変わったのに別の詳細が出てくるなどは
ユーザーの離脱につながります
UIを改善する
ユーザーの行動を考えてデザインすることが大切
操作感が大切 UIデザイン
■ 簡単である やれそうだと思わせる
■ 効率がいい 面倒くさくない
■ 一貫性がある 学習させる
■ できるではなくやれそう
例えばWEｂサイトを開いたときに自分の目的の商品がさがしやすい
WEｂページの下部から上部にワンクリックで飛べるなど
※ストレスをなくすこと
現在のデザインは何にでも見立てることができる
自由さと柔軟さがある
ここで注意なのは
×無理に見立てると誤解を招く
×時代の流れに影響されてしまう→他との差別化ができない
ユーザーの行動をみてデザインをする事
まとめ
ユーザーに意識させないで自然に行動させる事
ユーザーの行動を考えてデザインする事
ユーザーが探さなくてもボタンを押せるなど
行動に基づいて経験さえることがUX
まとめ
☑ ユーザーがどう触れてどう見て心地よく使ってもらえるのか
☑ 商品WEBも店舗もまずユーザーの行動を把握することが必要である
皆さんもUI＆UXを意識してWEBサイト作成してくださいね。
～越智圭吾さんからの学びをアウトプット～