目次
イラレでアイコンを作成するには
IllustratorでWebページやチラシなどのワンポイントにも使用できるアイコンを作成する時のポイントや
使用するツールを確認します。
手順は動画にしていますのでぜひ見てみてください！記事の下部に動画を張っています。
アイコンは、１色のアイコンの場合線を使わず塗りのみで完成させるようにすると扱いやすくなるので、奴理能美のオブジェクトに仕上げる方法も確認しましょう。
ロゴ作成の基本ツールを確認
ロゴ作成は、図形を組み合わせて完成させるためいくつかのツールを使用します。
よく使うのがパスファインダーパネルです。
複数のパスを選択し、合体や分割などができます。
パスファインダーには下記のボタンがあります。
- 合体
- 前面オブジェクトで型抜き
- 交差
- 中マド
- 分割
- 刈り込み
- 合流
- 切り抜き
- アウトライン
- 背面オブジェクトで型抜き
さらに、複数のシェイプを組み合わせる際に便利なのがシェイプ形成ツールです。
マウス操作で直感的にシェイプを合体したり削除したりすることができます。
これらでシェイプを合体してロゴにしていきます。
歯車型のアイコンの作成方法
歯車のアイコンの作成方法を確認してみましょう。
まず、ベースになる正円を２つ作成します。大小作成し、重ねましょう。
しっかり真ん中で重ねられるよう、スマートガイド（移動中、操作中に画面上に表示されるガイド）で
「中央」と出てくるときに配置するか、
整列パネルで水平、垂直の中央を押して真ん中に揃えます。
正円を作成するには、楕円形ツールをShiftを押しながらドラックです。
重ねた小さい円のシェイプで、大きい円を型抜きしドーナツ型にします。
パスファインダーを使用する方法と、シェイプ形成ツールを使用する方法があります。
パスファインダーの場合
- 重ねたオブジェクトを全て選択
- パスファインダーパネル→中まど
シェイプ形成ツールの場合
- 重ねたオブジェクトを全て選択
- シェイプ形成ツールでAlt(option)を押しながらクリック
次に、歯車の歯の部分を作成します。長方形ツールで作成した四角形を変形して台形にします。
自由変形ツールを使うと、左右対称な綺麗な台形が作りやすいです。
- 四角形を選択する
- 自由変形ツールを持ち、遠近変形モードを選択
- 角のアンカーをドラックして台形に変形
作成した台形を、ベースの円の上に配置します。
整列パネルで水平の中央を押し、真ん中に揃えます。
あとは、台形を回転複製していきます。
- 台形を選択する
- 回転ツールを持ち、基点を変更するためにAlt(optiom)を押しながらベースの円の中心を選択
- 角度に45度と入力し、コピーを押す
最後、コピーではなくOKを押すと、回転のみで複製されないのでコピーを押して回転複製していきましょう。
形ができてきました。
合体して一つのオブジェクトにしましょう。
合体の作業もパスファイイダーとシェイプ形成ツールの両方でできますが、
今回は、パスファインダーの方が選択してからワンクリックでできるので早そうです。
- 合体したいオブジェクトを全て選択
- パスファインダーパネル → 合体
これで合体して一つのオブジェクトにまとまったアイコンができました。
仕上げ 塗りのみのオブジェクトにする際のテクニック
さて、ロゴの作成について、最終的に単色のロゴに仕上げる際、線に色は設定せず塗りのみで構成すると扱いやすいです。
線・塗りが混合していると、色の変更などを行う際に線にも塗りにも設定を行わなければならず、扱いづらいです。
また、webアイコンとして使用する際、SVGなどに応用する際も
パスがシンプルでないと綺麗に見えませんので、アイコンは塗りのみに仕上げるのがよいと思います。
線で作成されたシェイプです。
このような線のみのオブジェクトを塗りに変換するには下記のように行います。
- オブジェクトを選択
- オブジェクトメニュー→分割・拡張
これで、線でなく塗りのオブジェクトに変換されますので、あとは合体してまとめる処理などをします。
【Illustrator基本操作】webアイコンの作成方法 まとめ
いかがでしたでしょうか？
今回の操作方法は、Youtubeで実際に説明していますのでぜひチェックしてください！
毎週水曜日にIllustratorのワンポイントレッスン、「解決！なみちゃんねる」を更新中です。
