こんにちは！デザイナーの千田です。

近年、FigmaやBlenderといった多様なデザインツールの登場により、デザイン表現の幅が大きく広がっています。しかしその一方で、デザイナーに求められるスキルの幅も広がり、負担が増えているのが現実です。 だからこそ、IllustratorなどのAI機能を上手に活用し、限られた時間の中で高品質なデザインを効率よく生み出す工夫が重要です。

本記事は、前回投稿した「Adobe PhotoshopのAI機能を活用したデザインテクニック」のIllustrator版です。 IllustratorのAI機能を活用して、効率的に作業を進める方法や実践的なテクニックを詳しく解説していきますので、ぜひ参考にしてみてください。

AIを活用することのメリット

1. AIによる効率化でクオリティアップに時間を当てられる

IllustratorのAI機能を活用することで、時間のかかる単純作業や、複雑な表現を必要とする作業の時間を大幅に短縮できる場合があります。

こうして効率化によって生まれた時間を活用することで、細部のデザイン調整やクオリティアップに取り組むことが可能になり、最終的にはデザイン全体の品質向上につながります。

分かりやすい例を挙げると、ビットマップ形式の画像や写真をベクター形式（パス化）に変換する作業があります。

一昔前であれば、手作業でイラストをトレースする必要がありましたが、現在のIllustratorには「オートトレース機能」が搭載されており、ワンクリックでベクター化が可能です。

AIの活用を「楽をするための手段」として捉えるのではなく、「デザイン全体の品質を高めるための手段」として捉えることが重要です。

2. 多数の表現を比較検討しやすくなり、創造性が拡張される

IllustratorのAI機能を活用することで、短時間で意図した作業を完了させることが可能です。

そのため、今までは時間的に難しかったパターン出しが行いやすくなり、多数の表現を比較検討しやすくなります。

とくにデザイナー自身であれば、わざわざ絵に起こさなくても脳内でイメージし、その表現が有効的な手段か、またはクライアントがイメージしているものなのか判断すること自体は可能ですが、プロではないクライアント自身がジャッジする際はやはり絵に起こして示す方が検討してもらいやすいです。

今までは時間的な制約で実現が難しかったパターン出しのボリュームを上げることで、クライアントが検討しやすくなり、修正や変更の回数が減り、案件自体がスムーズに進むようになります。

これは前述した品質向上につながるだけではなく、クライアントとの信頼関係構築にも良い影響を与えます。

3. わずらわしい単純作業の手間を省ける

ひとつ目のメリットとして述べた内容と多少重複するところもありますが、同じことを繰り返し行うような単純作業はAI機能でカバーしやすい部分でもあります。

作業自体の楽しさで言うと、意外とこの単純作業が好きな人もいるかと思いますが、納期が迫っている状況などでできる限り早く制作したい場合などは、そうは言っていられない状況になることもあります。

そのような際にも、このような機能を知っているだけで、スピーディーに作業を進めることができ、自分自身の負担を軽減することができるようになります。

IllustratorのAI機能とその活用方法

類似オブジェクトの一括選択

形状が類似するオブジェクトをAIが自動判別し、一括選択することができます。

この機能の便利な点はそれだけではなく、一括選択されたオブジェクトすべてに対して、同様の編集をリアルタイムに加えていくことができるので、イラスト全体の雰囲気を確認しながら、個々の類似オブジェクトの調整を加えることができ、作業の効率化につながります。

類似オブジェクトは元の形状で判別されるため、色が異なっていても類似オブジェクトとして認識されます。

また、回転や拡大縮小が加えられていても、ベースとなる形状が同じもので構成されていれば、カラーと同様に類似オブジェクトとして認識され、選択されます。

活用シーンについて

・チラシなどで使用されたイラストの大量修正
作成したイラストに対して修正が発生したときに、複雑に作り込まれているイラストの場合手間がかかってしまいます。そのような場合も、本機能を活用することで正確かつ短時間で修正対応することが可能です。

・複数ページに対するイラストのデザイン調整
ページものなど、同じ要素が連続して並べられるデザインの場合も活用しやすいです。イラストに限らず、類似するオブジェクトであれば使用できるので、どの箇所に類似オブジェクトが使われているのか把握しやすくなり、修正漏れも軽減されます。

適用手順

