ぐわぐわ団

読んで損する楽しいブログ

【ぐわぐわ団流】タイトルロゴの作りかた

みなさまはお気付きだったでしょうか。ぐわぐわ団のタイトルロゴがこっそり変わっていることを。8月28日の月曜日にしれっと変えてしまいました。

f:id:make_usagi:20170828070959p:plain

大したことはないのですが、どのようにしてタイトルロゴを作っているかを包み隠さず書いてしまおうと思います。使うのは iPad Pro と iMac です。

Zen Brush 2

Zen Brush 2

  • PSOFT
  • エンターテインメント
  • ¥360

 まず、うさぎさんとごみちゃんを描かないことには始まりません。「Zen Brush 2」というアプリを使って、筆で書いたような絵を描きます。

ぐわぐわ団のアイキャッチ画像も、ほとんど「Zen Brush 2」を使って描いています。設定の「傾きの感度」をオフにできるようになってから、Apple Pencil との相性がめっちょこよくなっています。書き直しが5回までとか、いろいろと制限も多いアプリですが、しれっと描くには本当にいいアプリだと思います。

こちらで描いたうさぎさんとごみちゃんをアイコンとして使えるように……

わかりやすいように背景を灰色にしていますが、この灰色の部分を透明化します。これも iPad Pro で加工します。Photoshop、持ってないんです。

背景透明化 for iPad

背景透明化 for iPad

  • handyCloset Inc.
  • 写真/ビデオ
  • ¥120

まんま「背景透明化 for iPad」というアプリを使います。こちらですが、画像を選んで、背景透明化をするだけです。ちっとも難しくありません。

ほぼ自動でできてしまいます。ごみちゃんの手の部分だけ手動で修復する程度です。

背景が透明化されたPNG画像のいっちょあがり。これができたら、タイトルロゴは8割完成と言っても言い過ぎではありません。

今回はネタを挟んでいる暇がないので、次々いきましょう。iPad Pro から iMac に作業の場を移します。画像のやりとりは Googleフォトを使っているので、ほとんど意識していません。

Art Text 3

Art Text 3

  • Belight Software, ltd
  • グラフィック&デザイン
  • ¥3,600

私が持っているのは「Art Text 2」なんですが、それはそうとして。Photoshop を持っていないので、とりあえずなんか欲しいなと思って使っています。 

この「Art Text 2」、タイトルロゴやアイコンを作るために特化したソフトで、そんなに難しくありません。日本語対応していますし、どのレイヤーの作業をしているかもわかりやすいです。こういうソフトはとにかく「使って慣れる」が大切。Photoshop と違って、できることもしれてますので、とにかく慣れれば勝ちだと思っています。ここにきて急に説明を投げっぱなしジャーマン。

iMacのスクリーンショット!こんな感じでブログを書きながら、Twitterを見ながら、タイトルロゴを作ります。雑なことを。

ぐわぐわ団のフォントは「チカラヨワク」というフリーフォントを使っています。

851チカラヨワク配布だす

こちらからダウンロードできます。ふにゃふにゃのフォントがぐわぐわ団にぴったり。タイトルロゴを作るにあたり、とにかくどのフォントを使うかがポイントで、

これだと怖いし……

なんかデザインが凝り過ぎてて、これまたちょっと違うし……

これなんかはちょっといい感じかもしれませんが、とにかくいろいろと試してみることをオススメします。有料のフォントを使うのもアリだと思いますが、フリーフォントでもすごくいいのがたくさんありますから。

フリーフォントで簡単ロゴ作成 | キーボード画像作成 | アイコン・はんこ画像作成

こちらのサイトをよく使っています。なんでも試してみるのが一番。

そして、タイトルロゴ画像を作ったら、後は設置するだけですが、何もせずにアップロードしても、iPhoneで見たら画像の両端が切れたりするので……

mshitech.hatenablog.com

こちらを参考にCSSに一筆添えましょう。ありがたいことです。

そうそう、画像のサイズは「1,000ピクセル × 200ピクセル」で作りました。前は「500ピクセル × 85ピクセル」で作っていたのですが、いまいちピンボケになるので、サイズを大きくしてみたところ、なぜか線がピシッとしました。よくわかりませんが結果オーライです。

f:id:make_usagi:20170409202211p:plain

前のタイトルロゴ。比較してみましょう。

f:id:make_usagi:20170828070959p:plain

なんとなく違いがわかるかな?ピシッと感が出るぶん、画像のサイズも大きくなっていますが、それはもう仕方のないことです。

以上、ぐわぐわ団のタイトルロゴの作りかたでした。合掌。