Home > UI(インターフェース) > 規約や注釈など、「見せたくない要素」をうまく扱う画面設計 4つのポイント

規約や注釈など、「見せたくない要素」をうまく扱う画面設計 4つのポイント

久しぶりにユーザビリティねたを続けて。

企業のサイト特有の事情として、「ビジネス制約の関係から(載せたくもないものを)画面に載せないといけない」ことが多くあります。

具体的には

  • 事情を知らない誰か(※詳細はご想像ください)が、「これ入れないといけないだろう」と言う
    → そういう人に限って、最終決定の権限を持っていたりして、、、
  • 利用規約などの説明を延々行わなければならない
  • サービス紹介の過程で、どうしても自社が弱いスペックも見せざるを得ない

といったところでしょうか。

そこを何とかうまくやりくりするのも画面設計のスキル。
見せたいものと見せたくないものを両立させている画面を今日は紹介したいと思います。

1. 右カラムを有効活用する

Doda転職サポートお申し込みフォームの例です。

「利用規約などの説明を延々行わなければならない」を綺麗に回避したページ。
通常1カラムで組むフォーム部分の右側に規約を押し込めることで、ユーザが大量の文字に目を通すことなく、すんなりと入力させる仕組み。

そのために、敢えて右カラムを設置しています。

image

これは、注釈などをたくさん書かないといけないフォーム設計にはかなり使いまわしの利くテクニックですね。

Dodaでは、規約のフォントサイズを小さくすることで、さらにユーザがこの領域を見ないようにしています。

2. 改行を減らしてユーザビリティを落とすことで、ユーザに無視「させる」

綺麗にユーザに見やすい画面を作ると当然いろいろなものが読まれやすくなります。
その逆も然り。

改行のされていない文章は、可読性が低く団子状になっているため、領域全体としてスルーされる傾向が出ます。
見せたくないような部分は、変にユーザに配慮することなく、極めて読みづらい見せ方に終始するのもひとつの方法です。

 image

青で囲ったところは、簡潔な文章に加え、メリットを強調すしているのに対して、赤で囲われた最後の分だけその真逆。
訪問者は、平坦な長文なので読み飛ばします。

3. 厄介な領域は、グレー背景にする

これは、団子状の長文を作るのに似ていますね。
ユーザビリティを下げる方法です。

意図としては、背景をグレーにして文字と背景のコントラストを落とすことで、ユーザに「見たくない」と思わせる方法です。

コンテンツや画面の構成をいじる必要もないので、最も手っ取り早い手段でしょう。

4. 横線を見せたくない領域の上に走らせる

上から下へと進む目線の流れを横線で遮断することで、スクロールをストップさせ、そこから下の領域を意図的に殺してしまう方法です。

領域を区切ることで、ユーザ目線をブロックするイメージ。

image

うまく成立させるには多少のコツや感覚が必要ですが、慣れてしまうと非常に便利です。

その他にも、細かい手法は色々とあるかとは思いますが、こういう所でも成果には影響がでてくるので、対処法をしっていると便利なのではないでしょうか。

■ 関連エントリー

twitterRe:Tweet This!

Comments:0

Comment Form

コメントを表示する前にこのブログのオーナーの承認が必要になることがあります。

Remember personal info

Home > UI(インターフェース) > 規約や注釈など、「見せたくない要素」をうまく扱う画面設計 4つのポイント

Feeds

Page Top