編集したいIllustratorファイルを開きます。
今回は解説用に、色違いのソフトクリームを4つ複製したデータを用意しました。

一括選択したいオブジェクトを選択します。今回は左に配置した緑色のソフトクリームの、クリームの部分だけを選択しています。

上部メニューの「選択」→「オブジェクトを一括選択」をクリックします。

すると、右に続く3つのソフトクリームの、クリーム部分も同様に選択された状態になるのが確認できます。

この状態で、元の選択されたソフトクリーム（一番左）を編集すると、右に続くソフトクリームも同様の編集が適用されているのれるのが確認できます。上の画像では縦に長くなる編集を加えています。

任意の編集が適用できたら、選択エリア外をクリックすることで確定されます。

パペットワープでポイントを指定して変形を加える

Illustratorには多数の変形機能が備わっていますが、そのなかでもこのパペットワープという変形ツールは、イラストの各所にピンを置き、指定した部位にのみ変形を加えることが可能です。

たとえば以下の解説で使用するキリンのような動物の場合、四足歩行で自立しており、足がバランスよく地面についた状態で変形が加えられた方が自然です。

この自然な形を維持した状態で変形を加えるために、動かしたい箇所と、動いてほしくない箇所にピンを指定し、コントロールする箇所を指定することで、より自然な変形を加えていくことができます。

活用シーンについて

・ポスターや広告デザインでの動きのある表現
ポスターや広告用のデザインで、静的なイラストに動きやストーリー性を加えるために利用できます。たとえば、飛び跳ねる動物、風にたなびく布、踊る人物など、ダイナミックな動きを簡単に表現できます。

・デザインの装飾で使用する建築パースや風景画の修正
建物のパースや風景画で、細かな部分を調整したい場合にも利用できます。たとえば、木々の枝や建物のアーチを微調整することで、より自然な風合いを加えることができます。

適用手順

変形を加えたいイラストのベクターファイルを開きます。今回はキリンのイラストを使用しています。

変形を加えたいイラスト全体を選択します。（イラスト全体がグループ化されてひとまとまりになっている必要があります。）

画面左側のツール一覧パネルから、「パペットワープツール」を選択します。

Illustratorの初期設定では、このようにコンテンツに応じた初期値が適用された状態になり、AIが自動判別した位置にピンが置かれているのが確認できます。画像では、足、尻尾、前足の関節、頭にピンが置かれています。

試しに「頭」の位置に置かれたピンを下に移動させてみます。すると、他の箇所に置かれたピンの位置は固定のまま、顔の位置が自然な形で変形しているのが分かります。
※右前足のみ、ピンが置かれていないので、頭の位置の変形と連動して後ろに動いているのが確認できます。

さらに尻尾の位置にあるピンを上に移動させてみます。先ほどと同じような考え方で、他のピンが置かれた箇所は固定で、尻尾の部位だけが上に動いているのが確認できます。

さらに、左後ろ足に置かれたピンを、前方へ移動させてみます。こちらも同じように、指定したピンの位置のみ変形が適用されているのが分かります。また、イラスト作成時にレイヤーの重ね順も工夫することで、上の画像のように奥行きも反映することが可能です。

テキスト指示でイラストを生成する

最新バージョンのIllustratorでは、「Adobe Firefly」という生成AIの機能を使用することが可能です。

この「Adobe Firefly」とは、テキストで画像のイメージを指定し、その指定された内容に基づいてAIが画像を自動生成してくれる機能です。

生成される画像はベクターデータにも対応しており、生成された画像に対して編集を加えることも可能です。

ゼロからイラストを手作業で作成する場合、多くの時間を要する場合がほとんどですが、この生成AI機能を上手に活用すれば作業時間を大幅に短縮することができます。

活用シーンについて

・チラシなどで使用するイラスト素材の作成
チラシなどで必要なビジュアル素材を短期間で準備する際に役立ちます。特定の季節感やトレンドを表現したイラストをテキスト指示で生成し、デザイン全体の統一感を保ちながら作成できます。

・WebやアプリのUIデザイン素材
WebサイトやアプリケーションのUIデザインに必要なアイコンや背景イラストを簡単に生成できます。たとえば、「シンプルでフラットなデザインのメールアイコン」など具体的に指示することで、デザインコンセプトに合った素材を手早く作成できます。

適用手順

Illustratorのファイルを新規作成して白紙ページを開きます。

