Illustratorではさまざまなデザインが楽しめるので、「自分の好きなアイコンを作ってみたい！」と考える方も多いのではないでしょうか。Illustratorは機能が充実したソフトな為、使い方を覚えるとおしゃれなアイコンやロゴを作成することが可能です。一方で使用できる機能が多すぎるあまり、「イメージ通りのアイコンが作れない……」となるかもしれません。
そこで今回は、初心者におすすめのアイコンの作り方などについて解説します。記事の後半ではアイコンを作るコツも紹介しているので、「まずは簡単なアイコンから作ってみたい……！」と考える方は、ぜひ本記事を参考にしてください。
【初心者におすすめ】Illustratorでアイコンを作る方法
それでは、Illustratorでアイコンを作る方法を見ていきましょう。大前提として、Illustratorで作成できるロゴやアイコンのデザインは作り手によって異なります。今回はSNSやビジネスなどで使用される下記の手軽な作り方を見ていきましょう。
それぞれのやり方を紹介するので、あなたが作りたいデザインにあった方法を参考にしてください。順番に解説します。
丸型アイコンの作り方
丸型アイコンはSNSやチャットツールなどで使用されるアイコンです。円形の中心にイラストやロゴ、人によっては自分の写真などを活用しますよね。Illustratorで丸型アイコンを作る方法は下記の通りです。
- Illustratorで新規ファイルを立ち上げる
- 「図形」の「楕円形ツール」を選択する
- ワークスペースに縁を作る
- 枠線の中に画像やイラストを差し込む
枠線の色や円の中の色を変更する場合は、メニューのカラーパネルから操作することが可能です。「Shiftキー」を押しながら図形を作ると、正円を作成できます。
作ったアイコンをSNSなどで使用する際はメニューの「ファイル」から、「Web用に保存（従来）」を選択して、背景を透過してアイコンを保存しましょう。
また既存の画像を円形にくり抜く際は、クリッピングマスクを使用する必要があります。クリッピングマスクの使い方については下記の記事で詳しく解説しているので、あわせて参考にしてください。
ハート型アイコンの作り方
次に、ハート型アイコンの作り方を見ていきましょう。Illustratorにハートの図形は用意されていないので、自分で作る必要があります。今回は手軽に作成できる方法を紹介します。具体的な手順は下記の通りです。
- 「塗り」をなしに設定する
- 「図形」の「長方形」を選択する
- 「Shiftキー」を押しながら正方形を作成する
- メニューの「ダイレクト選択ツール」を選択する
- 正方形の右上のアンカーポイントを削除する
- 「線パネル」を開き、先端を「丸型線端」・角の形状を「マイター結合」に設定する
- 線を太くする
Illustratorの編集画面に「線パネル」が表示されていない場合は、「ウィンドウ」の「線」をクリックして、パネルを表示させましょう。線を太くすることでハートの形になり、「選択ツール」で図形をクリックすることで形や大きさを調整することが可能です。
ハートは花や四葉のクローバーのアイコン・ロゴなどの作成に活用できるので、ぜひ作ってみてください。
ビジネス向けアイコンの作り方
Webサイトやスライド資料などで使用するアイコンも、Illustratorで作成することが可能です。例えばホームページなどにある検索アイコンで使用される「虫眼鏡アイコン」などは、楕円形ツールで丸を作り、下側に直線を追加するだけで完成します。線の形を少し変えるだけで、オリジナルのアイコンを作成できるでしょう。
またホームページなどの問い合わせアイコン（メールアイコン）なども、下記の手順で手軽に作成できます。
- 長方形ツールで四角の図形を作る
- 四角の中に新しく正方形の図形を作る
- 「ダイレクト選択ツール」を選択する
- 四角の中の正方形のアンカーポイントを一つ削除して三角の線を作る
- 選択ツールで配置場所と大きさを調整する
上記のように複数の図形を活用することで、多種多様なアイコンを作成できます。まずは簡単なアイコンをから作成して、どんどんクオリティを高くしていきましょう。
llustratorでおしゃれなアイコンを作るコツ
前述では、Illustratorでアイコンを手軽に作る方法について解説しました。しかしIllustratorの別の機能や外部ツールなどを使用することで、おしゃれなアイコンを効率的に作成できます。ここでは、おしゃれなアイコンを作るための下記のコツを紹介します。
上記の4つについて解説するので、ぜひ活用してください。
生成AI機能を活用する
「Illustrator 2024」以降のバージョンには、近年注目されている「画像生成AI機能」が搭載されています。日本語のプロンプトにも対応しており、参考画像を元に画像生成を行うことが可能です。そのため、写真などをイラストにしたり、オリジナルロゴを作成したりする際に活躍します。
編集画面の「プロパティ」から画像の種類やカラーの指定、プロンプトの入力などができます。ベクター画像しか生成できないデメリットはありますが、おしゃれで可愛いイラストなどを作成できるでしょう。なおIllustratorの生成AI機能の使い方は下記の記事で詳しく解説しているので、ぜひ参考にしてください。
曲線ツールを使用する
曲線ツールとは、作成したイラストや図形を編集できる機能のことです。具体的には直線の図形を歪ませたり、手書きイラストに曲線を加えたりなど、さまざまな用途に使用されます。また曲線ツールだけで図形やイラストなどを作成することも可能です。
例えばハートのイラストに独自性を加える場合は、編集したい箇所のパスをクリックすると、線の角度を自由に変更できます。アウトライン化したテキストの編集にも利用できるので、ちょっと一工夫したアイコンを作りたい方は曲線ツールを利用してみてください。
フリー素材を利用する
Illustratorの使い方に慣れていない方は、外部サイトで配布されているフリー素材を使ってみましょう。例えば「イラストAC」に登録すれば、質の高いイラスト素材を無料でダウンロードすることが可能です。Illustratorのフォーマット（.ai）での保存もできるので、フリー素材を直接編集しながらデザインを楽しめるでしょう。
ただし使用するフリー素材によっては、商用利用ができなかったり、クレジットの記載が必要だったりします。したがってフリー素材でアイコンを作成する際は、利用規約をしっかりと確認してください。
デザインの勉強をする
よりおしゃれなアイコンを作ったり、アイコン・ロゴ作成などデザインの仕事にチャレンジしたりしたい方には、デザインの勉強をおすすめします。なぜならデザインの基本的なノウハウを理解するだけでも、クオリティはグッと高くなるからです。
例えば統一感のある配色方法を理解すれば、SNSで「この人のアイコン可愛い！」となるかもしれません。イラストを描ける方であれば、イラストの制作依頼が来る可能性もあるでしょう。勉強には多少の時間が必要ですが、デザインは人生の幅を広げるスキルでもあるので、ぜひ挑戦してみてください。
Illustratorで作成したアイコンを使用する際の注意点
最後に、Illustratorで作成したアイコンを使用する際の注意点を紹介します。
Illustratorでアイコンを作成する際は、上記の3つに注意しましょう。順番に解説します。
背景を透過する
SNSなどで使用するアイコンを作成する際は、必ず背景を透過して保存しましょう。Illustratorに限らずデザインツールの多くは四角型・長方形で画像を保存します。したがって背景透過ができていないと、後ろの色が表示されてしまうので注意してください。
印刷時は適切な設定を行う
作成したアイコンを印刷する際は、適切な設定を行う必要があります。例えば、より美しい発色の印刷物を作成する際はカラーの設定を「CMYK」に指定することが大切です。名刺やチラシなどの作成では、トリムマーク（とんぼ）の使い方を覚える必要があります。画像やテキストを使ったデザインでは、「画像埋め込み」や「テキストのアウトライン化」をしないと適切に印刷できない可能性があります。そのため印刷目的でアイコンを作る方は、下記の記事にも目を通しておきましょう。
SNSによって適切なサイズが異なる
SNS用のアイコンを作る際は、各メディアに適切なサイズで作成する必要があります。例えばサイズが大きすぎると、画像の一部しか表示できないかもしれません。一方で小さいサイズの場合は画像を拡大する必要があり、画質が劣化する可能性があるのです。したがってInstagramやX（旧Twitter）などのアイコンを作成する際は、下記の情報を参考にしてください。
| SNS | 推奨サイズ |
|---|---|
| X（旧：Twitter） | 400×400px |
| 320×320px | |
| TikTok | 20×20px以上 |
| YouTube | 800×800px |
| 176×176px |
SNSで使用するアイコンをIllustratorで作成する際は、上記のサイズを参考に作成しましょう。
Illustratorの使い方を勉強して魅力的なアイコンを作ってみよう！
Illustratorでアイコンを作成する方法は多数存在します。しかしIllustratorは機能が多いソフトなので、簡単に作れるやり方から勉強して、徐々にクオリティを高めていきましょう。
Illustratorの本格的な使い方を知りたい方や、Webデザイナーに興味のある方には、SHElikes（シーライクス）のレッスンをおすすめします。SHElikesではデザインツールの実践的な使い方や、デザインの基礎から本格的なノウハウを学習することが可能です。
他の受講生とつながれる環境なので、仲間と楽しみながら成長を実感できるでしょう。「将来はデザインの仕事もしてみたい…！」と考えている方は、ぜひ無料体験レッスンにお越しください。
