ロゴマークデザインの方法
自分のブログのロゴを作ったので、制作工程をまとめました。
色々な作り方があるとは思うのですが、自分はこういう風に作っている、ということで参考になれば幸いです。
目次
作成作業
1.構想を練る
ブログの名前の由来はkuichi.hatenablog.comに書いてある通り、下記です。
新しいのブログ名は「トワイライツ・ノーツ」です。英語にすると「Twilights Nauts」……割と語感とタイトル文字の感じ優先で決まりました。
『lunar-nauts(月面探索者)』をもじってます。
また、たそがれ空のような一瞬の緊張感と美しさのある仕事ができればいいなあと思っています。
ここから要件を出すと、『たそがれどき』という辺りから、
- 空をイメージさせる
こういったあたりを盛り込みたいと考えました。
2.他の方の作品を見て情報収集をする
Googleに「ロゴ」と打ち込んで画像を検索すると、企業のロゴなどをたくさん見ることができます。
脳に刺激を与えると共に、世間一般で「ロゴ」といえばこういうものを指すんだろうなあということを考察する方がメインです。
情報収集しながら、「いいな」と思ったロゴについて共通項をまとめます。
今回の場合は大体3つの要件を満たしていました。
- 単色でも使える形
- 少し離れて見ても「そのロゴ」と判別できる
- テキストロゴではない
この方向でアイデアを出していくことにしました。
3.手書きラフ
とりあえずはイメージ出しということで、構想で出した「空」「すっきりしている」を軸として手書きで色々描いてみます。
「たそがれ」も表現したいということでグラデーションをつけた案や太陽が沈みかけている案も出しましたが、「空」から連想した「星」を描いたことで一気にイメージがまとまりました。
星があって、山や町並みのシルエットがあれば、「空」と「たそがれ」がいっぺんに表現できるのでは?
という訳で次に描いたのがこちら。
星の下に連なる山っぽいシルエットを描き、これいいんじゃないかなと思ったので調整。
この段階でブログ名も横に描いてみます。
ただ星が主題ではないので、星を真ん中から端に寄せて微調整。
描いている内にこの山の形が「波」のようにも思え、「たそがれどきを訓練された船員のようにさらりと渡って」というイメージにもぴたりと合致し、これでほぼ決定です。
4.パソコンで清書して完成
ロゴとして使う以上、今後のことも考えてAdobe Photoshopで清書しました。
(本当はAdobe Illustratorの方がいいのですが、私はWeb業界にいたのでPhotoshopの方が使い慣れているのです)
手書きをスキャンして下描きにしても良かったのですが、私は絵が描ける訳ではないので、バランスを取るために黄金比を使って清書しました。
使用したのはカスタムシェイプツール、パスツール、ブラシ(よー清水さんの本「ファンタジー背景」描き方教室 Photoshopで描く! 心を揺さぶる風景の秘訣 (Entertainment&IDEA)に特典でついていた黄金比ブラシを使用しています)
これで基本ロゴの完成です。
5.使用用途別に展開
基本ロゴはできたものの、使用する媒体によってロゴに調整を加える必要があります。
たとえばTwitterのロゴとして使うのであれば、正方形に調整した方がいいし、ブログのヘッダーならブログ名もロゴの横などにつけた方が良いでしょう。
という訳で、基本ロゴを元に下記2点を作りました。
ブログヘッダ用
ブログタイトルの「さらり」のイメージに合わせて書体はゴシック体のすっきりしたものを選んでいます。
しかしこれだとレスポンシブサイトでスマホ表示になった時文字が小さくなりすぎるかも知れないので、下記のような案も作りました。
正方形(丸用)
正方形(或いは正円)に収まり、かつバランスが悪くならないように星を大きくしたり、山の高さや角度を調整しました。
ここでも黄金比を使っています。
ブログアイコンで小さくなっても見えるので(ブラウザ上のタブの部分)、良くできた方かな、と思います。
まとめ:デザインは構想・情報収集・理論・ひらめきの四本柱
以上が私のロゴマークデザインの方法です。
出発点の構想を練る(要件定義)ところが一番大事で、ここで方向を見誤ると失敗しがち。
あれもこれもと出し過ぎないで、できるだけシンプルに絞り込んでしまうのが重要。
企業で言えばミッションとかビジョンの部分にあたります。
情報収集が足りないとひらめきも生まれづらいですし、ひらめきをわかりやすい形に整理するのは理論。
私がデザインするときは大体こんな感じです。
書籍紹介
ちらっと出た黄金比ブラシですが、こちらの本の特典としてついています。その他のブラシも非常に使いやすいので愛用中させていただいています。