ひさろぐ

だらだら、ぼちぼち。

イラレで同人誌のロゴを作るマン

こんばんは氷雨です。

普段からたまに表紙頼まれたりノベルティ作ったりしてます。

 このツイートが伸びた。ビビるほど伸びた。半年以上経ってもまだ通知くる。

 

正直専門書てきとーに買えばこういうのいくらでも書いてあると思うんだけど

まぁもっと分かりやすく広まってくれたらそれはとっても素敵だなって。

 

んで字書きの友人から、「同人誌のタイトルを作りたい。イラレ教えて。」

と改めて言われたので、ざっくりとですが自分のやり方をまとめておきます。

他にもロゴに関してのツイートっていっぱいあるけどなかなか

技術的な部分に言及するのって難しいので。(追記*難しかった!!!)

 

イラレ持ってるけど全然扱えなくて投げちゃったひととか、

きれいに作りたいけど何からやればいいの!?てひととか。

そこそこ居ると思うし、今はアドビ様が月額制で扱えるようにして下さってるので

比較的触りやすいソフトになった・・・と思いたい。

「テキストベタ打ちしただけのタイトル」から脱却する

きっかけぐらいにはなったらいいなぁと。

・・・やる気のある人の何かの参考にでもなればいい・・・かな・・・

 

作業環境はイラレCS3、MacBook Proのメモリ4GB、OSX10.7.5。

あんまり親切な説明じゃないかもしれないけど、お付き合い下さいまし。

 

イラレで同人誌のロゴを作るマン】

「タイトル編」フォント選びと手動で微調整していきます。

01.そもそも何が出来るのだ

02.とりあえず作るぞ<まずは準備>

03.とりあえず作るぞ<文字を打つ>

04.とりあえず作るぞ<文字から図形へ〜足したり引いたり〜>

05.レイアウトを仮組みするぞ<使い方を考えよう>

06.細部をいじるぞ<そして完成>←new!

 

番外編 ・ずぼらでもいいじゃない

hisame2501.hatenablog.com

 

加工編・こんな処理をしたいよ!な人向け。

hisame2501.hatenablog.com

 

[PLASTIC MOON様]C92新刊ロゴデザイン

イラストレーター・一美様(@kaz_plasticmoon)の個人サークル

PLASTIC MOON」にてC92新刊ロゴを制作致しました!

 

<表紙採用案(A4両観音開き・8p)>

f:id:hisame2501:20170819232429j:plain

f:id:hisame2501:20170820000022j:plain頂いたタイトルの方向性から、生い茂った植物が絡み付き、

文字が覆われて隠されていくようなイメージで制作しました。

パーツ以外にもSのカーブの微調整など手を加えています。

 

<しおり用展開案(ハガキサイズ・クリア素材)>

f:id:hisame2501:20170820000034j:plain

4連のクリアしおりということで、表紙案のまま使うと

小さくなりすぎてしまう為、思い切って組み方を変えました。

周りの模様はうまく繋がるよう調整しています。

f:id:hisame2501:20170820000049j:plain

発行物の随所に使用して頂きました〜〜わーい !

 

<中面コピー採用案>

f:id:hisame2501:20170820101144j:plain

トランプのマーク4種をモチーフにした女の子4人のイラストに合わせて、

漢字にそれぞれのマークを忍ばせたデザインです。

コピーに転用する際、同じルールで別の漢字も作り起こしてます。

 

英語タイトルと日本語タイトルの両方で提案させて頂き、英語案をメインに、

日本語案は中面コピーに転用する形で採用となりました。

表紙のラフが固まっている段階での提案だったので、

極力イラストの邪魔をしないレイアウトになるように、

装飾しつつも華美になりすぎないよう心掛けています。

 

描き下ろしの可愛い女の子達がラフから完成まで爆速で上がってくるのに

終始デレデレしながらの作業でもう・・・超楽しかった・・・!!

お手に取って下さった皆様、ありがとうございました!

再販も予定されているとのことなので詳細はいずれ一美さんのツイッター

HPでご確認頂けると思います!宜しくどうぞ〜!

https://twitter.com/kaz_plasticmoon/status/896934117262082048

https://twitter.com/hisame2501/status/897802800746209280

 

https://twitter.com/hisame2501/status/897802800746209280

番外編・スキャナ無しで手書きロゴ作っちゃう

人に教えるほどのテクニックじゃないんですが

一定の閲覧数があるようなので何にも更新しないのも申し訳ないなと・・・

