初めてデザイン業務を任された時に何から手をつけていいのかわからず、とりあえずFigmaを開いてはみたものの、 結局何も進まなかったのを覚えています。
その経験から、私と同じくデザインを作成する際に困っている人に向けて、まず何を考えればよいのかを書いてみました。
デザインを考え始める時に、いきなり「色どうしよう」「配置どうしよう」と考えてしまいがちですが、
最初に考えるべきなのは見た目ではありません。
まずは、
をはっきりさせることが重要です。
例えば、
あまりPC操作に慣れていない人なのか、操作に慣れている人なのか、
情報をサッと確認したい人なのか、じっくり内容を確認したい人なのか…
ユーザーによって最適な画面の作り方は異なります。
さらに、「この画面を見終わった時に、ユーザーがどうなっていれば成功なのか」を言語化してみると、デザインの方向性が定まります。
これらが曖昧なままデザインをしてしまうと、使いにくい画面になってしまいます。
これらのことから、デザインツールを開く前に、
「この画面で誰に何をしてほしいか」を書いてみることをおすすめします。
次にやるべきことは、載せたい情報をすべて洗い出し、優先順位をつけることです。
載せたい情報を全部並べようとすると、 画面はどうしてもごちゃごちゃして見づらくなってしまいます。
デザインをする時、「せっかく情報があるから、全部見せたい」と思いがちですが、
それらの情報を同じ強さで並べると、伝えたい情報が伝わりづらくなってしまいます。
そこで大事になることが、
の2つです。
最初にやることはシンプルで、載せたい情報を一度、全部書き出すことです。
この時点では、 「多すぎるかも」「画面に入るかな？」 といったことは気にしなくて大丈夫です。
とにかく、
など、思いつくものをすべて出します。
情報を書き出したら、次にどの情報を先に見てほしいかを考えます。
おすすめは、以下の3段階に分けることです。
例えば、
というように分けるだけでも、 画面構成の方向性がかなり固まってきます。
ここで初心者がつまずきやすいのが、優先順位だけつけて、情報をバラバラに配置してしまうことです。
そこで重要になるのがグルーピングです。
グルーピングは、「意味が同じ情報はひとまとめにする」「似ている情報は近くに配置する」の2点だけです。
（例）
通知のON/OFF、通知音、通知の頻度
→「通知設定」という1グループ
こうしてグループを作ると、
といったメリットがあります。
上記の①〜③を行うことで、
というように、「どのグループを、どの強さで見せるか」を決められるようになります。
これは単に見た目を整えるためではなく、ユーザーが迷わず情報を理解するための設計です。
ポイント1・2で考えた内容をもとに、次はいよいよ画面を作り始めます。
ここで大事なのは、最初から完成形を作ろうとしないことです。
どうしても、「ちゃんとしたものを作らないと見せられない」などと考えてしまいがちですが、
これは逆にデザインが進まなくなる原因になります。
色やフォント、細かい余白調整は後回しで問題ありません。
まずは、
といった画面の構造をざっくり作ります。
ある程度形になったら、
できるだけ早く周りの人に見せてみてください。
他の人から意見をもらうと、「ここわかりにくい」「どこを見ればよいかわからなかった」
といった指摘を受けることがあります。
最初は少し落ち込むかもしれませんが、
「より良いデザインを作るためのユーザー視点のヒントが増えた」ということです。
この段階で指摘が出るほど、デザインは良い方向に進むと言えます。
デザインは一発で完成するものではなく、
作る → 見せる → フィードバックを受ける → 直す
を何度も繰り返して、少しずつ良くなっていきます。
「ざっくり配置して周りの人に見せる」は、 デザインを前に進めるための効果的な方法です。
デザインをする時は、 いきなり画面を作り始めるのではなく、まず次の3つを意識します。
この順番を意識するだけで、 「何から手をつければよいかわからない」という状態から抜け出しやすくなります。