「勝手に! NGワード診断」 Facebookアプリデザイン | ウープスデザインブログ (デザイナーまめこ)
で「NGワード」というのが伝わりやすいように口にバツマークをつけたイラストを作りました。
タイトルロゴを作る
タイトルロゴは、ロゴデザインの中でも作る機会が多いですし、業務のなかでも毎日のようにやる作業だと思います。
ここではノンデザイナーさんや駆け出しの方に向けて、「それっぽくなる」タイトルロゴ作りのコツを紹介します。
言葉に優先順位を
文字の組み方は以前の記事で紹介したように優先順位をつけていきます。
[woops!] タイポグラフィが苦手な人におすすめしたい私のやり方 
まずは画像の上にあるように、Illustratorでそのままタイトルを入力します。
次に文章を読みながら、言葉ごとに分けていきます。「勝手に」「NG」「ワード」「診断」と分けました。※「2013」は途中でナシになりました。
メインとなる文字を組んでいく
この文章の中で一番重要なのは「NG」と「ワード」です。診断アプリのコンセプトを伝えるものなので、ここの見た目をしっかり作ってから、他の言葉を合わせていきます。
「NG」はCentury Gothic。そして「ワード」はロダンにしています。なんだか現代的な感じがします。
細い見た目で「NG」と「ワード」に変化をつけようとしたのですが、そこまで小分けにしない方が読みやすいかも…？
フォントのウェイトを変えて、太さを揃えました。
そいで軽く文字詰めとサイズ調整。Gとワはもっと詰めても良かったですね。そして「ー」はもう少し下でも良かったかな…。
欧文・和文の混色もウェイトを揃えてしっかり文字を詰めるだけでそれなりに見えてきます。
他の文字を作る
「NGワード」だけ色を変えることで目立たせます。後ろに続く「診断」は同じ調子で組みました。
小さい文字は斜めにして変化を
「勝手に」の文字はオマケなので小さくして斜めにしています。傾けたのはわたしのクセでもあるんですが、真っ直ぐのままより変化が出るのが好きです。
完成です。
「NGワード」の前にイラストを追加してインパクトを出しています。それっぽく見えますかね？
関連エントリー
-
本のコンセプトが分かる「はじめに」を一部抜粋公開します。「スマートフォンデザインでラクするためには」
編集を担当してくださった技術評論社の傅さんは本屋めぐりを一緒にしてくれます。本のプロと巡ると今まで見ていた本棚が宝の山に思えてきてとても楽しいです。 そこで一番心に残ったのは必ず本の「はじめに」をチェックするということで…
少しでも役だったらシェアしたり、コメントもらえると記事を書くモチベーションが跳ね上がります！
タイトルロゴを作ろう！その１：ウェイトを揃えよう | ウープスデザインブログ (デザイナーまめこ) http://t.co/tT7Pej56OU
ためになるなー。/タイトルロゴを作ろう！その１：ウェイトを揃えよう | ウープスデザインブログ (デザイナーまめこ) http://t.co/tOLWjt8sET
メモメモ。 タイトルロゴを作ろう！その１：ウェイトを揃えよう | ウープスデザインブログ (デザイナーまめこ) http://t.co/4ZYaXnigYb
タイトルロゴを作ろう！その１：ウェイトを揃えよう http://t.co/sxsxEwU4zA
タイトルロゴを作ろう！その１：ウェイトを揃えよう | ウープスデザインブログ (デザイナーまめこ) http://t.co/as9IsD1n74
タイトルロゴを作ろう！その１：ウェイトを揃えよう | ウープスデザインブログ (デザイナーまめこ) http://t.co/oVI4g7iZTP