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年間様々な媒体のデザインとブランディング経験を経て、2019年5月よりフリーランスデザイナーになりました。完全独学でフリーランスになった異色の経歴の持ち主だと思います。(笑)

他にもいろんな作品の紹介やブログを書いてるのでぜひ見てみてください。デザイン制作のご依頼やお問い合わせなども受け付けてますので、なんでもお気軽にご相談くださいね。

ブログをご覧いただきどうもありがとうございます。他にもいろんな作品の紹介やブログを書いてるのでぜひ見てみてください。制作のご依頼やお問い合わせなども受け付けてますので、なんでもお気軽にご相談くださいね。

ご依頼・お問い合わせ

ご依頼・お問い合わせ

スポンサーリンク

スポンサーリンク

blog list

ブログ一覧

private

賃貸でもDIYできる。「roommakit(ルームメキット)」を壁に取り付けてみ...

昨年の話になるのですが、10月末に前に勤めていた企業が普段お世話になっている取引先さまやメーカーさまを招待して開催した感謝祭「TRYANGLE(トラ…

2020.01.23.

design_thing

【初心者向け】webページをつくるためにHTMLを理解し、書けるようになるコツ

いま皆さんがご覧になってくださっている(ありがとうございます)このブログのwebページも「HTML(エイチティーエムエル)」という言語で構成されて…

2020.01.21.

private

かにカニ日帰りエクスプレスで城崎・円山川にある「旅館ひだまり」へ

実は、1月16日はボクの誕生日でして、38歳になりました。バッチリアラフォーです。これからもアラフォー・ブロキをどうぞよろしくお願いいたします。…

2020.01.19.

private

本町センター街にある知る人ぞ知る名店「炉ばたワコー」で初飲り

先日、現在webサイト制作をさせていただいている企業さまへ打ち合わせに行き、打ち合わせのあと新年会も兼ねて近くのお店で飲むことになりました。 …

2020.01.15.

private

今年ももちろん今宮神社の「十日戎(とおかえびす)」で商売繁盛祈願してきました

毎年1月9日から11日までの三日間は年のはじめのお祭りとして「十日戎(とおかえびす)」が開催されます。ボクも毎年のようにこの時期は今宮神社へお…

2020.01.13.

think

2019年12月の活動報告。12月はこんなデザイン制作をしていました

年が明けて2020年。2019年からBUROKI designとして本格的にフリーランス活動を開始し、一月一月、個人で仕事することの意義を感じながら感謝の気持ち…

2020.01.11.

blogをもっと見る

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

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

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

topトップページ

aboutブロキについて

designデザイン

voiceお客さまの声

blogブログ

films制作動画

cassetteカセットテープ

snsソーシャル