上部メニューの「オブジェクト」→「生成ベクター（Beta）」を選択します。

すると、生成イラストのイメージを指定するウインドウが表示されます。

今回は解説用に、黒い猫が寝ている様子のイラストを生成しようと思います。

プロンプトのテキスト入力欄に、以下のように指示を加えました。
「黒くて毛がフサフサの猫。丸くなって眠っている。」

ディテールのバーでイラストの複雑さを調整することもできます。今回はシンプルなイラストを生成したいので、バーを一番左の「最低」にしています。

スタイルの項目を指定することで、イラストのテイストも選ぶことができます。今回は試しに「ローポリ 3D」を選択してみました。

生成ボタンをクリックすると、イラストの生成が開始されます。マシンのスペックにもよるかと思いますが、生成完了まで30秒〜1分程度の時間を要します。

イラストが生成されました。プロパティパネルに3つの候補が用意されており、イメージに近いものを選択可能です。

IllustratorのAI機能を活用するコツと注意点

ここまでにご紹介した3つのAI機能は、Illustratorの一部の機能で、他にもたくさんのAIを用いた機能が組み込まれています。

AI機能を上手に活用することで作業時間の短縮と、クオリティアップにつなげることができますが、より効果的に活用していくためには以下のようなコツと注意点を押さえておく必要があります。

AI機能はあくまで補助ツールとして活用する

AI機能は大幅な時間短縮と、デザイナー自身の技術不足も補ってくれる強力なツールでもありますが、あくまで補助ツールであることを忘れずに使用するようにしましょう。

とくにイラストの自動生成機能などは、近い答えを出してくれますが、100点のクオリティを一発で生み出すことは現状難しく、最終的にはデザイナー自身が手作業で調整を加えていく必要があります。

その技術力を高めていく努力は惜しまずに継続していきましょう。

別のAIサービスを使用する場合は商用利用が可能か確認する

Illustratorで自動生成されたベクター画像はそのまま商用利用することが可能です。

しかし、仮に別の生成AI画像サービスを利用する場合は、サービスごとに規約が異なるため、とくに商用利用が可能かどうか注意し、利用目的に合わせて使い分けるようにしてください。

生成AIよりも手作業で作成した方が近道な場合がある

生成AIのように便利な機能が登場してしまうと、自分でゼロから作り上げるという手段を忘れてしまう場合もあるかと思います。でも、生成AIはあくまで補助ツールであり、内容次第ではイメージ通りのものをなかなか生成してくれないこともあります。

そのような場合に、何度も生成AIに対して修正を加えるよりも、ゼロから手作業で作り上げた方が短時間で作業が完了する場合もあります。

目的に合わせて臨機応変に使い分け、生成AIに頼りすぎないようにする意識も忘れずにデザインに取り組みましょう。

まとめ

Illustratorなどのデザイン制作ツールをはじめ、デザインツールの機能は拡張され続けています。

それと同時に、デザイナーの表現の幅が広がり、覚えなければいけない知識も増えています。

デザイナーに求められるクオリティやハードルが上がっていく一方で、クライアント側の広告に当てられる予算は大きく変動することはないため、この点をいかに補っていくかが今後の課題のひとつとなるでしょう。

今回ご紹介したAI機能を上手に活用していくことで、この課題が少しでも緩和できれば幸いです。

GIGでは、AIを活用した先進的な手法を取り入れ、デザインに取り組んでいます。

「予算は限られているけれど高いクオリティが必要」「短納期でも一定以上の品質を確保したい」といったご要望にも、AI技術を効果的に活用することで、お客さまの求めるアウトプットを実現しています。

どのような状況でも、お客さまの課題に最適なデザインをご提案いたします。

まずはお気軽にご相談ください！

■株式会社GIG
お問い合わせはこちら
採用応募はこちら（GIG採用サイト）
採用応募はこちら（Wantedly）
採用応募はこちら（Green）

千田 崇史

大学時代はメディアデザインを学ぶ傍ら、デザイン制作会社でアルバイトをして下積みの経験を積む。その後、印刷会社とWeb制作会社にて、主にWebデザイン・写真・動画・チラシ・名刺など、幅広い媒体のデザイン制作を経験した後、2021年10月 GIGにジョイン。現在はクリエイティブ事業部のデザイナーとして、クライアントワークを行なっている。