デザインには整理整頓が必要

Webデザインは、いきなりレイアウトを考えることから始まるわけではありません。
まずはお客様やディレクターの意図を理解し、情報を整理することが大切です。
この記事では、情報の優先順位のつけ方からレイアウトの組み立て方まで、私が普段のWeb制作で意識している考え方を紹介します。

情報を整理する

お客様からいただいた資料、ディレクターのWF・指示書を把握しましょう。

情報・素材の確認と理解

単に内容を把握するだけでなく、お客様の要望・ディレクターの意図を汲み取り、理解する。
ここを蔑ろにしてしまうと、製作後にズレが生じ、修正・リテイクの繰り返しになってしまう。

情報に優先順位をつける

写真、資料、数字、人物、商品、サービス、キャッチコピー沢山の情報から何を伝えたいのか?何を見せたいのか?を精査します。

何を一番伝えたいのか、何を一番見せたいのか。

私が店舗・サービス系のデザインで目安にしている3点

  1. 商品 or サービス
  2. 人物(代表、職人、シェフ、担当者)
  3. お店(建物、内観、立地)

この3つから何が一番かを選定します。

王様を決める

強みの部分を最大限アピールします。
例えば

こだわった料理を見せたい

【 商品 】
料理が王様

有資格者によるエステ施術

【 人物 】
施術担当者が王様

海が見えるホテル

【 お店 】
立地が王様

商品 or サービス売れている・実績のあるサービスや、独自のサービスなど、欲しくなる・使いたくなる商品
人物有資格者、経験豊富、メディアに掲載されたなど、この人に会いたい・任せたいと思わせる人材
お店駅近、観光地、外観・内観がおしゃれ等、ここに行きたいと思わせる場所

レイアウトを組み立てる

Webサイト、バナー広告、チラシ等作る媒体で多少は異なりますが、
大まかに以下の4つのパーツの組み合わせが多いです。

  • 写真
  • キャッチコピー
  • 文章(説明・数字)
  • 装飾(あしらい)

例)飲食店でも目的でレイアウトが変わります

とにかく安い!多い!

【 キャッチコピー 】
価格・数字を大きく

コース料理

【 写真 】
料理を大きく

健康食品

【 文章 】
メリットを大きく

見やすさ・使いやすさを意識して調整

最終的にホームページ、チラシを見るのは、お客様ではなく一般のユーザーです。
使う、見るユーザーの目線になって以下の点を調整してください。

  • 文字サイズ
  • 配色
  • 余白
  • ボタン
  • 導線

まとめ

  1. いただいた資料・指示書を把握する
  2. 王様を決めて、情報の優先順位を付ける
  3. 見せたいもの、伝えたいものを大きくレイアウト
  4. ユーザー目線で調整