イラレ(Illustrator)でフォントを追加する超簡単な方法!

イラレ(Illustrator)でフォントを追加する超簡単な方法!

Ayaka Matsui

Ayaka Matsui

はじめまして、Webデザイナーのまっつーです!

Webデザインスクールの「デジタルハリウッドSTUDIO by LIG」(デジLIG)でWebデザインを勉強し、未経験で入社させていただきました。

デジLIG(デジタルハリウッドSTUDIO by LIG)とは
株式会社LIGとデジタルハリウッドが業務提携をしてはじめたクリエイター養成スクールのこと。Webデザイナーや動画クリエイターを目指す方向けのカリキュラムを展開している。現在、上野・池袋・大宮・北千住・川崎・町田にて受講生を募集していて、無料説明会は毎日開催中!

💡デジLIGについて気になった方へ→概要資料はこちら!(資料請求)

今回は「Illustrator(イラレ)にフォントを追加する方法」について!

実際の画像をお見せしながら初心者の方にわかりやすくお伝えさせていただきます! とっても簡単ですよ!

使えるフォントの数が増えると、デザインの幅がぐーんと広がるので、

「まだフォントを追加したことがない……」

という方はぜひ追加をしてみましょう!

Illustrator(イラレ)にAdobeフォントを追加する方法

Adobeフォントは、Adobeが提供しているフォントサービスで、Creative Cloudの有償メンバーシップになると、約20,000種類以上のフォントが無制限で利用可能となります。

またAdobe IDを作成すれば無償で約6,000種類のフォントが利用可能になるので、イラレを始めたばかりの方でも利用しやすいサービスです。

それでは追加方法を実際のMacの画面で説明していきます。

※WindowsとMacでは表示画面が異なることがありますが、基本的には同じ作業になりますので、今回はMacの画面で説明します。

①ブラウザでAdobeフォントを開く

Illustrator(イラレ) メニュー画面
Illustratorを開き、「メニューバー」>「書式」>「Adobe Fonts のその他のフォント…」をクリックします。
 Adobe Fontsのその他のフォント一覧
ブラウザが起動し、Adobeフォントへつながります。

②フォントを検索する

Illustrator(イラレ) フォント検索画面
画面左側から条件を絞り込んで、フォントを検索していきます。

なるべく絞ったほうがイメージに合うフォントが見つかりやすく、検索時間の短縮につながるので、ここからフォントを絞ってみましょう。
Illustrator(イラレ) 書体選択画面
「言語」→よく使用するのは日本語か英語ですね。

「分類」→書体を絞ります。表示されるフォントがかなり変わってくるので、明朝体かゴシック体かどうかは最低限決めておきたいところ。

「書体の属性」→ここではフォントの太さやフォントファミリーの数を絞ります。フォントファミリーが多いほうが何かと便利なときがありますよ!

フォントファミリー
フォントファミリーをクリックすると、フォントの詳細が確認できます。同じフォントスタイルでも太さの違いで、与える印象が変わってきますね。
しっぽり明朝
サンプルテキストを入力すると実際のフォントでプレビューできるので、使用用途にあうフォントかここでチェックしてみましょう。

③フォントを追加する

フォントファミリー アクティベート画面
欲しいフォントが決まったら、フォントをインストールします。

方法はとっても簡単! アクティベートボタンをポチっと押すだけ。これで完了です!

右下に「○○○(フォント名)をアクティベートしました」と表示されたらOKです。
一括アクティベートボタン
全てのフォントファミリーが欲しければ、ここをクリックすれば一括でアクティベートできます。

それではフォントが追加されているか、イラレで確認していきましょう。
プロパティ画面
文字ツールをクリックすると、プロパティパネルに「文字」の項目が出てきます。
プロパティ画面 文字タブ
アクティベートしたフォントが表示されました。これで新しいフォントを使用することができます。

ちなみに、今回アクティベートしたフォントはイラレだけでなく、Photoshopなど他のAdobe製品でも使用することができます!

新しいフォントをインストールしていろんなデザインに挑戦していきましょう!

Adobeフォントのデザイナーおすすめ3選

