DESIGN IT YOURSELF.

BUROKI


top

blog

  • top
  • blog
  • どんなフォントにも対応できるステンシル風加工のやり方と考え方

どんなフォントにも対応できるステンシル風加工のやり方と考え方

design_thing

  • top
  • blog
  • どんなフォントにも対応できるステンシル風加工のやり方と考え方

どんなフォントにも対応できるステンシル風加工のやり方と考え方

2021.03.14.

スポンサーリンク

スポンサーリンク

先日twitterであるデザイナーさんから「TOPページのメインビジュアルに使っているフォントを教えてください!」というDMをいただきました。

メインビジュアルのフォント
こちらのフォントですね

しかしこのフォントは既存のフォントをそのまま使っているわけではなく、既存のフォント「Rokkitt」をステンシル風に加工したものなんです。

以前DIYの会社に勤めていたので、思えばボクはよくいろんなフォントをステンシル風に加工してきました。

けっこう需要がありそうなので今回のブログでは、グラフィックソフトの「illustrator(イラストレーター)」を使ってフォントをステンシル風にする加工のやり方と加工するときの考え方を紹介しようと思います。

BUROKIアイコン

ステンシル加工はお手のものです!

そもそもステンシルとは?

まずは「ステンシル」というものを説明します。
ステンシルとは型をつかって文字やイラストをいろんなものにプリントするための技法のことです。主にDIYでよく用いられます。

プレートを使ってフォントやイラストの「型」をつくり、その型にスプレーやインクを吹きかけてプリントします。なのでプレートをフォントのディティールでくり抜いた型をまずはつくらなければいけません。そうなってくると、フォントをそのまま使ってしまうとどうしても型がつくれない(くり抜けない)部分が出てきます。それが「空洞」の部分です。

英字の場合は「O」や「Q」のような輪になっている文字や「D」、「P」、「B」、「A」、「R」といった文字に空間があるものはそのままくり抜くとこのような表現になります。

空洞のある文字のステンシル方法 その1
空洞があるのでこうなります

こうならないために空洞のある文字はステンシル用に加工しなければいけません。

どこを切り抜くのか?を考える

まずは先ほど挙げた空洞のある文字(この表現が正しいのかはわかりませんが 笑)をステンシル加工していきましょう。illustratorを開き、ステンシルしたいフォントを選びます。今回は例としてゴシック体の「FUTURA(フーツラ)」というフォントを選び、空洞のある文字「O」「P」「A」を打ちます。

空洞のある文字のステンシル方法 その2
OとPとAをピックアップします

たまたまピックアップしただけですが、商業モール「OPA(オーパ)」になってますね・・気にせずいきましょう(笑)。

文字の上に線を引く

文字をアウトライン化してテキストからベクターデータに変換したあと、ステンシル加工するために文字の上に線を引きます。引くラインのコツとしては文字のディティールに沿って引くとやりやすいです。

空洞のある文字のステンシル方法 その3
文字の上にラインを引く

切り抜く線の太さは好みでいいと思います。ボクの場合はよくフォントの太さに合わせることが多いです。

線もアウトライン化して文字と一緒に分割

この線も文字と同じくアウトライン化し、文字を一緒に選択してパスファインダで分割します。

空洞のある文字のステンシル方法 その4
パスファインダで分割

パスファインダでの分割方法は、分割したい複数のオブジェクトを選択後、パスファインダパネルの左下のアイコンをクリックすると分割できます。

分割後はくり抜く部分以外を削除して完成

分割後、不要な部分は削除してステンシル風フォントの完成です。

空洞のある文字のステンシル方法 その5
これで完成。簡単ですね

この流れで「O」「P」「A」以外の空洞のある文字をステンシル風に加工していきます。

すべての文字をステンシル化して統一感を出す

プレートにフォントの型をつくるためにやることがメインなので、ステンシルをする目的だけならこれで特に問題はないのですが、グラフィックとして使用する場合、空洞のある文字だけではちょっと物足りないですね。

