IllustroのFigmaプラグインの入れ方と使い方

レイアウトをすでにFigmaで開いているなら、ブラウザに切り替えずに、そのファイルの中で生成しましょう。IllustroがFigmaコミュニティに登場したのも、まさにそのためです。ここでは、Figmaプラグインの入れ方から使い方までを順に紹介します。

1. プラグインをインストールする

FigmaコミュニティのIllustro AIを開いて、インストールします。あとは作業中のファイルで、ツールバーの「アクション」から「プラグインとウィジェット」を開き、Illustro AIを選んで起動するだけです。

2. Illustroのアカウントを連携する

初めて起動すると、ログインを求められます。illustro.appで使っているのと同じアカウントでログインすれば、スタイル、クレジット、保存したファイルがそのまま同期されます。

3. フレームに合わせて場面を書く

プロンプトを書く前に、イラストを入れる枠を確認しましょう。幅1440pxのメインビジュアルと320pxの空状態の画面では、合う構図が違います。書くのは、誰が、どこで、何をしているか。たとえば「ノートPCでスマホアプリを確認するプロダクトデザイナー、やわらかな自然光、シンプルなデスク」のように書きます。

4. 配置して、コントラストを確かめる

白紙のページではなく、実際のレイアウトに置きます。本番の文字や背景と並べて、見え方を確認しましょう。切り取り方が合わなければ、横長の場面を無理に拡大縮小して合わせるより、もっと寄った構図で生成し直すのが近道です。

Webで生成して書き出す方法も、もちろん使えます。プラグインは、最終的な置き場所がFigmaだと決まっているときのためのものです。配置したあとで切り取り方が合わないと感じたら、一からプロンプトを書き直すより、イラストを編集するほうが早く済みます。