LINEに送った写真の髪型をAIでチェンジ【LINE×Make×Gemini】

Lステップ連携ラボ

2026年6月18日 19:23

今回は、LINEに髪型や髪色の要望と写真を送るだけで、AIが要望に合うイメージ画像を自動で返信してくれる仕組みをMakeで作りました。

美容室のLINE施策やヘアスタイル提案などに応用できる仕組みですので、ぜひ参考にしてみてください。

完成イメージ

今回デモで作成した仕組みで、実際に生成された画像は以下のとおりです。

十分参考にできるクオリティではないでしょうか。

Make側では以下の流れで処理しています。

１、ユーザーがLINEで髪型の要望をテキストで送る
２、MakeがスプレッドシートにUIDと要望を保存する
３、ユーザーが人物写真を送る
４、MakeがUIDをもとにスプレッドシートから要望を取得する
５、写真と要望をGemini APIに送る
６、AIが髪型を変更した画像を生成する
７、生成画像をGoogle Driveにアップロードする
８、LINEに画像を返信する
９、スプレッドシートの対応状況を「対応済」に更新する

Makeの設定を見るとやや複雑に感じるかもしれませんが、ユーザーのLINE上での体験はとてもシンプルです。

１、髪型の要望を送る（例：色をピンクにしたい）
２、自分の写真を送る
３、AIが髪型を変更した画像が返ってくる

なぜスプレッドシート管理が必要なのか

今回のポイントは、ユーザーの要望と写真を紐づける仕組みです。

LINEでは、テキストメッセージと画像メッセージが別々のイベントとしてMakeに届きます。

たとえば「色をピンクにしたい」と送ったあとに写真を送った場合、Make側では、

・1回目：テキストメッセージ
・2回目：画像メッセージ

として別々に処理されます。そのままだと、画像が届いたときに「この人はどんな髪型にしたかったのか」がわかりません。

そこで今回は、Googleスプレッドシートを使ってユーザーごとの要望を一時保存します。

A列：LINEのUID
B列：ユーザーが送った髪型や髪色の要望
C列：対応状況（未対応 / 対応済）

上図のようなイメージで、情報保存用のスプレッドシートをご用意ください。※2行目・3行目は情報が反映された際のイメージですので、1行目のみ記載いただければOKです。

MAKEシナリオ全体の構成

今回は「画像を受け取った場合」と「テキストメッセージを受け取った場合」の2ルートを作成していきます。

シナリオはLINEのWatch Eventsをトリガーに、Routerでメッセージの種類に応じて分岐します。

LINE：Watch Events
↓
Router
─ 画像メッセージの場合
│ ↓
│ LINE：Download a Message Attachment
│ ↓
│ Google Sheets：Search Rows
│ ↓
│ HTTP：Gemini APIへ送信
│ ↓
│ Tools：Sleep
│ ↓
│ Tools：Set variable
│ ↓
│ Google Drive：Upload a File
│ ↓
│ LINE：Send a Reply Message
│ ↓
│ Google Sheets：Update a Row
└─ テキストメッセージの場合
    ↓
    Google Sheets：Add a Row
    ↓
    LINE：Send a Reply Message

MAKEでのシナリオ作成手順

ここからは具体的な作成手順をご紹介します。

まず、LINEで「Watch Events」を選択します。

Webhook nameに任意の名前を入力し、Connectionの「Add」ボタンをクリック。　

Connection nameに任意の名前を入力し、Channel Access TokenにはLINE Developersから取得したチャネルアクセストークンを入力して保存します。

LINE Developersの操作方法から知りたい方は、以下の記事を参考にしてみてください。

次にモジュール横の＋をクリック。

「Router」を検索・選択します。

テキストメッセージを受け取ったときの処理

先にテキストメッセージから設定していきます。

まず、ユーザーが「色をピンクにしたい」などテキストで要望を送ってきた場合は、下のルートにいくよう設定を行います。

Routerの「2nd」のあたりをクリックすると設定画面が開きますので、上図のとおり選択・入力して保存します。

・Events＞Message＞Typeを選択
・「Text operators: Equal to」を選択（デフォルトのままでOK）
・「text」と入力
・最後に保存