ざっくり言うとiPhoneで撮ってイラレでベクタ化して使うよってだけの話です。

ライブトレースという機能がありまして。便利なので是非使ってね。

Adobe CCユーザーはこういうのもあるけどすごすぎてどうしたもんか感ある。

Adobe Capture CC | 写真を編集、シェイプをベクター画像に変換

 

 

手書きの利点はやっぱり約束されしオンリーワン感だと思います。

漫画のロゴでいうとアオハライドとか。好き。

www.mdn.co.jp

 

1・書くよ

f:id:hisame2501:20170408160110j:plain

なんでもいいので書いちゃいましょう。白いノートにこんなかんじ。所要10秒。

スキャナ持ってるんですけど、電源入れて蓋明けて線繋いでっていう行程がもう

めんどくさすぎるので簡単に済ませたい時は携帯カメラで十分です。

書いたものをモノクロモードで撮って、可能ならiPhone上で補正かけて下さい。

撮ったデータはinstashareでMacにぽいっと。ワイヤレスありがたや。

win/Androidでも使えるはずなのでおすすめですー。

itea40.jp

 

2・ベクタデータにするよ

撮ったデータをイラレ上で開きます。真ん中の四角はA4サイズのアートボードです。

画像でかいな!!!これくらいのサイズなら十分使えるぞーーーいえーーい

f:id:hisame2501:20170408161327j:plain

画像を選択した状態のままで、オブジェクト>ライブトレース>トレースオプションで

f:id:hisame2501:20170408162347j:plain既にそれっぽい!!!それっぽいけどちょっと太すぎるので調整。

もっと繊細な部分まで表現したかったらやっぱりスキャナ要りますね。

「ホワイトを無視」は必ずチェックを入れておきます。

しきい値とぼかしをいじるだけでもだいぶ変わるので色々いじってみて下さい。

 

f:id:hisame2501:20170408162702j:plain

「トレース」をクリック、オブジェクト>ライブトレース>拡張で

f:id:hisame2501:20170408163452j:plain手書きからものの数分でベクタデータになりました。わーい。

この状態だとグループ化されているので、Ctrl+shift+Gでグループ解除。

字間やら大きさやらのバランスを整えつつ1字ごとに複合パス化。

f:id:hisame2501:20170408164711j:plain

f:id:hisame2501:20170408165235j:plain

漢字とひらがなの太さがあんまり違いすぎるとみっともとないけど

突貫工事ならこんなもんじゃないでしょうか・・・だめかな・・・

必要ならオブジェクトの線を「有り」にして太らせるとか、

パスのオフセットとかで適宜調整したほうが綺麗だと思います。

 

3・デザインに落とし込んだよ

フォトショで写真いじったりしつつはい完成。

f:id:hisame2501:20170408165458j:plain

安易に海辺なかんじで。素材はぱくたそさんから。

ぱくたそ-フリー写真素材・無料ダウンロード

いつも助けて頂いております(変な写真もいっぱいあるけど)

 

別にロゴじゃなくても、こういう簡単な落書きとかちょっとしたパーツを

配置したい時にも重宝するので適度にずぼらにいきましょう。

f:id:hisame2501:20170408170709j:plain

 

加工編・文字の輪郭を荒らす

文字の輪郭を荒らす


							Illustratorで印刷物風のかすれの描き方 | 鈴木メモ					Illustratorで印刷物風のかすれの描き方 | 鈴木メモ

 

パスのオフセット4重掛け!!!!!!!!!!

このテク可及的速やかに広まって欲しい!!!!

いや私が知らなかっただけなんですけど!!!!

 文字のアウトラインを取らずに出来るから自分でパス引く必要ないし、

数値いろいろいじったりして調整もしやすいし。

ちょーーー手軽なうえに汎用性高いので活用して欲しい。

古い新聞記事みたいなレトロな感じがとても良い。

 

紹介だけだとブログ書く意味なかったから作例もおいとくよ。

こういうリリカルで不穏なタイトル大好きなので誰か使ってくれ。

f:id:hisame2501:20160910205326j:plain

どあっぷも置いとくよ。

f:id:hisame2501:20160910205120j:plain

06.細部をいじるぞ<そして完成>

6・同一角度で左端をカット

まだ丸い箇所があって気になったので(そういう書体選んだからね!)

横棒の左端が出てる部分を斜めに切り落としたいと思います。

なるべく全部の箇所に同じ処理を施した方が統一感が出るかと思いますよ。

f:id:hisame2501:20160910153809j:plain

