WEBでの伝え方

UI &UXについて知る

UIとは

ユーザインターフェイスの略→何かを繋げる意味
人が目に触れるものの事

シンプルにわかりやすく伝える事がUIのポイント

例えば

家のマーク =ホームだな

虫メガネ= 検索ボタンだな

紙に上記のマークがあっても意味が分からない

Webだと認識することをUIデザインという

アプリケーションも時代で変わる

UIデザインとは

アイコン バナー 画面レイアウトの事

時代の背景に合わせてデザインも変えてよりシンプルに

ユーザーに認識させることが必要

UXデザインとは

ユーザーエクスペリエンスのこと
ユーザーに体験させて意識づけること

例えば

美味しいご飯を食べて楽しい時間を過ごした

遊園地で遊んで幸せだったという体験

ユーザーが感じる体験や経験のこと

例えばユーザーが自販機でジュースを購入するまでの行動を分析する

UIだと

■ 熱い、喉が渇いた ↓

■ ジュースを買おう→ 購入のしやすさ パッケージをみる

■ さあ飲むぞ→ 飲みやすさなどを求める

UXとは

■ デザインが爽やかで飲みたくなる!

面白いデザインだななど

■ プシュッて音の爽快感などの体験

→潤った!また飲もうと思う体験

つまり

UIで

ユーザーにどんな体験をしてもらいどう感じるのか

UX

その為にどうすれば心地よく使ってもらえるのか設計する事

■UXを改善するには

人の体験を軸に設計する事

設計対象について

①インターフェイス
②コンテンツ
③コンテクスト

① インターフェース(ユーザーが検索した時の動き早さ見やすさなど)

■ どう見えるか

■ どう感じるか

■ ストレスはないかをもとに設計していく事がポイント

UXで大事なのはいかにユーザーにストレスをあたえないかという事

☑ ただ触っているだけで心地よいと思わせる感覚の提供・設計

 をすることが大切

☑ 何かを作るときストレスなく作る事が大切

例えば何かを検索した時にぐるぐる回って検索できないなどはNG

ユーザーの行動の意味をくみ取り仕組作りをする事

人と人とのコミュニケ‐ションではないからこそ

わかりやすくすることが大切

② コンテンツ作成のポイント

■ 見て満足

■ 知って満足

■ 感じて満足

感覚の中にある満足感の提供をすること

×テキストが多い

×ボタンの数が多いと見にくい

何が必要かの前に

何が必要でないのかを決めてコンテンツを決める事

こちら側が伝えたい内容とユーザーが知りたい内容に

差がないかも意識する事

情報量が多すぎるとユーザーにストレスを与えます

③ コンテクスト

Aという事象に対してプラスαの情報を組み合わせることによって

よりAの情報が鮮明になることがコンテクスト

例えばママおかわりちょうだい

どういう風景を思い浮かべるのか?

スナック 食卓 台所?→これがプラスαの情報

ここがわかると内容がより鮮明になる

コンテクストの購買までの流れ

クリックまたはタップすることで↓

ページが変わる↓

認知 共感 理解する(見る・知る・感じる)

情報見た時に↓

ワクワク 楽しいなどの感情がわいて満足する

アクション→ 購入するなど

これがコンテクスの物の流れ

一つの行動や感情には体験や行動が隠れている

コンテクストとは

☑ 無意識に利用させる

☑ 無意識に操作させて

購入までの流れを作る事

※想定外の感覚をあたえるのはNGです

例えば検索してページが変わったのに別の詳細が出てくるなどは

ユーザーの離脱につながります

UIを改善する

ユーザーの行動を考えてデザインすることが大切

操作感が大切 UIデザイン

■ 簡単である やれそうだと思わせる

■ 効率がいい 面倒くさくない

■ 一貫性がある 学習させる

■ できるではなくやれそう

例えばWEbサイトを開いたときに自分の目的の商品がさがしやすい

WEbページの下部から上部にワンクリックで飛べるなど

※ストレスをなくすこと

現在のデザインは何にでも見立てることができる

自由さと柔軟さがある

ここで注意なのは

×無理に見立てると誤解を招く

×時代の流れに影響されてしまう→他との差別化ができない

ユーザーの行動をみてデザインをする事

まとめ

ユーザーに意識させないで自然に行動させる事
ユーザーの行動を考えてデザインする事
ユーザーが探さなくてもボタンを押せるなど
行動に基づいて経験さえることがUX

まとめ

☑ ユーザーがどう触れてどう見て心地よく使ってもらえるのか
☑ 商品WEBも店舗もまずユーザーの行動を把握することが必要である

皆さんもUI&UXを意識してWEBサイト作成してくださいね。


~越智圭吾さんからの学びをアウトプット~




この記事が気に入ったらサポートをしてみませんか?