次に、送られてきたテキスト情報を保存するため、スプレッドシートと繋げます。

Google Sheetsの中から「Add a Row」を選びます。

最初はConnectionからGoogleアカウントの認証を行います。

Search Methodは「Search by path」。Driveでは、スプレッドシートが保存されているドライブを選択します。自分のドライブなら「My Drive」でOKです。

Spreadsheet Nameでは、青いボタンをクリックするとGoogle Drive上のスプレッドシートが一覧表示されるので、情報保存用に作成したファイルを選択します。

A〜C列に、先程準備したスプレッドシートの項目が表示されますので、そこに反映させたい情報を選択・入力します。

・A列：Events＞Source＞User IDを選択
・B列：Events＞Message＞Textを選択
・C列：「未対応」と入力

D列以降は、今回は使わないので空欄でOKです。

次に、LINEの「Send a Reply Message」を選択します。

Reply Tokenには、Events＞Reply Tokenを選択。

Messageの「Item1」を開き、Textにユーザーへの返信文を入力します。今回はテキストの後に画像を送ってもらいたいので、「次に画像を送ってください！」としています。

ここまでの設定で、ユーザーからテキストで要望がきたらスプレッドシートに情報を保存し、画像を要求する仕組みが完成です。

画像を受け取ったときの処理

次に、画像を受け取った時の処理を設定していきます。

ユーザーが画像を送ってきた場合は、上のルートにいくよう設定を行います。

Routerの「1st」のあたりをクリックすると設定画面が開きますので、上図のとおり選択・入力して保存します。

・Events＞Message＞Typeを選択
・「Text operators: Equal to」を選択（デフォルトのままでOK）
・「image」と入力
・最後に保存

LINEの「Download a Message Attachment」を選択します。

Message IDには、Events＞Message＞Message IDを選択します。

この設定により、ユーザーから送られてきた画像の保存ができるようになります。

次に、Google Sheetsの中から「Search Rows」を選びます。

Spreadsheet Nameの部分をクリックすると、ドライブ内のスプレッドシートが表示されますので、今回用意したものを選択します。

Sheet Nameには、テキスト情報を保存しているシートを選択してください。

Filterでは、A列のUIDにEvents＞Source＞Use IDを選択し、AND条件でC列の対応状況「未対応」を入力します。

この設定で、UIDが一致したユーザーで、かつ対応状況が未対応の要望のみを対象にできます。

同一ユーザーが複数回要望を送る可能性もありますので、UIDと対応状況でフィルタリングするのがおすすめです。

Gemini APIに送るプロンプト

スプレッドシートからB列の要望を取得したら、その値と画像をGemini APIのプロンプトに差し込みます。

Google Sheetsの次は、HTTP＞Make a requestを繋げます。

Authntication typeには「No authentication」を選択し、URL欄には以下を入力します。

https://generativelanguage.googleapis.com/v1beta/models/gemini-3.1-flash-image-preview:generateContent

※このURLはブラウザで開くものではなく、MakeからAPIリクエストを送る宛先です。そのままコピー&ペーストしてください。

Methodでは「POST」を選択します。

Headerを開き、次のとおり入力します。

・Header 1：x-goog-api-key / APIキー
・Header 2：Content-Type / application/json

Value欄には、ご自身のGemini APIキーを入力してください。APIキーはGoogle AI Studio（aistudio.google.com）から発行できます。

Body content typeは「application/json」、Body input method「JSON string」を選び、Body contentには以下のプロンプトを入力しています。

{
  "contents": [
    {
      "parts": [
        {
          "inline_data": {
            "mime_type": "image/jpeg",
            "data": "{{base64(3.data)}}"
          }
        },
        {
          "text": "この人物写真の髪型を、ユーザーの要望に合わせて自然に変更してください。ユーザーの要望：「{{21.`1`}}」編集ルール：ユーザーの要望に含まれる髪型、髪色、長さ、前髪、カール、雰囲気などをできるだけ反映してください。ただし、髪型と髪色以外は大きく変更しないでください。維持する要素：顔の形、目、鼻、口、表情、肌の質感、服装、背景、構図、光、影は元画像のまま維持してください。人物が別人のように見えないようにしてください。仕上がり：実写写真風で、自然なヘアカタログ写真のように仕上げてください。髪の毛は自然な毛流れ、ツヤ感、立体感が出るようにしてください。不自然な変形、顔の変化、背景の変化、余計な装飾、過度な加工感は避けてください。もしユーザーの要望が曖昧な場合は、その人物に自然に似合う清潔感のある髪型にしてください。"
        }
      ]
    }
  ],
  "generationConfig": {
    "responseModalities": ["TEXT", "IMAGE"]
  }
}