定番で使いたい!デザイナーおすすめのフォントを紹介します。

ゴシックMB101

ゴシックMB101
https://fonts.adobe.com/fonts/a-otf-gothic-mb101-pr6n
「このフォントを使えばほとんど失敗しません!」というくらいおすすめのフォントです。見出しやタイトルに使うとデザインが一気に引き締まります。ゴシック体ではありますが丸みがあり、幅広い用途に対応できます。

黎ミン

黎ミン
https://fonts.adobe.com/fonts/a-otf-ud-reimin-pr6n
シンプルで読みやすく美しい明朝体です。このフォントを使用すると、洗練された印象を作り出せるのでおすすめです。

Acumin

Acumin
https://fonts.adobe.com/fonts/acumin
形が整っていてクセのないサンセリフ書体。使うと一気に完成度が高まるので、ついつい使ってしまいます。

▼フォントの種類についてもっと知りたい方はこの記事を参考に。見せたいイメージ別にフォントを紹介しています。

Illustrator(イラレ)にその他のフリーフォントなどを追加する方法

イラレではAdobeフォント以外のフォントも追加することができます。Web上で無料配布されているフォントもあるので、「フリーフォント」で検索してみましょう。

▼その他、おすすめのフォントなどはこちらの記事でまとめております。

ここでは私がデザインでよく使用しているフリーフォントを例に、インストール方法を説明していきます。

①Web上でフリーフォントを検索する

今回は スマートフォントUIをインストールします。
スマートフォントUI
ダウンロードボタンをクリックすると、zip形式でダウンロードされます。

②ファイルを開きフォントをインストールする

Mac Zip解凍画面
ダウンロードしたzipファイルを解凍し、フォントが入ったフォルダを開きます。
フォントが入ったフォルダ
ファイルが複数出てきますが、「03 スマートフォントUI.otf」のファイルを開きましょう。
スマートフォントUI プレビュー画面
するとフォントがプレビューされます。この画面が出てきたら、右下にある「インストール」をクリック。

③フォントの確認をする

font Book
インストールができていれば、font Bookに表示されます。
イラレ フォント選択画面
イラレでもフォントがインストールされているか確認しましょう。

文字パネルからフォントを検索すると「スマートフォントUI」が表示されていることが確認できます。これでフリーフォントが使える状態になりました。

フォントを変えるだけでこんなに変わる!

1枚の写真に4種類のフォント
この4枚は同じ写真ですが、フォントだけでこれだけ印象が変わってきてしまうんです。フォント選びの重要性を実感できたかと思います。

デザインをしているとイラストや色に気がいきがちですが、「デザインがしっくりこなくて微妙……」という状況に陥ったときは、フォントのチョイスが良くないことが原因だったりします。

フォントのチョイスがデザインの良し悪しを左右すると言っても過言ではないほどに、フォント選びは重要です!

まとめ フォント追加で幅が広がる!

今回はイラレにフォントを追加する方法とおすすめのフォントを紹介しました!

フォントのインストール方法はとても簡単なので、使えるフォントのバリエーションを増やして、デザインの幅をどんどん広げていきましょう。

プロからデザインを学びませんか?


「プロから学びたい」「未経験だけどクリエイティブな仕事がしたい……」という方は「スクールでの勉強」もおすすめです。

デジLIGでは、未経験から6ヶ月でWebデザイナーを目指せます。現役Webデザイナーによる授業と豊富な就職支援が特徴! ぜひ一度詳細をチェックしてみてください。

 
デジLIGの詳細を見てみる!

デジLIGの資料請求はこちら!

この記事のシェア数

1989年埼玉県生まれ。新卒で入社した繊維商社に営業職として5年間勤務。その後退職し、旅行で沖縄の離島を訪れた際に、宿泊した民宿のオーナーに誘われそのまま働く。接客の仕事をしながら広報業務を行っていく中でwebデザインに興味を持ち、その後デジタルハリウッドby LIGに入学。現在はLIGのインハウスデザイナーとして、LIGブログのアイキャッチやバナー制作、取材撮影を担当している。

このメンバーの記事をもっと読む