nayo*days

カナダのバンクーバーで英語&webデザイナーしてるkayokoのブログ

Month: 5月 2011

デザインを早く仕上げるには?

デザイナーってかっこいい気がしますが、仕事でのデザインは納期が一番大事。
クオリティよりも、クライアントが求めるのは時間内に作業を完了させることです。
ではどうしたらデザインを時間内に効率よく終わらせることができるのでしょうか?
今の会社で、先輩から教わった効率よい方法をまとめていきます。

1.ワイヤーフレーム(手書きラフ)の作成

ワイヤーフレームといってwebのレイアウトやらを決める「設計図」をまず組み立てましょう。ソフトとひたすらにらめっこしてレイアウトを決めるより、事前にざっくりでもレイアウトを決めてしまうと、スタートが早くなります。
手書きのラフで構いません。まずは情報をまとめ、整理します。
ファーストビュー(ページにアクセスした際に、ユーザの目に入る画面の範囲のこと)ではどこまで見せたいのか?などを考えながら、レイアウトを決めていきます。
ただ代理店経由からのお仕事などの場合、先方がワイヤーフレームを組んでてくれて、それをデザインにおこすパターンが多いので、ここの説明はここまでにします。
気になる方は、便利なツールなどがあったりするので調べてみてくださいね。
ワイヤーフレームに使える素材いろいろ | DesignWalker

2.スタートから完璧にせず、まず要素を入れる。

ワイヤーフレームが上がったら、テキストなどの要素をすべて埋め込んで入れていきましょう。もし写真も決まっていたら、写真も入れていきます。

この時大事なのは、はじめの時点で作り込みをしないこと。

私がよく陥ってたパターンですが、要素をいれこんだ順番で作り込みをしてしまい、後から時間が足りなくなってしまうことがありました。
すると、

  • デザインも中途半端
  • 納期もギリギリor間に合わない
  • グダグダで終了

↑上記のパターンが繰り返されてしまうわけです。。。
なので、はじめは、テキストなどの要素だけを全部いれましょう。

3.各箇所のレイアウトの決定

メイン画像、バナーなどの写真の位置と、コピーなどのレイアウトを決めましょう。
写真の配置や素材によってバランスが変わるため、ワイヤーフレームで分からなかった部分のレイアウトをここで決定します。また文字の訴求部分とコピーとのバランスで、テキストのサイズに変化をつけたりします。文字については↓のサイトとか参考になりますよ~

[Webデザイン] 文字組みについて本気出して考えてみた :: Stocker.jp / diary

4.全体の要素のレイアウトが決定して、はじめて色つけやデザインの細部へ。

全体のレイアウトが確定して、ここではじめてデザインにとりかかっていきます。
このときもですが、1箇所づつをするのでなく、全体的にデザインをつくりこんでいくと、偏りなくまとまったデザインに仕上げることができます。

最後に

簡単にざっと書きましたが、こんなかんじでデザインしていけば、デザインのスピードがあがると思います(私自身、まだまだ作業は遅いので、実践中)
あと私の場合、会社の先輩に1/3できたあたりでデザインの方向性があってるか否かを確認することがあります。自分の思い込みでデザインの雰囲気をつくりこんでしまった場合、先方が思うデザインと全く異なってると…1からのやり直しになってしまうからです。(実際にそれで大きく時間をとってしまった経験がある)

効率よくデザインをしながら、素敵なサイトをつくりたいと思う日々ですw

wordpressやってみる!

webデザイナーのnayo74ことかよこです。
デフォルトのデザインのままではありますが、ブログをWPで始めることにしました。
また時間がさけるときに、デザインもしていこうと思います。
よろしくですー!

また時間あるときに補足していきます(。→㉨←。)!

Powered by WordPress & Theme by Anders Norén