DESIGN IT YOURSELF.

BUROKI


top

blog

  • top
  • blog
  • ロゴデザインやタイポグラフィに使える。フォントの印象をガラッと変える方法

ロゴデザインやタイポグラフィに使える。フォントの印象をガラッと変える方法

design_thing

  • top
  • blog
  • ロゴデザインやタイポグラフィに使える。フォントの印象をガラッと変える方法

ロゴデザインやタイポグラフィに使える。フォントの印象をガラッと変える方法

2019.07.20.

スポンサーリンク

スポンサーリンク

久しぶりにデザイナーとしてのコンテンツ「デザインの中身」を更新しようと思います。実はなかなか好評なコンテンツなんです。

ボクはデザインの本を読めば学べるような基本的なものはあまり紹介する必要がないと思っていて(本読めば書いているので)、その知識をインプットした上で、独自の方法であったり考え方を発信しないと個人でコンテンツつくる意味がないと思っているんですね。なのでボクが書くデザインのHow toなどはあくまで個人的なやり方であり、「正解」ではありません。その辺を考慮してもらった上で過去の「デザインの中身」記事は下記のリンクからご覧ください。

さて今回の「デザインの中身」ですが、先日ボクの新居でホームパーティをしたんですね。そのときにコンテンツようにタイポグラフィ(文字のデザイン)をつくったんです。

BUROKI HOME PARTYタイポグラフィ

ちょっと今風でポップに、少し80年代くらいを意識してつくったタイポグラフィです。そして、この作品は既存のフォントをアレンジして制作しました。自分の頭の中である程度完成品をイメージさえできていれば、既存フォントをアレンジして制作できます。このタイポグラフィをどんな手順で制作したのか、その方法をあくまで一例としてご紹介しようと思います。

まずは既存フォントを選ぶ

はじめの段階として、グラフィックソフト「illustrator(イラストレーター)」を開き、イメージに近いフォントを選びます。今回のホームパーティのタイトルが「BUROKI HOME PARTY」なので、既存のフォントでまずタイトルの文字を打ちます。フォントは「Lovelo」というおしゃれなフリーフォントを使用しました。

文字を打ったあとは、ある程度文字と文字の間や行間などを整えて文字組みしておきます。きっちりしなくても大丈夫です。

まずは既存フォントで文字組み

こんな感じですね。文字が打てれば誰でもできるレベルなので簡単です。既存フォントのままでできることはここまでです。ここからイメージに合う文字になるようにアレンジしていきます。

既存フォントをイメージに合うようにアレンジしていく

既存フォントをアウトライン化(文字からオブジェクトに変えることをいいます)させたあと、イラストレーターの機能を使ってまずは変形させます。今回使った機能は「自動変形ツール」。このツールを使えばどんな形にも変形させることができます。ツールバーの真ん中あたりにあります。

イラストレーターの自動変形ツール

コントロールキーとオプションキー、シフトキーなどを使って変形させますが、慣れていない人は試行錯誤必要かもしれません。最近よくある右上がりの文字はおしゃれに見えるので、右上がりにしつつ、少し横にも変形させて右斜めな形にします。

自動変形ツールを使った文字

これだけではじめの文字と印象変わりますよね。でもこのままではさすがに不自然なので、行ごとに少し右にずらしていきます。ここは少し感覚は必要になりますね。

各文字列を右にずらしていく

こんな感じでずらして調整します。画像のものはブログ用につくってるんでキッチリ再現はできていないのですが、要領は同じです。できるだけ描いているイメージに近づけるように文字の形を整えておきましょう。

文字を線にし、線の太さを調整する

ここから文字の印象を変えていきます。

まずは加工した文字をベタ塗りから線に変更します。そして、アルファベットの文字の中にある図形を消去し、外側だけの文字にします。今回の「BUROKI HOME PARTY」でいうと、B、R、O、P、Aですね。これらの文字の内側の線を削除ということです。

文字を線にして内側を削除

これだけでもけっこうスッキリとした印象になりましたね。ここからは線を「はさみツール(ショートカットキーはCです)」にて部分的にカットしていきます。

はさみツール

カットする際に気をつけたいのは「読める範囲で」カットしていくことを心がけましょう。今回のタイポグラフィの場合、ホームパーティという良い意味でのゆるさを出したかったので、カットする部分もできるだけラフに、感覚で思うままにカットしています。お好みですね。

はさみツールでカットした文字

線の端を丸く、太くするとよりポップな印象に

大体カットし終わったら線を整えていきます。ポップな印象を与えたい場合は線の端を丸くするとポップな印象になりますし、やや線の幅を太くするとよりポップな雰囲気に仕上がっていきます。

