creatersnest120

Illustratorで合成フォントを作る方法


小塚ゴシック、わりとスタイリッシュでイイ。これでテキスト打とう。
でも半角英字が納得いかない。ここだけメイリオにしたい・・・。

デザインしていると、そんな細かすぎるこだわりを発揮してしまう時がありますよね。
でもテキストの量が半端なかったりすると、作業する前から鬱になります・・・。
延々、半角英字だけドラッグしてフォント変えるのか・・・。

そんな時光り輝くのが「合成フォント」です!
今回はこちらの機能をご紹介します。

 

ダイアログを表示。

書式メニュー→合成フォント を選択し、合成フォントのダイアログを表示させます。

 

40

41

 

新規作成。

ダイアログの真ん中あたりにある新規作成ボタンをクリックします。
合成フォントに名前をつけるよう指示がでます。任意の名前を付けてOKを押します。
今回は「俺のフォント1」としました。

 

42

43

お好みでカスタマイズ。

今回は英字だけをメイリオに変えたいので、ダイアログの「半角欧文」の行だけ操作します。
数字だけ、漢字だけ、などお好きにカスタマイズしてください。

 

44

 

組み合わせるフォントの種類によっては、サイズが100%のままだとバランスが悪くなってしまうものもあります。
サイズやベースラインもしっかり調整しましょう。
サンプルの文章が見えにくいときは、ズームの倍率を変えてみると細かいところがしっかり見えて便利です。

ダイアログの下の方にサンプルの文章が表示されますので参照しながら調整してください。
心ゆくまでカスタマイズしたら、保存をクリックします。先ほど指定した名前で保存されます。

 

45

試し打ち

お好みのフォントでお好みのテキストを入力しましょう。
今回は筆者の独断と偏見で、TRICKの上田次郎先生の明言をお借りしました。
デフォルトフォントはホリディMDJPです。

 

WS000021

 

比較対象のため、小塚ゴシックとメイリオも並べてみました。
青字がホリデイ、紫字が小塚、緑字がメイリオです。

WS000017

 

ホリディを選択して、文字パネルから先ほど作った合成フォント「俺のフォント1」を探します。
一番上にありました!

46

 

適用して比較して見てください。英字だけメイリオになっています。

 

47

おまけ:特例文字もカスタマイズ

合成フォントダイアログの真ん中右側に、「特例文字」というボタンがありました。
クリックすると、特例文字セット編集ダイアログが表示されます。
合成フォント新規作成と同じく、左下の新規ボタンを押します。

 

48

49

 

よく見られる設定としては、括弧類のみ線の細いフォントに変更するやり方があります。
文字はいい感じなのに括弧だけ図太い・・・仕方ないが諦めるか。時間もないし。
と涙を飲んだ経験は筆者にもあります。

 

50

 

名前を指定してOKを押します。オヤジギャグは意外とスキです。

 

51

 

 

ここからが意外と面倒です。なんと言っても1文字ずつしか追加できないようで。
フォントを指定して文字を入力、追加、保存、OKをちまちまと繰り返します。
なんで一括追加できないんですかね、Adobeさん?
セット編集を完了しますと、先ほどの合成フォントダイアログのフォント種類の一番下に
「かっこいい括弧」が出現しているのがわかります。

 

52

 

一通りやると楽しくなってきました。この機能を使えばこんなお遊びも。

WS000025

誘拐文。文字ごとの回転もできるとよりそれらしくなりますね。

 

最後に

いかがでしたか?便利で簡単に使える機能でしたね。
ちなみにこの合成フォントの機能はCS以降にしかついていないそうです。
それより古いバージョンの方はごめんなさい。手打ちしてください。

本サイトが運営するWebデザインのオンラインスクールが公開中!
以下のリンクからお申込みで、特別料金の70%OFF!

未経験からプロのWebデザイナーになる! 400レッスン以上の完全マスターコース
こちらのコースは全くの未経験の方が、プロのWebデザイナーとして働けるレベルになることを目的としたコースです。
・全422レッスン & 42時間! 通学スクール80万円相当の内容
・授業×チャレンジ課題で実践的なスキルが身につく!
・過去1100名以上のスクール卒業生を輩出した、 Webサービス運営企業・デザイナー輩出企業だからこそ作れるプログラム

Webやアプリの最新デザインツール Sketch3 |100レッスンの完全マスターコース
Sketch3未経験からプロレベルを目指す、充実したコースです。
Sketch3の単なる機能説明をするような、つまらないコースではなく、アイコン制作、ボタン作成、メインビジュアル制作、Webページの制作など、実際の制作をしながら実践力を身につけます。
1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供しています。


NESTonlineBlog編集部

NESTonlineBlog編集部です。ご寄稿頂いた記事などを公開していきます。

Next Article【CSS入門】これから勉強する人にまず見て欲しい!CSSとは?どうやって書くの?