コーヒー屋がAI画像ツールを作った理由 – imgx-mcp

imgx-mcp 開発ストーリー — コーヒー屋が画像ツールを作った理由

京都でイベント出店専門のコーヒー店を営みながら、コーヒーアプリと開発ツールを作っています。
その過程で、AI で画像を生成・編集するためのツールを作ることになりました。
なぜ、小さなコーヒー屋がそんなものを作ることになったのか?

AI を使って記事やコンテンツを制作しているとき、「ここにこんな画像欲しいなあ」となることはありませんか? このツールは、そんな願いをできるだけスムーズに叶えるために作りました。

この記事に、アプリの仕組みや作り方といった技術的な話はありません。当店がどんな問題に向き合い、どう考えて形にしたのか——モノ作りの姿勢とプロセスをお伝えする記事です。


多様な画像が必要になった

コーヒーアプリの開発とマーケティング計画を進める中で、画像が必要になる場面が増えました。

ブログ記事のカバー画像、OGP 画像(SNS でリンクを共有したときに表示されるサムネイル)、図解、ロゴ、アイコン、スライド資料。装飾的なデザインというより、主に実務として求められる画像です。
記事を書けば OGP がいるし、アプリを公開すればテキストやスクリーンショットだけでは伝わらない場面があります。

そんな画像が必要になるたびに、作業の流れが止まりました。
なぜ、止まってしまうのか?


コンテキスト(文脈)の断絶

当店の開発は、AI アシスタント(Claude Code)と会話しながら進めています。記事を書き、アプリを作り、仕様と設計を議論する。すべてがひとつの作業セッションの中で進んでいます。

この流れの中で画像が必要になった時、別の画像生成サービスに切り替える必要がありました。
(Cloud Code本体に画像生成機能は含まれないため)

問題は、AIサービスを切り替えた際にコンテキスト——それまでの作業の流れや背景情報——が途切れることでした。

開発計画、記事の意図、ブランドのトーン、前後の文脈。一緒に作業している AI はそのすべてを把握しています。
しかし、画像生成のために別のサービスを開くと、そこにはコンテキストがありません。
開発の背景から説明し直し、記事の趣旨を伝え、どんな画像が必要かをゼロから組み立てることになります。

同じ情報を別々の対象に別々に伝える。その数と量が増えるほど精度と速度が落ちます。
この問題は、急速に多様化するサービスに開発現場が追いつかなくなることで、本来の目的である効率化が阻害されてしまうケースの本質部分です。
道具が増えても、使えなければ意味がありません。


プロンプト(指示文)の壁

AI に画像を生成させるための指示文——プロンプトと呼ばれるもの——を手で書くのは、思った以上に難しいものでした。

頭の中にある「こういう画像が欲しい」を言語化しても、生成結果が意図と合わないことが多い。画像生成サービスごとの仕様や設定の違いを、毎回考慮しながら指示文を組み立てます。

一方で、一緒に作業している AI は会話の文脈から「どんな画像が必要か」を、ある程度理解しています。記事の内容、対象読者、開発者、コンテンツ制作者やブランドの方針、手法。その知識があるのに、画像生成には使えません。結局、自分でプロンプトを書き直すことになります。

AI が持っている文脈をそのまま画像生成に渡せたら、この手間は消える。そう考えました。


編集の往復

生成された画像が一発で意図通りになることは、ほとんどありません。

結果に満足できないとき、画像生成サービスとファイルマネージャーの間を行き来します。ダウンロードして、リネームして、別のサービスにアップロードして、パラメータを変えて再生成する。結果を確認して、また修正する。

一回一回は小さな手間でも、積み重なると無視できない摩擦になります。本来の作業——コードを書く、記事を書く——から意識が逸れていきます。

3つの摩擦——コンテキスト断絶・プロンプトの壁・編集の往復(EN) 3つの摩擦——コンテキスト断絶・プロンプトの壁・編集の往復(JA)

欲しかったもの

欲しかったのは、こういう仕組みでした。

一緒に作業している AI が、背景情報と会話の文脈、画像生成サービスの仕様まで踏まえた上で、適切な指示文を組み立てる。
生成結果のレビューと編集は同じセッション内で継続する。
完成した画像は、必要な場所に直接保存される。

別のサービスに切り替える必要がない。
コンテキストが途切れない。
計画、設計、会話から抜け落ちない。
指示文を手で書き直す必要もない。

(作る前は…)そういうツールが見当たらなかったので、自分で作りました。
それが imgx-mcp です。

imgx-mcp による統合ワークフロー(EN) imgx-mcp による統合ワークフロー(JA)

使い方の例
このページに掲載している OGP 画像やダイアグラム作成にも、imgx-mcp を使用しています。記事制作の会話の中で、コンテキストとimgx-mcpのスキルを保持したAIが、画像用プロンプト作成・生成・編集・参照リンクの埋め込みまでを一連のフローとして、適切に実行した結果です。

また、上の2枚は同じダイアグラムの英語版と日本語版となっています。記事やコンテンツの英語版と日本語版を作成する場合、説明用の画像もそれぞれの言語で用意する必要があります。そこで、テキストを一つ一つ変更したり、レイアウトのズレを調整したり、画像用プロンプトが変わってデザインやトーンが再現出来なくなったりと、通常であれば、なかなかに手間の掛かる作業が発生します。