線の端を丸く、太くするとよりポップな印象に

カットして色をつけたらタイポグラフィの完成!

カットが終わって文字の形を整えたら最後に色をつけます。文字ごとではなく、カットした線ごとに違う色をつけてカラフルにするとよりパーティ感が出せます。そして背景に文字の影をつけるとネオンのような雰囲気も出ますね。

ホームパーティタイポグラフィの完成

これで今回のホームパーティ用のタイポグラフィの完成です。このように、既存のフォントからアレンジ次第でいくらでも違う印象の文字をつくることは可能です。ぜひチャレンジしてみてください。

いろんな使い方ができるか、アレンジを試す

制作した作品は通常のデザインの他にどんな使い方ができるか、アレンジバージョンをつくっておくことをおすすめします。例えば画像の上に載せる場合はどうやって見せるか・・今回のタイポグラフィでは画像の上に置いてタイトルっぽく見せるときはこのようなアレンジにしました。

画像の上に置いたときのアレンジバージョン

画像の上に置く場合、一番注意しないといけないのは「視認性」です。背景にいろんな色が入るので、そのなかでも認識できるものになっているかどうか。無難なのは白一色にするバージョンですね。通常の作品以外にもいろんな媒体に使えるように数種類持っておきましょう。

BUROKIの「デザインの中身」

デザイン本には載っていないボク独自の方法で紹介する「デザインの中身」コンテンツ。こんな感じで不定期ですが更新しています。過去のコンテンツは一覧ページからご覧になれますので、ぜひほかのコンテンツも見てみてくださいね。

スポンサーリンク

BUROKI写真

BUROKI写真

はじめましてBUROKIです。

ベンチャー企業にて11年間webやグラフィックデザインとブランディング経験を経て、2019年5月よりフリーランスデザイナーになりました。完全独学でフリーランスになった異色の経歴の持ち主だと思います(笑)

制作実績やインハウスデザイナーのことなど日々更新しています。デザイン制作のご依頼やお問い合わせなども受け付けてますので、なんでもお気軽にご相談ください。

ベンチャー企業でマスターデザイナーとして働いた後、フリーランスになりました。制作実績やインハウスデザイナーのことなど日々更新しています。制作のご依頼なども受け付けてますので、なんでもお気軽にご相談ください。

ご依頼・お問い合わせ

ご依頼・お問い合わせ

related contents

関連コンテンツ一覧
スポンサーリンク

スポンサーリンク

blog list

ブログ一覧

design_thing

プロのデザイナーがpowerpointを使った資料作成で困ったこと5つ

今年の2月と3月の2ヶ月間、昨年末から決まっていたスケジュールどおり、powerpointでの資料制作に没頭していました。 制作したページ数は合計でなん…

2020.03.30.

private

京都の烏丸、河原町、二条にあるレトロな喫茶店をめぐり歩いてきました

デザイン制作が立て込んでいたこともあったりコロナの影響もあったりで、最近はあまりちゃんとした外出をしていなかったのですが、この前の水曜日は…

2020.03.28.

design_thing

スマホ最適化「レスポンシブデザイン」はこれからの時代のwebサイト制作に必須!

このwebサイトを訪問してくださる人たちのなかに、ホームページのことをまだそこまで詳しく知らない方々がいる可能性もあるので、今日はボクがホーム…

2020.03.24.

favorite

SUGAKIYAの和風とんこつ鍋つゆで思い出の味を家庭でも楽しめる

中学生のころ、地元にはジャスコ(現イオン)がありまして・・そのジャスコの3階フロアに入っていた「SUGAKIYA」。ご存知の人も多いと思いますが、ラ…

2020.03.22.

think

会社員をやめて約1年。フリーランスデザイナーになっての変化と改めて思うこと

日付が変わってしまいましたが、3月19日。 この日はボクにとって何の日なのかというと、誕生日というわけではなく、昨年の3月19日に長年勤めていた企…

2020.03.20.

design_thing

webサイトは4つのタイプに分かれる。各タイプの特徴とデザイン時に気をつけたいこ...

最近ボクのinstagramへのフォロワーさんが増えてきており、そのフォロワーさんたちの大半がこれからデザインをはじめる人であったり勉強中であったり…

2020.03.18.

blogをもっと見る

制作のご相談・お問い合わせはフォームから

デザインのご依頼や予算のご相談、お問い合わせなどお気軽にお問い合わせください。
また、書いてほしいブログのリクエストやファンレター(笑)もお待ちしております。

問い合わせフォームはこちら

topトップページ

aboutブロキについて

designデザイン

voiceお客さまの声

blogブログ

films制作動画

cassetteカセットテープ

snsソーシャル