上記プロンプトは、そのままコピー&ペーストしてご利用いただけます。

次に、Toolsの「Sleep」を入れます。

Gemini APIの画像生成が完了する前に次の処理が動いてしまうことを防ぐため、10秒の待機を挟みます。

基本的にはSleepがなくても動作しますが、安定稼働のために入れておくことをおすすめします。

Tools：Set variableで画像データを取り出す

Gemini APIから返ってくる画像は、普通の画像ファイルではなく、Base64形式の画像データです。

HTTPモジュールのレスポンスにはいろいろな情報が含まれています。その中から、実際に画像として使う部分だけを取り出します。

Toolsの「Set variable」を入れます。

・Variable name ：変換
・Variable value：4. Data.candidates[]: content.parts[]: inlineData.data

ここでやっているのは、画像ファイルへの変換ではありません。Geminiのレスポンスの中から生成された画像のBase64文字列だけを取り出して、「変換」という箱に入れているイメージです。

Google DriveでBase64を画像ファイルにする

次に、Google Driveに画像をアップロードし、先ほど「変換」に入れておいたBase64形式の画像文字列を、画像ファイルとして扱えるデータに戻します。

Google Driveから「Upload a File」を入れます。

ConnectionでGoogle Driveと接続します。

・Enter a Folder ID：Enter manuallyを選択
・Folder ID　　　：指定のフォルダーのIDを入力

Fileの項目では「Map」にチェックを入れます。

・File Name：任意のファイル名を入力。例：hair_style_{{now}}.jpg
・Date　　：{{toBinary(6.`変換`; "base64")}}

Dataには上記をそのままコピー&ペーストして入力してください。

※画像を格納するGoogle Driveは公開リンクを「リンクを知っている全員」にします。公開が限定されていると画像が表示されないためです。

LINEに生成画像を返信する

Google Driveに画像をアップロードしたら、その画像URLを使ってLINEに返信します。

LINEの「Send a Reply Message」を入れます。

Reply Tokenでは、Events＞Reply Tokenを選択。

Typeでは「image」を選択し、Original Content URLとPreview Image URLは「Web Content Link」を選択します。

最後に対応状況を「対応済」にする

画像をLINEに返信したら、最後にスプレッドシートを「未対応→対応済」に更新します。

Google Sheetsの「Update a Row」を追加します。

該当のスプレッドシートを選択し、Row numberでは「Row number」を選択します。

対応状況に「対応済」と入力します。これを入れておかないと、同じユーザーがもう一度写真を送ったときに、同じ要望が再利用される可能性があるためです。

処理後にC列を「対応済」にすることで、次回以降は未対応の要望だけを対象にできます。

設定は以上です。

今回のポイント

１、LINEのテキストと画像をRouterで分岐する
２、スプレッドシートでUID・要望・対応状況を管理する
３、Gemini APIに画像と要望を一緒に送る
４、Base64で返ってきた画像データをGoogle DriveにアップロードしてLINEに返す

特に重要なのは、スプレッドシートを使った状態管理です。

LINEではテキストと画像が別々に届くため、UIDをキーにして要望と写真を紐づける必要があります。

まとめ

今回は、Makeを使ってLINEに送った写真の髪型をAIで変更し、自動返信する仕組みを作りました。

ユーザーはLINEで要望を送り、そのあと写真を送るだけです。Make側ではGoogleスプレッドシートで要望を管理し、Gemini APIで画像を生成、Google Driveに保存してLINEへ返信します。

この仕組みは美容室のLINE施策、ヘアスタイル提案、AI体験キャンペーン、SNS企画などに応用できます。

「LINE上でAI画像生成を体験してもらう」仕組みとして、かなり使いやすい構成ですので、ぜひ本記事を参考に取り入れてみてください。