【初心者向け】Illustratorビギナーが最初に押さえておくべき機能と仕様

アドビシステムズ社のIllustrator（イラストレーター）は、Webデザインに欠かせないアプリケーションソフトのひとつ。その名の通り、イラストの作成に最適な機能が搭載されています。この記事ではIllustratorの基本的な機能と仕様についてご紹介していきます。バージョンによって詳細が異なることもありますが、今回はどのバージョンにも共通する基本的な機能の説明となります。

Illustratorのファイル設定

まずはIllustratorで作成するファイルの基本的な設定について知りましょう。

アートボード

「アートボード」とは、データを出力する際の表示範囲です。イラストを描く紙をイメージすると分かりやすいでしょう。Illustrator CS4以降では、ひとつのファイルで複数のアートボードを管理できるようになりました。また、Webデザインでは、単位は「ピクセル」を選択します。1ピクセルは、コンピュータ上で画像データを表現する際の最小単位です。

カラーモード

「カラーモード」とは、データを出力する際の色の表現方法です。「CMYK」「RGB」いずれかを選択します。

「CMYK」とは、C（シアン）M（マゼンタ）Y（イエロー）K（ブラック）のことで、印刷物に用いられるインクの色を示します。色が重なるほど暗くなり、黒に近づくことが特徴です。

「RGB」とは、R（レッド）G（グリーン）B（ブルー）のことで、光の三原色を示します。色が重なるほど明るくなり白に近づくことが特徴です。PCモニタやスマホ・タブレットの画面は光で色を表現するので、WEB用データを作成する際はRGBを選択します。

Illustratorの基本的な仕様

Illustratorで作業する際に知っておきたい、基本的な概念を理解しましょう。

ベクター画像とラスター画像

「ベクター画像」とは、点（座標）と線（数式）の情報で構成される画像です。どんなに大きく拡大しても、画像が乱れることはありません。Illustratorは、ベクター画像の編集に特化したアプリケーションです。

「ラスター画像（ビットマップ画像）」とは、ピクセル単位の色の集合で表現される画像です。本来の解像度よりも大きく拡大すると、ギザギザと荒れた画像になってしまいます。ラスター画像編集の代表的なアプリケーションはIllustratorの姉妹ソフト「Photoshop」です。なおIllustratorのファイルにも、ラスター画像を配置することができます。

オブジェクトとバウンディングボックス

「オブジェクト」とは、図形・シェイプ・テキストといった、Illustratorファイルの構成要素です。オブジェクトを選択した際に表示される長方形の枠線を「バウンディングボックス」といいます。

シェイプと線・塗り

「シェイプ」とは、Illustratorにおける作業のメインとなる「線」と「塗り」で構成されるベクター形式のオブジェクトです。「線」には色・太さ・線の種類（連続した線・破線・ブラシなど）を設定できます。線で囲まれた範囲は「塗り」となり、こちらも色・グラデーション・パターン（柄）を設定できます。

パスの構造

「パス」は、シェイプを構成する線です。「アンカーポイント（点）」と、その間を結ぶ「パスセグメント（曲線あるいは直線）」によって構成されています。

https://helpx.adobe.com/jp/illustrator/using/drawing-basics.html

各部の名称

A：端点

B：アンカーポイント（選択済み）

C：アンカーポイント（未選択）

D：パスセグメント

E：方向線（ハンドル）

F：方向点

アンカーポイントから伸びる「方向線（ハンドル）」の先端が「方向点」です。方向点を移動させることで、パスセグメントの曲線を自由に変更することができます。なお選択されているアンカーポイントは黒い点、未選択だと白い点です。

クローズパスとオープンパス

「クローズパス（クローズドパス）」とは、オブジェクトのパスに切れ目がなく閉じていること。例えば、円や多角形などはクローズパスです。

「オープンパス」とは、パスの両端が閉じていないこと。オープンパスのオブジェクトも、両端の点を直線で結ぶ形で塗りを設定することが可能です。

Illustratorの基本的なツール

ツールパネルに格納されているツールを選び、オブジェクトの編集を行っていきます。

選択ツール・ダイレクト選択ツール

ツールパネルの一番上の段にある黒い矢印は「選択ツール」です。選択ツールを選んだ状態でオブジェクトの一部分をクリックするとバウンディングボックスが表示され、全体の移動や編集を行うことができます。

白い矢印は「ダイレクト選択ツール」です。オブジェクトを構成する方向点やアンカーポイントを個別に選択して編集することができます。Shiftキーを押しながらクリックすると、複数のアンカーポイントをまとめて選択することが可能です。

直線ツール・ペンツール

「直線ツール」を選択した状態で、始点から終点までをドラッグすると、一本の直線を描くことができます。

「ペンツール」を選択した状態で画面上をクリックすると、アンカーポイントが追加されます。そのまま別の位置をクリックすると次のアンカーポイントが追加され、直線セグメントで連結されていきます。アンカーポイントの追加を終了したいときには、Ctrlキー（Windows）あるいはCommandキー（Mac）を押しながら画面をクリックしましょう。また、最後に1番目のアンカーポイントをクリックすると、クローズパスにすることができます。

色の設定（グラデーション・パターン）

オブジェクトの線と塗りにはそれぞれに色を設定することができます。

対象のオブジェクトを選択した状態で、「カラーパネル」から設定します。

グラデーション

色は単色だけではなく、グラデーションを指定することもできます。「グラデーションパネル」で、2色以上の色・色の分岐のバランス・グラデーションの形状（線状・円形）といった詳細な設定が可能です。

パターン

塗りにパターン（繰り返しの柄）を設定することもできます。オブジェクトを選択した状態で「スウォッチパネル」のパターンを選択すると、塗りに反映されます。ライブラリにはサンプルパターンが用意されていますが、もちろん自作のパターンを登録することも可能です。

文字ツール

「文字ツール」を選択した状態で画面をクリックすると、文字を入力できます。入力した文字は線と塗りも設定でき、「文字パネル」から大きさ・フォントの種類・文字間隔などの編集が可能です。

web用データの出力

Web用にデータを出力する際は「ファイル」→「Web用に保存」（あるいは「Webおよびデバイス用に保存」）を選択、「プリセット」で画像形式と圧縮率が選択できます。圧縮率は低いほど画像が劣化しませんが、データ量が大きくなります。

Webでおもに使用される画像は以下の3種類、いずれもラスター形式です。

・GIF（ジフ・ギフ）：最大256色のため、色数が少ないバナーやイラストの保存に適しています。

・JPEG（ジェイペグ）：フルカラー。ファイルサイズの圧縮率が高く、写真の保存に適しています。

・PNG（ピング）：一部を透過させることが可能です。

まとめ

Illustratorの基本的な仕様や機能を解説しました。印刷用とWeb用では、カラーモードや出力方法に違いはあるものの、基本的な編集方法は共通です。

初心者にとってアンカーポイントや方向点の操作は簡単ではないかもしれませんが、実際に操作しながら学んでいくのが一番の近道でしょう。