TOP UX ユーザー動線 ダミー要素は危険!テキスト画像もUIデザインの重要な要素

ダミー要素は危険!テキスト画像もUIデザインの重要な要素

文字や画像もUIデザインの要素

ユーザーは、”コンテンツを見る・読む”ためにサイトに来ています。レイアウトのデザインを見るためにサイトに来ていません。UIデザインの要素で、色やアイコンや書体が重要な要素であるように、画像やテキストもUIデザインの重要な要素です。

コンテンツ内容からデザインが決まります。つまり、ダミーテキスト・ダミー画像では、しっかり情報設計できないのです。

ダミーデータのデザインを完成品としていないか?

とあるUIデザイナーの方が、メルカリのUIを同じように作成するトレーニングを記事にしていました。
デザインツールの操作を覚える意味では良いですが、「デザイン(設計)を学ぶ」という点から見ると、ダミーデータでデザインを完成図としてしまっていることが、意識の落とし穴になっています。

ダミーデータを使うと手早く体裁の整ったデザインが出来るため、デザイナーやチェックする関係者の人にとって違和感がないかもしれません。

しかし、具体的にどんなデータが入るのか想定せずにデザインを作ると、検討から漏れるユーザー心理があります。

  • ユーザーはそのコンテンツから得られた情報のどこで心が動き、次の行動を起こすのか
  • 一覧で出る場合、ユーザーは情報を見比べて望ましいものを見つけられるだろうか
  • 画像の中のどんな要素を見て、ユーザーは情報を読み取るのか

このように、具体的なコンテンツがなければ検証できないことがあります。

ダミーテキストが制作現場で一般化してしまうと、無意識に非現実的な前提でデザインしてしまうことがあります。どのような画像が登録されるか、画像は必ず登録されるのか、ない場合はどうなるのか等、コンテンツ登録・配信側のビジネス・技術の仕組みをUIデザインの時点でしっかりと確認しましょう。

情報設計して実データでレイアウトデザインする

レイアウトデザインの前に、どのようなコンテンツがユーザーにとって必要なのか、まずは、情報設計を行いましょう。

UIデザインの早い段階から、実際のコンテンツを使ってデザイン制作を行うと、ペーパープロトタイピングの段階でユーザビリティテストも実施できます。

早い段階でユーザビリティテストを行うことができれば、改善も早くできます。

レイアウト講座受講で意識が変化した

私はスタッフですが、UX DAYS TOKYOで開催している講座にも受講して日々勉強しています。「UX視点でのサイト改善検定講座(レイアウト編)」に参加して、ダミーテキスト・画像が駄目ということを学びました。

受講するまでは、ダミーテキストや画像を使ってレイアウトデザイン制作していることがありましたが、たとえペーパープロトタイプであってもリアルに入るテキストを利用しないと駄目だということを痛感しました。

その結果、コンテンツがUIの重要な要素であると強く意識するきっかけになりました。今では業務でも実際にどんなコンテンツがユーザーに必要だろうか?という情報設計を先に行ってから実データを使ったレイアウトデザインをして、よりユーザーに伝わるデザインを心がけています。

受講終了後に課題提出したものを添削してくれるので、UX視点が身についているか確認できます。
私は普段からUIデザインをしていて、ある程度は出来ているつもりでしたが、細かく課題添削していただいたことで、自分に視点の抜け落ちがあったことが分かりました。
自分のできていない部分に気づいたことで、日々のデザインで気をつける視点が増えたことがこの講座に参加した大きな収穫です。

私が関わっているプロダクトメンバーにも同じ認識を持ってもらうために勧めて参加していただいています。
https://uxdt.connpass.com/event/87049/

参考記事

スタートアップでデザイナーとして調査、UX設計、UIデザインとフロントエンド実装をやっています。UXも技術も日々勉強中!趣味は片付け、インテリア小物とゲームです。

まずは言葉を覚えよう

「UX用語」のカテゴリー

UXを取り入れるためのマインドセット

「UX格言」の新着

UX格言 一覧

現場の声をリアルで届ける

動画で学ぶUX 「You X Tubo(ゆーえっくすつぼ)」の新着

You X Tubo(ゆーえっくすつぼ) 一覧