TOP /
できるIT活用 /
UIとUXの意味や違いは？UXを意識したWebサイト改善のポイントを解説

UIとUXの意味や違いは？UXを意識したWebサイト改善のポイントを解説

2020-07.30

Webサイトの制作や改善では、UI・UXが重要だとよく言われます。使いやすいサイトを作らなければいけないという意味であることは分かるけれど、両者の違いがよく分からない、という担当者もいるかもしれません。「UI・UX」とひとくくりに語られることが多い用語ですが、もちろんそれぞれ別の意味を持っています。それぞれをどう捉え、どのようにデザインすべきか解説します。

UIとUXの意味

UIとは

UIは、User Interface（ユーザーインタフェース）の略です。

ユーザーインタフェースという言葉は、Webサイトに限らず、昔からさまざまな分野で使われていました。例えばパソコンであれば、キーボードやマウスなどで使います。つまり、ユーザーインタフェースとは、機械やシステムを人間が使うための「接点」や「取次役」のことを表す言葉です。Webサイトであれば、Webサイトの内容やサービスをユーザーに理解させ、利用させる、さまざまな要素のことを言います。「内容がすぐに理解できる」「どこをクリックすれば何ができるか分かりやすい」「クリックしやすい」状態なら、良いUIだということになります。

UXとは

UXは、User Experience（ユーザーエクスペリエンス）の略です。

ユーザーエクスペリエンスという言葉は、比較的最近になって使われ始めました。UXでは、ユーザー体験全体を改善させようという考え方が重視されています。例えば、ページ自体は見やすいけれど、目的を達成するために何度もクリックして結局たどり着けないといった場合、UXに問題があると言えるでしょう。

最近では、Webサイトだけではなく、他のチャネルも含めた体験の心地良さまでデザインしようという企業もあります。例えば、商品自体の品質、商品が手元に届くデリバリーの品質、購入後のサポートまで、顧客体験の全体を向上させてユーザー満足度を上げようとすることです。

「いかに見やすく、使いやすくするか」と考えるのがUI、「いかに自社や自社商品を好きになってもらうか」と考えるのがUXと言うこともできるでしょう。

WebサイトのUXを決める要素

WebサイトのUXは、ユーザーがWebサイトを見つけるところから、目的を達成するところまでをデザインしなければなりません。要素としては、以下のようなものがあります。

アクセスしやすさ

いつでも、どこでも、誰でも見られるアクセスしやすさが必要です。具体的には、以下が挙げられます。

スマホ対応しているか
全ての世代に読みやすい文字の大きさか
ウェブアクセシビリティ規格に準拠しているか
ブランド名で検索順位が1位になっているか

Webサイトの見やすさ

見やすいWebサイトのためには、見た目のデザインを含めた以下が重要です。

レイアウト
クリック要素の大きさや分かりやすさ
内容の正確さ
表示の軽快さ

表示に時間がかかるとユーザーをイライラさせてしまいます。

Webサイトの使いやすさ

Webサイトの使いやすさとは、ユーザーが簡単に目的を達成できるかということです。そのためには、以下が重要です。

ナビゲーションが明確か
情報が適切にグルーピングされているか
入力フォームが最適化されているか

何度もクリックしてサイト内をウロウロしなくても目的が達成できるよう、分かりやすいナビゲーションや適切な情報構造、FAQページの整備が必要です。また、情報をカテゴリ分けする以外に、検索窓を設置する方法もあります。

入力フォームでは、ユーザーの手間を減らし、より短時間で正確に入力を完了できるようにしなければなりません。例えば、住所を自動入力する、エラーはどこが間違っているかを明確にするなど、「面倒」「よく分からない」といったストレスをなくす必要があります。

その他、Webサイトを安心して使うためには、しっかりとしたセキュリティ対応も重要です。

UXの観点で良いサイトとは、ユーザーがストレスなく目的を達成できるサイトのことです。美しい／かっこいいデザインでも、目的を達成できないWebサイトは良いサイトではありません。

Webサイト改善の進め方

UXの観点でWebサイトを改善するには、次のようなステップで進めていきます。

（1）達成すべき目的を明確にする

自社のWebサイトで、ユーザーにどのような行動を起こしてほしいか（どうなってほしいのか）をあらかじめ明確にしてWebサイトを構築することが必須ですが、それがあやふやであれば、そこから固めていきましょう。Webサイトのタイプによって、自社の情報を正確に知ってもらいたいのか、Webサイトで商品の購入やサービスの申し込みをしてほしいのか、ブランドや商品のファンになってもらいたいのかなど、さまざまな目的があるはずです。

（2）ユーザー像を明確にする

ペルソナやカスタマージャーニーマップもWebサイトを制作するときにあらかじめ設定しておく必要がありますが、明らかになっていなかったり、想定とずれがあったりするようなら、もう一度検討しましょう。

（3）課題を洗い出す

目的とユーザー像が明確になったら、課題を洗い出します。アクセスログなどを見ればすぐに分かる場合もありますが、きちんと考えて作ったはずなのにうまくいっていないということもあるでしょう。

そのような場合は、顧客満足度モデルを使ってチェックしていきましょう。「狩野モデル」「UXハニカム」「UXピラミッド」などいくつか種類がありますが、例えばUXピラミッドでは、UXを以下のように評価します。

レベル1：Functional（Useful）＝機能的である（ちゃんと使える）
レベル2：Reliable＝信頼できる
レベル3：Usable＝使いやすい
レベル4：Convenient＝便利である
レベル5：Pleasurable＝楽しい・心地よい
レベル6：Meaningful＝価値がある

さらにこれらのレベルを2分し、以下のように評価します。

Task＝目的達成可能（レベル1～3）
Experience＝心地良い体験（レベル4～6）

自社のWebサイトがユーザー体験をきちんとデザインできているかどうかを、これらに照らし合わせて確認しましょう。

（4）αテスト、βテスト

Webサイトの改善は、いきなり本番環境でユーザーに公開するのではなく、テストをしながら進めましょう。社内の別の部署の人に試してもらうだけでも、新たな気づきが見つかることもあります（αテスト）。もし可能なら、気心の知れた取引先や募集したβテスターで、本番公開前のユーザーテストをやってみるといいでしょう。それで問題なく動作することが確認できたら、本番環境に展開します。