imgx-mcp を使うと、会話中のAIが元画像とそのプロンプトや保存先といったコンテキストを把握しているので、「これの日本語版を作って」と指示するだけで片付きます(生成モデルの性能と imgx-mcp の合わせ技です)。


undo/redo — 安全に試行錯誤できる仕組み

imgx-mcp の最新版(v1.0.3)では、セッションベースの undo/redo 機能を追加しました。

画像の編集を重ねた後で「やっぱり3つ前の状態に戻したい」と思ったとき、以前なら最初からやり直すしかありませんでした。undo で任意の時点に戻り、そこから別の方向に編集を続けられます。

複数の画像を並行して作業する場合も、セッションを切り替えるだけで以前の編集チェーンに戻れます。どのセッションで何を試したかは履歴として記録されています。

この「安全にやり直せる仕組み」は、当店がソフトウェアを作る上で大切にしていることのひとつです。GitHub のバージョン管理に初めて触れたとき、「いつでも前の状態に戻せる」という安心感が、自由に試行錯誤する姿勢につながると感じました。画像の編集でも同じ体験を提供したいと考えています。

MCP ツールとしては undo_edit、redo_edit、edit_history、switch_session、clear_history、set_output_dir の 6 つを追加。合計 10 ツールになりました。


技術的土台の習得

imgx-mcp を作ったもう一つの理由があります。

当店の主力製品——コーヒーアプリ 6 本と SDA Toolkit(開発支援ツール)——を世の中に届けるためには、いくつかの技術的な土台が必要でした。
開発者向けの配布サービス(npm)への公開、AI ツールの拡張機能(Plugin)としての配布、AI が外部ツールを呼び出すための接続規格(MCP)への対応。これらはどれも、実際にやってみなければ身につかない類の知識です。

imgx-mcp は、その実践の場になりました。

自分が抱えている問題を解決する実用的なツールを作りながら、同時にソフトウェアを公開して届けるまでの一連の手順を習得する。
ドキュメントを読むだけでは分からないことが、実際に公開してユーザーからフィードバックをもらう過程で見えてきます(使ってくれるユーザーがいれば、ですが)。

公開の手順、バージョン管理、さまざまな AI ツールとの動作確認。
これらの経験は、コーヒーアプリや開発ツールを公開する際のノウハウとして蓄積されていきます。

imgX のプロトタイプ(MVP)は、数時間で完成。一般公開を目指してから、今の形になるまでに 4 日ほど。当店の開発環境が整いつつある現在、発想から実現(商用レベルでリリース)までに掛かるコストは以前に比べて数十分の一まで削減されています。


専門ノウハウの属人性が薄まる時代

専門ノウハウの属人性が薄まる——個人に閉じていたノウハウが構造化され、AIを通じて誰でも活用できるようになる

AI 駆動の開発フローは、今まさに構造的な変化を遂げつつあります。

imgx-mcp を作った当初、画像生成サービスのプロンプトの書き方やパラメータの仕様は、使う人が調べて覚える必要がありました。
しかし今は、AI ツールに Skill —— 知識や一連の手法を記述した参照ファイル —— を読み込ませることで、ユーザーがサービスの仕様を知らなくても、AI が自動的に最適な判断を下せるようになっています。

Skillの仕組みは、プロンプトエンジニアリング —— 指示文の適切な書き方 —— という専門ノウハウの共有と拡張に当たります。
この分野も一部で人気でしたが、Skillが登場して以来、あっという間に教材ビジネスが影を潜めることになりました。

この変化の本質は、“専門的なノウハウの属人性が急速に薄まっている”ことです。
画像生成サービスの使い方だけではありません。プロバイダごとの違い、最適なワークフロー、品質を上げるためのコツ —— こうした「どうやるか?」というノウハウを AI が自律的に参照し、いともたやすく適用できるようになってしまった。

そして、人は「何をしたいか?」だけが問われるようになりつつあります。

この流れは、まだ目に見える段階に達していない分野にも確実に及びます。コーヒーも同じです。

生豆の選択、焙煎のプロファイル設計、抽出パラメータの最適化、品質評価の体系化 —— 当店がコーヒーアプリで取り組んでいるのは、まさにこの構造的変化がコーヒー分野に到達したときに備えた基盤作りです。
ノウハウを体系化し、AI が参照できる形で構造化する。
人の経験と勘に依存してきた領域を、誰でも再現可能で共有可能な仕組みに変える。
(全ては無理ですが、基礎的な部分の構造化はすでに完了し、現実に適用可能なことを確認済みです)。

imgx-mcp はその過程で生まれた副産物ですが、当店の開発が向き合っている問題の縮図でもあります。


本開発を加速するサブ開発

imgx-mcp は、コーヒーアプリ開発という本筋の作業を加速するために生まれました。

画像生成の摩擦を解消しつつ、配布に当たって求められる経験を先に積む。元々は、汎用ツールとして設計したわけではなく、実際の作業の中で必要になった機能を形にした副産物でした。

ただ、“コンテキスト(文脈)の断絶”という問題は当店だけのものではありません。

AI と作業する開発者、コンテンツ制作者なら、同じ摩擦を常々感じているかもしれません。最新版では、undo/redo とセッション管理を加え、AI を使った開発全般で使いやすい形まで完成度を高めています。はじめは自分の問題を解決するために作ったものが、同じ状況にいる人にとっても役立つものになる。そういう流れが、モノ作りの自然な形ではないかと思っています。


imgx-mcp — AI 画像の生成と編集を、コーディング環境から

GitHub / npm / 使い方

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です