スマートフォン対応時に抑えておきたいUI/UX

こんにちは。
大阪でWEBコンサルティングとWEB制作をしているワイズオフィスです。

今回はスマートフォンのUI/UXについて書きたいと思います。

UI/UXとは

そもそもUX/UIとはなんなのかという方のためにご説明いたします。

UXとUIとはそれぞれ別の言葉です。
まずUIとはUser Interface（ユーザー・インターフェース）の略で、サイトやサービスの見た目、使い勝手のことを指します。
一方、UXとはUser Experience（ユーザー・エクスペリエンス）の略で、サイトやサービスを使う側の人間にとっての「体験」に焦点を絞った考え方です。

先ほどUIの説明で使い勝手という表現をしましたが、使い勝手が良いことでユーザーが感動するという事象はUXに当たります。つまりUIがUXを作り出すための一要素となっております。

UIとUXは２つが似たような概念になっているので、現在ではこのように並行して使われることが多いです。
重要なことはこの２つの明確な違いを認識することではなく、サイトを作るときに「どうすれば操作しやすくなるか」「どうすればユーザーに美しい、楽しいと感じてもらえるか」を考えていく必要があると言うことです。

スマートフォンにおけるUX/UI

なぜスマホのUX/UIが重要なのか

ここでスマートフォンサイトの話に変わります。
スマートフォンの普及に伴い、スマートフォンのUX/UIを考える必要性が急激に高まってきているからです。

「うちはスマホ対応でレスポンシブにしているから大丈夫」

そう考えているサイト運営者にこそ重要な話なのです。

まず前提情報として２つのことを知っていただく必要があります。

現在多くのスマホ対応されたサイトは、パソコンサイトをスマホ用に並び替えたり、縮小したりしたものがほとんどです。レスポンシブとしてはこれである程度正解です。

ただし、スマートフォンのUX/UIの考え方からするとこれだけでは不十分で、それによってなかなか思ったような成果を出すことができていないサイト運用者が多くおります。

まずはパソコンとスマートフォンではUI/UXの考え方が全く違うこと、その違いを理解して、それぞれにそったUI/UXを実装していただく必要があるのです。

スマホのUX/UIの基本方針

まず代表的なPCとスマートフォンの違いを理解します。

パソコンの多い情報量をそのままスマートフォンに掲載してユーザーは読みやすいでしょうか。PCではきれいに見えるとしても、データ量が重い画像をスマホで見るとしたら表示が重くならないでしょうか。

パソコンとスマートフォンの違いを理解することで改善しなくてはいけないUX/UIは多く出てきます。
スマートフォンUX/UIの基本方針はこの違いを理解することから始まると考えていいでしょう。

抑えておきたい基本施策

１画面の情報量を減らす

スマートフォンはパソコンに比べて１画面に掲載できる情報量が多くありません。パソコンのサイトからそのままスマートフォンに変換した場合、見づらくなってユーザーは辟易としてしまいます。情報をコンパクトにまとめて読みやすいページがスマートフォンユーザーには好まれます。

リンクボタンのサイズを広げる

パソコンサイトのサイズ間のボタンの中には小さすぎて、スマートフォンでは押しづらいものがよくあります。人間の指が押しやすいサイズ感を考慮して、リンクボタンを設置した方がクリック率は向上いたします。

コンテンツに緩急をつける

スマートフォンは１画面の情報量が少ないため、パソコンに比べてスクロールのスピードが速くなってしまいます。そのため単調なコンテンツ配置だと押し出したいコンテンツが見落とされてしまう可能性が高いです。
サイズや色、形によって緩急をつけることで、ユーザーの興味を引いていきましょう。

入力情報は限りなく少なくする

キーボードでは簡単に入力できることも、スマホフリック入力では苦労することは多いです。問い合わせフォームなどはできる限り入力項目をシンプルにして、チェックボックスやラジオボタンなどで対応できるよう設計することをお勧めいたします。

電話ボタンを設置する

スマホサイトの場合は、そのまま電話に移行できると言う大きなメリットがあります。電話をコンバージョン地点にしているサイト運営者であれば、電話ボタンの設置をお勧めいたします。コンバージョン率の向上に大きく寄与できるでしょう。

まとめ

いかがでしたでしょうか。
スマートフォンの普及によって、サイト運営における重要性はパソコンサイトを超えている業界も多く出てきております。その中でスマートフォンサイトのUX/UIを考え直していきたいサイト運営者はぜひ当社にご相談ください。