目的次第でWebデザインの方向性は変わる。成果が必要なサイトならUIが大事。

使いやすいUIの追求

Webサイトには2種類あって、ビジュアル(見た目)重視か成果重視かという目的に違いがあると思っています。 最近はスマホ案件がかなり多いですが、UI設計に携わるデザイナーとして、それぞれの目的とデザインについて考察してみようと思った次第です。

ビジュアル重視のサイト

運用よりも存在していることが主目的なサイトです。会社サイトやポートフォリオサイトで稀に見かけます。
こういう依頼では、美しさやインパクトが求められるので、望みのデザインを望みの通りに納期の通りに納品すればよし、となります。

極論を言えば、サイトの表示速度とかテキストやボタン、リンクなどの視認性はどうでも良く、使いやすさについてはほとんど考慮されていません。

もちろん全てではないですが、スマホ用にレスポンシブ化していないところやFlashでごりごりのサイトもまだそれなりの数ありますよね。

成果重視のサイト

  • EC
  • Webサービス
  • ブログ

サイト運用による効果が全てなので、デザイン的な美しさやデザイナーのこだわりよりも、来訪者を意識したサイト構成と使いやすさを実現できるのかが重視されます。

これは美しさを完全に無視するという意味ではなく、あくまでもUIありきでデザインできるのかということ。なので、自分本位のデザインではなく、来訪者の視点でデザインできないとダメだということです。

そもそもデザインとは

Google様に聞くと以下の回答が返ってきました。

設計。図案。意匠。また、製品の機能や美的造形を考慮した意匠計画。

これに当てはめると成果目的のサイトは、製品の機能を考慮したものと言えそうなので、使いやすさを追求したUI設計ができなければいけません。
とはいえ、自分の知る限りUIに精通したデザイナーはまだまだ少なく、できる人は重宝されて引く手数多です。

来訪者がどう思うのかを考える

フリーランスになってすぐの頃、社労士サイトの制作依頼があり、こんな会話をしました。

「他と差別化するために極限までおしゃれにしたいので、トップページ開いたらキャラクターが右端から中央に向かって歩いてきて、センターまできたらロゴを出して欲しい」

「集客のためにサイトを立ち上げるんですよね?」

「そうです。お問い合わせで新規を獲得したいです。そのためにはインパクトが必要だと思うんですよ」

「アニメーションが終わる頃に来訪者は帰っていますよ。ちなみにどのような方を集客したいのですか?」

「問い合わせしてくれれば誰でもよいです。」

一部抜粋していますが、この考え方では「来訪者が何の目的で訪れるのか」という点が不足しています。例えば、検索流入の来訪者なら知りたい情報を求めているはずでアニメーションを見ることが目的ではありません。

差別化して独自性を出すのは良いことですが、その結果求めている情報へなかなかたどり着けない、となるとデメリットです。このように「誰が見るのか」を考えないとただの自己満足になってしまいます。

これはクライアントの場合ですが、同じような発想のデザイナーもいます。自分がディレクションしていた時に、コンセプトシートにまとめているにも関わらず感性的デザインを提出されて、アゴが外れかけたことがあります。

成果を出すサイトの場合は、来訪者の気持ちになってデザインを行なわなければいけません。例えば、以下のような観点です。

  • 目的の場所にたどり着きやすいか
  • 文字サイズや文字間は読みやすくなっているか
  • クリック / タップが可能と理解できるか
  • 適切な余白が取られているのか
  • 色彩のバランスが良いか
  • これらがスマホでも出来ているか

つまりは「使いやすさ」です。その点では先日書いた記事ですが、ハンバーガーメニューはやっぱりダメも同じだと思います。

フリーランスなら特に効果を意識する

自分は現在3社を継続的に見ており、新規は月2案件が限界です。継続案件は最大5社まではあるのですが、手一杯になり過ぎてレスポンス良い対応ができなかったので、今のバランスに落ち着きました。

フリーランスにとって案件ごとに成果を出すことは、次の案件や紹介につながる一番の営業です。なので、継続してもらえれば、効果を見て適宜デザインの修正や追加を行います。

例えば、自分の場合は効果をより意識するために以下を実践しています。

  • アナリティクスを頻繁にチェックする
  • A/Bテストやユーザビリティテストの知識を深める
  • 自分のサイトで検証したり、過去事例からノウハウを蓄積する
  • 気になる事は徹底的に調べる
  • 書籍をたくさん読む

デザインとは直接的な関係がないように思えるかもしれませんが、「来訪者がどう思うのか」を想像する力を養うという点において役立ちます。

使う人のことを徹底的に考えよう

  • スマホ率が高くなっているのに、PC表示にばかりに目がいっていませんか?
  • フォームに不要な項目がありませんか?
  • 挙動に関わるようなアニメーションはありませんか?
  • サイトの表示速度は十分ですか?
  • 信頼や安心を十分に伝えられていますか?

デザイナーに必要なのは「誰が何のために使うのか」というUIに集約されます。なので、デザイナーだからこそ、自分が来訪者の視点を持たなければいけません。その時には競合のサイトも同じように見て、良い点と悪い点を書き出すと良いです。

他と比較した時に、競合サイトを見て「こういう表現なら安心できるな」と思ったポイントこそ、今のデザインに足りていないところかもしれません。

マーケティングと書いていますが、Web制作に関わるのであれば必見です。SWOT分析とか、ソーシャル運用とかの解説もすごく丁寧で、かつ漫画仕立てなので、一気読みできます。

Webコンテンツとしても公開されていますよ。

沈黙のWebマーケティング - Webマーケッターボーンの逆襲 -

これ、ストーリーもちゃんとしているのがすごい。

関連記事