「A」から「Z」までのすべてのアルファベットをステンシル加工したほうがよりフォントに統一感を出すことができ、全体的なクオリティの向上にもつながります。

すべての文字をステンシル化して統一感を出す
こんな感じですべてのフォントを加工します

ゴシック体フォントの場合、「I」や「J」といった加工のしようがない文字は加工せずそのままで問題なしです。英字を使うときは数字も一緒に使うことがよくあるので、「0」から「9」までの数字もやっておくと後々便利です。

これができれば応用でオリジナリティを出せる

ここまでが従来のステンシル加工のやり方です。
これができるようになればよりオリジナリティのある表現ができます。

例えば文字によって引く線をアレンジします。
「O」のラインを横に引いてみたり、「P」の片方だけに引いてみたり、2本線を引いてみたり・・。ボクのメインビジュアルに使っているフォントもステンシルを少しアレンジして遊び心を加えています。

フォントのステンシル加工をアレンジする
ランダムに線を引いてアレンジ

アレンジすることで従来のステンシルフォントよりアーティスティックな印象を与えることができますね。いろんな方法を試して自分なりのオリジナリティを出してみてもいいと思います。自由に楽しんでみてください。

ひらがなや漢字でもできます

今までは英字でのステンシル加工のやり方を紹介しましたが、もちろんひらがなや漢字といった日本語でも可能です。

漢字のステンシル加工
「黒木」をステンシルにした場合はこんな感じ

特に漢字は空洞の部分が多いのでステンシルのしがいがあると思います。日本語の場合は英字よりも複雑になりがちなので、タイトルの文字だけにするとかでいいと思います。それだけでも通常の文字とは違う印象を与えることができます。

ということで、いろんなフォントをステンシル加工できる方法と考え方を紹介しました。
ステンシル風フォントを使いたい人は、ぜひチャレンジしてみてください。

BUROKIアイコン

文字の加工はやりはじめると楽しいですよ。
スポンサーリンク

BUROKI写真

BUROKI写真

はじめましてBUROKIです。

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

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

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

ご依頼・お問い合わせ

ご依頼・お問い合わせ

related contents

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

文鳥とデザイナー

スポンサーリンク

blog list

ブログ一覧

private

今年も露店なしドラなし!年明けルーティン今宮戎神社の十日戎で商売繁盛祈願

年が明けて家族と会って初詣に行って、9日から11日といえば・・十日戎ですよね? 毎年説明しているので不要かもですが一応。 十日戎とは一年間自分た…

2022.01.11.

think

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

2022年はじまりましたね。 人によっては仕事初めは11日からという人もいそうですが、BUROKI designは1月5日から仕事初めとなりました。今年も健康に…

2022.01.07.

private

年明けのルーティン。初詣とラーメンと喫茶アメリカンと天ぷら大吉巡り

家族で集まる元日から一夜明けると、毎年のルーティンになっていますが初詣に出かけました。 昨年はコロナの影響もあって、人混みを避けるべく住吉大…

2022.01.05.

private

【2022年はじめのご挨拶】新年明けましておめでとうございます

新年明けましておめでとうございます。2022年もBUROKI designをよろしくお願いいたします。 BUROKIの家族では元日は毎年集まれる人は集まるのが恒例…

2022.01.03.

think

【2021年の振り返り】今年もBUROKI designをありがとうございました

もうすぐ2021年も終わりますね。 2020年からはじまったコロナ禍ですが、ようやく終わりが見えてきつつあるものの、すんなりとはいきませんね・・。来…

2021.12.30.

private

天満橋にある「ビストロ ブルーキッチン&ボトルズ」で贅沢クリスマスディナー

12月25日、クリスマスの夜・・。 前日のイブの夜は近所の立ち飲み屋でひとりで飲んでいたボクでしたが(立ち飲み屋で飲むの大好き)、クリスマスはデ…

2021.12.27.

blogをもっと見る

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

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

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

topトップページ

aboutブロキについて

designデザイン

voiceお客さまの声

blogブログ

films制作動画

cassetteカセットテープ

snsソーシャル