万人が好きなUIはないけれど、万人が嫌いなUIは存在する。 まずは万人が嫌いなUIを排除しよう。

1. そもそもUI・UXとは
赤点を減らすためのウェブサイトUI設計
UI（ユーザーインターフェース）
ユーザーと接触する面。アプリケーションは基本的に、ディスプレイを通じてユーザーとコミュニケーションを行うので、主にデ
ィスプレイを指すことが多い。広義で言えば、Siriの話し方なんかもUIに入ります。
UX（ユーザーエクスペリエンス）
ユーザーが得られる経験。ディスプレイやフォルムから受ける視覚的な情報はもちろん、使用していると
きに感じた喜びや、ストレス、使い終わった時の満足感などユーザーがサービスを通して受ける経験すべ
てを指します。
初めて使った人が使いにくいと感じたり、商品を注文した時の販売者の対応が悪かった、など見た目以
外のサービスの部分もUXの対象です。
UXデザインという言葉は、製品やサービスの総合的なデザインのことを指します。
UXデザイナーは市場調査や、ユーザー調査、データ解析などを行うので、
一般的にデザイナーと呼ばれている人よりも、マーケッターに近いです。

2. 赤点を減らすためのウェブサイトUI設計
UX
UI 使いやすさ
購入時の対応学習コスト
の低さ
つまり、UIはUXを構成する中の一部分です。
UXの良さは製品の良さ、ひいては売り上げに直結
しますが、UIはその一部分のため、UIを良くしたか
らといって、すぐに素晴らしい反応が得られるとは
限りません。
ある製品が良いUIだったとしても、それが良いUX
をしているとは限らないからです。
しかし、良いUXであるためには、良いUIであるこ
とが必要です。
ですので、まずは目に見えるUIを改善し、それと同
時に他のユーザーメリットを高めて製品のクオリテ
ィを上げることが大切です。
今回はそのUIを良くするための、具体的な改善例を
紹介していきます。

3. 赤点を減らすためのウェブサイトUI設計
1.ユーザーがミスを犯しやすいデザインを作らない。
少しのカーソルずれで項目が変わってしまうようなナビゲーション
ドロップダウンメニューを作る際は、高さや横軸を合わせて、並行移動した場所に項目を作り、
斜めにカーソルを動かして項目がずれるというようなミスを減らす。

4. 赤点を減らすためのウェブサイトUI設計
カルーセルのバナーはマウスオーバー
している間は、切り替わらないようにする
項目が多いカルーセルバナーは
サムネイルを出して何があるのかわかりやすく。
1.ユーザーがミスを犯しやすいデザインを作らない。
ユーザーのトップページ平均滞在時間は30秒程度。
その中でずっとカルーセルを見ているわけではない。
1枚あたり5秒程度とすれば6枚以上のカルーセルはほとんど意味をな
さないし、4枚目以降は基本的に見られていないと考えて良い。

5. 赤点を減らすためのウェブサイトUI設計
2.ウェブサイトやアプリケーションの利用シーンを考えて設計する
ライトユーザーへの配慮をする ユーザーが使いたいタイミングを考えて
要素を配置
検索結果と行き来することが多いAmazonでは、ブラウザのボタン以
外に戻るボタンがページの上の方に用意してある。
詳細ページを見終わった後に他のページへの導線が準備されている。
目的のページを見終わった時に自分が今どこにいるかわかるように、
パンくずリストをフッターに配置している。

6. 赤点を減らすためのウェブサイトUI設計
2.ウェブサイトやアプリケーションの利用シーンを考えて設計する
適切なタイミングでのレコメンド 登録フォームやお問い合わせを終了した後の
アンケートや次のステップへの導線

7. 赤点を減らすためのウェブサイトUI設計
2.ウェブサイトやアプリケーションの利用シーンを考えて設計する
主に使うユーザーは誰かを考えてページ設計。
ソニーと入力して一番に出てくるのは、ソニーの企業ページではな
く、ユーザー向けのプロダクトトップページ。
法人やステークホルダー向けのページは別途用意して総合トップには
しない。

8. 赤点を減らすためのウェブサイトUI設計
3.システムでできることはユーザーにやらせない
入力フォームの全角、半角等自動補完
難しい場合は、最低でも記入例を書いておく。
非常に多くのリツイート。
共感する人がとても多い証拠。

9. 赤点を減らすためのウェブサイトUI設計
3.システムでできることはユーザーにやらせない
エラーが発生した場合は、どうすれば良いのかを
伝える
エラーが発生していることを伝える、解決策を提示しない状態だと、
ユーザーはどうすれば良いか分からず、同じエラーの繰り返し、また
は離脱を選択してしまう。ある程度エラーを絞って解決方法を提示す
る。

10. 赤点を減らすためのウェブサイトUI設計
方法論
自分で操作してみる。
関係ない人に見てもらってレビューしてもらう。
詳しくない人に渡して意見を聞いてみる。
ユーザー視点に立って、考えることが重要！
（非常に難しい。）