グループ化の状態だとパスファインダの機能が使えないので

複合パス化(Ctrl+8)忘れずに。「朝」とかの横棒2つなどで、

複数箇所一気にやりたいときは、切り抜きたい図形の方も複合パスにして下さい。

 

7・先端をシュッと伸ばす

ま〜〜〜だなんか野暮ったさが残るので、「シュッ」とさせます。シュッと。

要は「光」「降」「朝」の文字の左はらい、右はらいの部分を細く伸ばします。

f:id:hisame2501:20160910154854j:plain

曲線を描こうとするときは必ず外側のカーブから調整したほうがやりやすいです。

外の線が決まれば、内の線はそれに追従するだけなので・・・説明難しいな?

他の文字も同様に、いらないアンカーポイントを消したり足したり

動かしたりしつつハンドルをうねうねうねうね動かして調整します。

 

あとは細さを強調したり、太さを強調したり、短くしたり長くしてみたり。

やってる操作はだいたい一緒です。めんどくさいので説明省略。

 

そして出来たのがこちらー!(右はベタ打ちしただけのやつ)

どの辺をどこまでいじったかは間違い探しだと思って見比べてください。

f:id:hisame2501:20160910155615j:plain

一応それっぽくなったと思います。ひとまず野暮ったさはなくなったかと・・・!

慣れてれば1時間くらい。ラフ含めて悩みながらだともっと時間かかるけど。

あくまで私のやり方なので新しい機能とか効率のいい方法はいっぱいあるよ多分!

 

ここまでお付き合い有り難うございました。

分かりにくいとことか、もっとこうしたいよ!とか気軽にコメントくださいませー。

何の反応もなければこのブログはそのうち消える。

やれるかどうかは別として補足していけるやつはなるべく説明していきます。

 

ではでは。

(加工編もぼちぼちやる予定だよ)

05.レイアウトを仮組みするぞ<使い方を考えよう>

 

飽きたので細部を作り込む前にロゴの置き方を決めたいと思います。

ていうか先にやれよって感じですね

 

5・レイアウトの仮組み

小説本・右綴じを想定しているので右上にタイトル、左下に作者名を配置。

イラスト無いし、背景も別に決めてないのでまぁだいぶ適当です。

真ん中でもいいし、左端に見切れるくらいデデーン!と置いても良いかと。

当初のラフのように字の大きさを変化させつつ、これだけだと作業のモチベも

保てないので細いグラデの長方形や光(星?)を入れてみました。

f:id:hisame2501:20160903142023j:plain

アピアランスはもういじらなくてもいいかな、と思ったら

「オブジェクト>アピアランスを分割」でアウトライン化させておくといーかも。

 

もういっこ何かアクセントになるといーなと思って曲線を足します。

f:id:hisame2501:20160903142301j:plain

f:id:hisame2501:20160903142548j:plain

 

曲線にもグラデを使ったところで満足しました。

作者名の下まで伸ばす事で目線の誘導もしやすくて良いのではないかなー!?

f:id:hisame2501:20160903142656j:plain
<追記>オブジェクトのレイヤー間の移動

f:id:hisame2501:20160910011852j:plain

イラレのレイヤーの扱いはphotoshopと違って

「1つのレイヤーにいっぱいオブジェクト置ける」のが利点です。

例えばチラシを作るときなら、

・トンボレイヤー(必ずロックをかける)

・ごみ放ったらかしレイヤー

 (アートボードの外にある未使用のオブジェクトを放り込んで置いとく)

・文字組みレイヤー

・図版(写真)レイヤー

・背景レイヤー

のだいたい4〜5つくらいで管理しています。入稿のときに統合します。

今回はあくまでロゴ制作なので、飾りの類いはひとまとめにして非表示で。

 次で終わりじゃー!

 

NEXT▶▶▶06.細部をいじるぞ<そして完成>

[フラットベーススタジオ様]屋号・パッケージデザイン

オリジナルロボットのガレージキットを制作されている

フラットベーススタジオ様の屋号とパッケージ2点の

デザインをさせて頂きました!!ひゃっほい

 

f:id:hisame2501:20160901000641j:plain

 

 

おもちゃの雰囲気を大事にしたポップなものやかっこいい系も

提案しましたが、なかなか満足いく仕上がりになって良かった。

ディーラー様ご本人の名刺も担当致しましたので、パッケージと合わせて

イベント会場でご縁がありましたら宜しくどうぞです。

なかなか愛嬌のあるロボ達がお出迎えしてくれます〜。