IllustratorをAIから操作できる「Illustrator MCP Server」を作った。ClaudeなどのAIとイラレをつないで、データの中身を調べたり、編集したり、書き出したりできるツールだ。
きっかけは、データの確認と書き出し
きっかけは単純で、イラレのデータをもらったときに、使われている色やフォント、文字サイズなんかがまとめてわかると嬉しいな、と思ったこと。いわゆるデザイントークンとして取り出せれば、Webに実装するときにも使いやすい。あとは書き出しが面倒だった。
調べると既存のツールもあったけど、自分がやりたいことにはちょっと物足りなかった。だったら自分で作ろう、というくらいの気持ちで作り始めた。
「このデザインの色とフォントをまとめて」
「アートボードをまとめてSVGにして」
まずは、こういうことを会話で頼めるようにした。そこから機能を足していくうちに、図形やテキストの作成、レイアウトの調整、保存、印刷前のチェックまでできるようになった。Adobe公式のMCPもあるけど、自分たちが制作で使いたい機能を盛り込んで、かなり充実したものになったと思う。
イラレの操作をAIにつないだら、制作までできた
仕組みとしては、Illustratorにもともと備わっているスクリプト機能「ExtendScript」を使っている。文字や図形を作る、色を調べる、ファイルを書き出す。そうした操作をAIから呼び出せるようにする窓口が、MCPだ。
AIが指示に応じて操作を選び、ツールがイラレで実行して、その結果をAIに返す。このやり取りを繰り返すことで、複数の工程を進められる。
結果的に、AIが必要な操作を自分で組み合わせて、イラレで制作を進められるところまで来た。下のポスターと名刺は、どちらもClaudeとの会話だけで作ったもの。イラレを手で操作してはいない。
イベントポスターの作例「SYNC TOKYO 2026」。文字や図形の配置も、会話を通じて作っている。
名刺の作例「KUMO Studio」。画像として生成するのではなく、Illustratorのデータとして作られる。
デザインを十分に学習したLLMなら、これを使ってそれなりのものを作れるんじゃないか、とも思っている。そのあたりは、まだまだ試してみたい。
誤字脱字だけでなく、内容の食い違いにも気づく
ただ、作ること以上に、今のところ便利だと感じたのはチェックのほうだった。
試しに友達のデータをチェックしてみたら、誤字脱字はもちろん、「AとBで内容が食い違っている」といった指摘まで返ってきた。文字を拾うだけでなく、書いてあることの意味や関係まで見ているようで、これは普通に助かるなと思った。
このチェックには、ツールとAIで役割分担がある。ツール側では、イラレのテキストを取り出して、ダミーテキストや特定の表記ゆれを決まったルールで調べる。取り出した文章はAIにも渡し、誤字脱字や内容の食い違いをさらに見てもらう。
同じ名前が別の場所で違う表記になっていないか。複数の案で説明が食い違っていないか。こうした関係を考える部分は、LLMが担当する。今回の指摘も、意味を考えながら読むことが確認作業に役立つと感じた場面だった。
最終的には人が確認するにしても、自分では見落としていたところに気づくきっかけになる。何かを自動で作らせなくても、データを渡して一緒に確認してもらうだけで、十分使い道がある。
イラレはまだまだ現役。導入もできるだけ簡単に
画面のデザインではFigmaを使う場面が多いかもしれないけど、イラレはまだまだ現役だ。受け取るデータがイラレのこともあるし、紙ものを作るときにも使う。普段の仕事で触る道具だから、こういう小さな手間が減るだけでも嬉しい。
導入も、できるだけ難しくならないようにしてある。ChatGPTなどのAIを普段から使っている人なら、パソコンの設定に詳しくなくても始めやすいように、READMEに手順をまとめた。Claude Desktop向けには、拡張機能ファイルを入れて使う方法も用意している。
よくわからなければ、READMEのリンクをChatGPTなどに渡して、「これを導入したい。使い方も教えて」と聞いてみてほしい。相談しているAIから直接イラレを操作できるかは利用環境によるけど、何が必要で、どう設定すればいいかを確認するところから手伝ってもらえる。
Illustrator MCP Server — GitHub・README
導入を相談するときに、そのまま渡せる文章も下に用意した。イラレを使っている人は、ぜひ試してみてほしい。
必要なものは、自分たちで作っていく
僕らIE3は、表現を作るのと同じように、そのための道具や仕組みも作っていきたい。今回も「データの中身を知りたい」「書き出しが面倒」という、仕事の中の小さな困りごとから始まった。
表現だけにとらわれず、必要なものは自分たちでなんでも作っていく。IE3はそういう姿勢で仕事をしている。
デザインのことも、それを作るためのツールや仕組みのことも。「こういうのがあったらいいんだけど」という話があれば、気軽に相談してほしい。
導入を相談するときのプロンプト
以下をコピーして、ChatGPTなどに渡してみてほしい。
IllustratorをAIから操作できる「Illustrator MCP Server」を導入して、使い方を知りたいです。このリポジトリのREADMEを読んで、私の環境に合う導入方法を案内してください。https://github.com/ie3jp/illustrator-mcp-serverパソコンの設定にはあまり詳しくありません。まず、使っているOS、Illustratorのバージョン、AIアプリや契約など、必要なことを私に確認してください。そのうえで、できるだけ簡単な方法を選び、一度にたくさん説明せず、操作を一つずつ案内してください。今あなたと話しているアプリから直接Illustratorを操作できるのか、別のアプリや設定が必要なのかも、最初に教えてください。リンク先を読めない場合は、推測せず、必要な部分を貼るよう私に伝えてください。導入できたら、元のデータを変更しない方法で、次の使い方を教えてください。・使われている色、フォント、文字サイズをまとめる・誤字脱字、表記ゆれ、ダミーテキストの残りを探す・複数の箇所に書かれた名称、日付、金額、説明などに食い違いがないか確認する・アートボードをPNGやSVGで書き出すチェック結果は、該当する場所と理由がわかる形で示し、明らかな誤りと、確認が必要な指摘を分けてください。修正や書き出しを実行する前には、対象と内容を私に確認してください。