メインコンテンツへスキップ
見出し画像

Google Workspace Flowsの紹介~ノーコード自動化ツール~

    1.概要

     Google Workspace Flows(以下、Flows)は「Googleアプリ同士を簡単に連携させて自動化するノーコードツール」です。本記事ではFlowsをハンズオンで体験してみます。

     現在Googleでは様々なサービスが公開されております。他事例は以下の通りです。

    1-1.Google Workspace とは 

     Google Workspaceとは、Google の提供する組織向けのクラウド型グループウェアです。Gmail、Google ドライブ、ドキュメント、スプレッドシート、Meet、Chat 等のアプリがパッケージ化されています。

     Flowsの利用にはGoogle Workspaceを契約が必要です。

    画像

    1-2.Flowsとは

     Flowsは「異なるアプリ間にまたがる複雑な業務プロセスを自動化・連携させるためのツール」です。

     最大の特徴は、Google 純正であり最新の AI(Gemini)が組み込まれている点です。特徴は以下の通り。

    • ノーコード: マウス操作だけで設定可能

    • Google純正: アカウント連携がスムーズで、セキュリティ面も安心(※純正アプリの場合)

    • AI連携: フローにGeminiやGemも組み込める

    1-3.Flowsでできること

     Flowsでできることは以下の通り。前述の通り「Google 純正×Gemini利用」で自働化の領域が広がっています。

    • 複雑なワークフローの自動化: 情報収集、分析、コンテンツ生成などの複数の工程を含むプロセス全体を自動化

    • AI×業務の実行: 「Gem」と連携して出力をだす

    • ノーコードでの簡単構築: 難しいプログラミングは不要で、やりたいことを自然な言葉で伝えるだけで、AIが自動的にワークフローを設計・構築

    • アプリ間の連携: Google Workspaceのアプリ(ドキュメント、ドライブ、Chatなど)だけでなく、将来的にはサードパーティ製のツールとも接続し、業務フロー全体を繋ぐことができます。

    1-4.他ツールとの比較

     ローコード・ノーコードでの自働化ツールは他にもあります。Googleアプリ内で完結するのであればFlowが最適解になると思います。

    1. Power Automate:Microsoft製であり、MS Office製品との連携に強み。ローコード

      • 昔の経験より、クラウドでのOfficeが触りにくいのでかゆい所に手が届かない感じだった

    2. CopilotStudio:対話型AIエージェントを構築

      • 現在学習中。理解するのが難しい。

    3. Dify:AIアプリ開発に強み

      • エージェントワークフロー、RAGパイプライン、インテグレーション、モニタリングなど、必要な全てを一つに提供

    4. Zapier:数分でAIワークフローを構築」というコンセプト

      • Build and ship AI workflows in minutes—no IT bottlenecks, no complexity. Just results.

    ※自働化ツールにはRPA(Robotic Process Automation)もあります。ただしRPAはフローを作るのががしんどいので除外


    2.環境構築

    2-1.アルファ版の設定(2025年11月時点)

      Flowsは「パブリックアルファ版」として提供されており、利用にはGoogle Workspace 管理者による設定が必要です。

    画像
    https://sites.google.com/view/workspace-flows/about

     この設定はGoogle Workspaceの管理者権限が必要です。 
     私は一人で使用しているため、下記手順で実施しました。

    1. Google管理コンソールにアクセス (admin.google.com)

    2. 左側メニューで [生成AI] > [Gemini for Workspace] へ移動

    3. [アルファ版Gemini機能] をクリック

    4. [アルファ版機能] をONに変更。

    5. 設定が反映されるまで最大24時間程度待つ

    2-2.参考:α版のセキュリティに関する影響

     アルファ版(開発初期段階)でも、他のすべての Google Workspace サービスと同じ堅牢なデータ保護基準が適用されているみたいです。

    画像
    https://support.google.com/a/answer/14170809?visit_id=638981651733765046-1894962911&p=gemini_alpha&rd=1

     アルファ版の欠点として、サービスの不安定さやサポート体制などがあげられます。

    • データ取り扱い: 予期せぬエラーでフローが止まる可能性あり

    • 仕様変更の可能性: UIや操作方法がコロコロ変わるリスクあり

    • サポート体制: 通常のGoogle Workspaceサポートの対象外となるケースが多い->自己解決能力が必要


    3.Flowsの基礎

     まずは公式Docsを参照し、とにかく触ってみましょう。

    3-1.公式Docs

     参考資料は以下の通り。

    3-2.フローの作成方法

     フローの作成方法は以下の通り。

    1. プロンプト から作成

      • 赤枠にプロンプトを指定して、AIが自動でフロー作成

      • 生成されたフローの編集、ステップ追加/削除、順序変更など可能

    2. テンプレートの選択(Discover)

      • Discoverセクション(緑)からテンプレートを選択

    3. スクラッチで作成

      • 自分で0から作成

    画像

     スクラッチで作成

     スクラッチで作成する流れは以下の通り。

    画像

    1.スターター (Starter)の選択
    フローを開始させるイベントまたはスケジュールを選択。

    画像

    2.ステップ (Steps)の選択
    スターター後にフローが実行するアクションを選択。このステップ(アプリ)を組み合わせることで自働化したいことを創れます。

    3.変数 (Variables)の調整
     あるステップの情報を次のステップに接続するために使用。
    例:受信メールの内容をスプレッドシートに追加など


    4.Quickstart1:GeminiでNews

     Gemini経由で毎日Newsを取得してみます。作成は学習のためスクラッチで実施します。⊞(New Agent)を押してAgentを作成します。

    1.スターター (Starter)
     定期実行するため"On a schedule"を選択し、条件を追加
    ※左上(緑)でAgent名も変更可。名前を変更しておくと見やすい

    画像

    2.ステップ 選択/変数調整
     Geminiにニュースを調査してもらいます。
     Gemini利用のため”Ask Gemini”を選択し、Promptを追加します。

    画像
    [Prompt]
    本日の経済、金融、テクノロジーのニュースについて調査し、箇条書きで要約して

     このGeminiは個人のと分離されているため、Flow上にはログが残りますが自分のGeminiアカウント上には出力がでません。
     Geminiの出力をみるためDocumentに書き込みます。手順は以下の通り。

    1. + add stepでステップ追加

    2. Create a docを選択

    3. New doc nameで”+ Variables”を押し、”Step1: On a schedule”から変数を選択

      • 分かりやすいよContent to addに”_Gemini News”と記載

    4. Content to addで”+ Variables”を押し、”Step2:Ask Gemini”から変数を選択

    画像

    3.起動
     Turn onを押し、Agentを起動させる。

    画像

    結果
     時間になったら、マイドライブ(Google Drive)に下記ドキュメントが作成されていました。
     参考までにニュースはほとんど前日のものであるため、プロンプトの改善は必要です。

    画像

     FlowsのMy Agents/Activityから結果の確認が可能です。

    画像

    5.Quickstart2:GAS連携(まじん式v3)

     所定のフォルダにファイルを入れたら、まじん式v3でスライドを作成させます。

     GAS連携は公式Docsの”Flows calculator quickstart”を参照しました。しかしまだ十分理解できないため、”とにかく動かす”ことを確認するため、コード理解できていないですが動くものを作成しました。

    【プロセスフロー/作成要領】
    作成の流れは以下の通り。

    1. GASコードの作成

    2. GASコードの修正

    3. GASのでデプロイ

    4. FlowsでAgent作成

    5. Agentのデプロイ

    GASコードの作成/修正

    GASコード作成
     まじん式のGASを改造

    コード修正
     まじん式GASの”appsscript.json”を修正し、”FlowsBridge.gs”を追加

    [appsscript.json]
    {
      "timeZone": "Asia/Tokyo",
      "dependencies": {},
      "exceptionLogging": "STACKDRIVER",
      "oauthScopes": [
        "https://www.googleapis.com/auth/script.locale",
        "https://www.googleapis.com/auth/presentations",
        "https://www.googleapis.com/auth/drive",
        "https://www.googleapis.com/auth/script.external_request"
      ],
      "runtimeVersion": "V8",
      "addOns": {
        "common": {
          "name": "Slide Generator",
          "logoUrl": "https://www.gstatic.com/images/branding/productlogos/slides/v3/web-96dp/logo_slides_color_1x_web_96dp.png",
          "useLocaleFromApp": true
        },
        "flows": {
          "workflowElements": [
            {
              "id": "generateSlideAction",
              "state": "ACTIVE",
              "name": "Generate Slides from JSON",
              "description": "JSONデータからGoogleスライドを自動生成します。",
              "workflowAction": {
                "inputs": [
                  {
                    "id": "slide_json",
                    "description": "スライド定義JSONデータ",
                    "cardinality": "SINGLE",
                    "dataType": {
                      "basicType": "STRING"
                    }
                  },
                  {
                    "id": "output_folder_id",
                    "description": "保存先フォルダID (任意)",
                    "cardinality": "SINGLE",
                    "dataType": {
                      "basicType": "STRING"
                    }
                  },
                  {
                    "id": "primary_color",
                    "description": "メインカラー (例: #4285F4 )",
                    "cardinality": "SINGLE",
                    "dataType": {
                      "basicType": "STRING"
                    }
                  }
                ],
                "outputs": [
                  {
                    "id": "presentation_url",
                    "description": "生成されたスライドのURL",
                    "cardinality": "SINGLE",
                    "dataType": {
                      "basicType": "STRING"
                    }
                  }
                ],
                "onConfigFunction": "onConfigSlideGenerator",
                "onExecuteFunction": "onExecuteSlideGenerator"
              }
            }
          ]
        }
      }
    }
    [FlowsBridge.gs]
    /**
     * Google Workspace Flows 用のブリッジコード
     */
    
    function onConfigSlideGenerator() {
      var card = {
        "sections": [
          {
            "header": "スライド生成設定",
            "widgets": [
              {
                "textParagraph": {
                  "text": "スライドを生成するためのJSONデータと、オプション設定を入力してください。"
                }
              },
              {
                "textInput": {
                  "name": "slide_json",
                  "label": "スライド定義JSON",
                  "type": "MULTIPLE_LINE",
                  "hostAppDataSource" : {
                    "workflowDataSource" : {
                      "includeVariables" : true
                    }
                  }
                }
              },
              {
                "textInput": {
                  "name": "output_folder_id",
                  "label": "保存先フォルダ (ID または URL)", // ラベルも分かりやすく変更
                  "hostAppDataSource" : {
                    "workflowDataSource" : {
                      "includeVariables" : true
                    }
                  }
                }
              },
              {
                "textInput": {
                  "name": "primary_color",
                  "label": "メインカラー (例: #4285F4 )",
                  "hostAppDataSource" : {
                    "workflowDataSource" : {
                      "includeVariables" : true
                    }
                  }
                }
              }
            ]
          }
        ]
      };
      return pushCard(card);
    }
    
    function onExecuteSlideGenerator(event) {
      console.log("onExecuteSlideGenerator started");
      
      try {
        const inputs = event.workflow.actionInvocation.inputs;
        const jsonStr = inputs["slide_json"] ? inputs["slide_json"].stringValues[0] : "[]";
        // 入力されたフォルダ情報(IDまたはURL)を取得
        const rawFolderInput = inputs["output_folder_id"] ? inputs["output_folder_id"].stringValues[0] : "";
        // URLならIDを抽出、IDならそのまま使う
        const folderId = extractFolderId(rawFolderInput);
        const primaryColor = inputs["primary_color"] ? inputs["primary_color"].stringValues[0] : "#4285F4";
    
        let slideData;
        try {
          slideData = JSON.parse(jsonStr);
        } catch (e) {
          console.warn("JSON parse failed. Input was: " + jsonStr);
          slideData = [
            {
              "type": "title",
              "title": "⚠️ スライド生成エラー",
              "notes": "入力データが正しいJSON形式ではありませんでした。\nGeminiのプロンプトや入力データを確認してください。\n\n[受信したデータ冒頭]\n" + jsonStr.substring(0, 500)
            }
          ];
        }
    
        const settings = {
          primaryColor: primaryColor || '#4285F4',
          fontFamily: 'Noto Sans JP',
          showTitleUnderline: true,
          showBottomBar: true,
          showDateColumn: true,
          enableGradient: false,
          footerText: '',
          driveFolderId: folderId,
          gradientStart: '#4285F4',
          gradientEnd: '#ff52df',
          headerLogoUrl: '',
          closingLogoUrl: '',
          titleBgUrl: '',
          sectionBgUrl: '',
          mainBgUrl: '',
          closingBgUrl: ''
        };
    
        const presentationUrl = createPresentation(slideData, settings);
        console.log("Presentation created: " + presentationUrl);
    
        const variableDataMap = {
          "presentation_url": {
            "stringValues": [presentationUrl]
          }
        };
        
        return createOutputResponse(variableDataMap);
    
      } catch (e) {
        console.error("Fatal Error in onExecuteSlideGenerator: " + e.stack);
        throw e; 
      }
    }
    
    // --- ヘルパー関数 ---
    
    /**
     * フォルダのURLまたはIDから、純粋なID部分を抽出する
     */
    function extractFolderId(input) {
      if (!input || typeof input !== 'string') return "";
      input = input.trim();
      // 一般的なドライブフォルダURLのパターンからIDを抽出
      // 例: https://drive.google.com/drive/folders/12345abcd...
      const match = input.match(/folders\/([a-zA-Z0-9_-]+)/);
      if (match && match[1]) {
        return match[1];
      }
      // URLパラメータ形式の場合
      // 例: https://drive.google.com/drive/u/0/my-drive?id=12345abcd...
      const idMatch = input.match(/[?&]id=([a-zA-Z0-9_-]+)/);
      if (idMatch && idMatch[1]) {
        return idMatch[1];
      }
      // マッチしない場合は、入力自体がIDであるとみなしてそのまま返す
      return input;
    }
    
    function pushCard(card) {
      return {
        "action": {
          "navigations": [{ "push_card": card }]
        }
      };
    }
    
    function createOutputResponse(variableDataMap) {
      if (typeof AddOnsResponseService === 'undefined') {
        return {
          "render_actions": {
            "host_app_action": {
              "workflow_action": {
                "return_output_variables_action": {
                  "variable_data_map": variableDataMap
                }
              }
            }
          }
        };
      }
    
      const workflowAction = AddOnsResponseService.newReturnOutputVariablesAction();
      for (const key in variableDataMap) {
        const data = AddOnsResponseService.newVariableData();
        if (variableDataMap[key].stringValues) {
          variableDataMap[key].stringValues.forEach(val => data.addStringValue(val));
        }
        workflowAction.addVariableData(key, data);
      }
    
      return AddOnsResponseService.newRenderActionBuilder()
        .setHostAppAction(AddOnsResponseService.newHostAppAction().setWorkflowAction(workflowAction))
        .build();
    }

    GASのデプロイ

    公式と同様の手順で下記実行します。

    1. Apps Script エディタでスクリプト プロジェクトを開く

    2. [デプロイ] > [デプロイをテスト] をクリック

    3. [インストール] をクリック

    4. 下部にある [完了] をクリック

     問題なければFlows上に作成したGASが表示されます。

    画像

    FlowsでAgent作成

     設計思想は以下の通り。

    • step1:所定のフォルダにファイルを入れる

    • step2:Gem(まじん式v3)が動作し、JSONを出力

    • step3:JSON出力をGASで受けて、所定のフォルダに出力

    画像

    Step 1: When an item is added to a folder
     自動化の開始条件を設定します。「When an item is added to a folder」を選択し、監視するフォルダを指定します。

    画像

    Step 2: Ask a Gem
     作成済みのGem(【究極】まじん式プロンプトv3)をセレクトボックスから選択し、プロンプトを入力。プロンプトのポイントは以下の通り。

    1. ファイルの内容はVariablesで選択

      • Step1はフォルダ指定のみ->内容の指定が必要

    2. 安定性確保

    3. 確認フェーズを除外

      • 普段は調整できるための確認フェーズがあるため、それを削除

    [Prompt]​
    ​ の内容を解析してスライドを作成して
    
      * 次のエラーが出ないように気をつけること: "Unexpected token 'c', ..." [ [cite_start"... is not valid JSON"このエラーは**[cite_start]**というタグを入れることで生じているため、JSON出力時に**決して入れてはならない。**
    
    確認は不要であり、そのままJSONとして出力して
    画像

    Step 3: Generate Slides from JSON
     スライド定義JSONにVariablesでGemini(Step 2)が生成したJSONデータを指定。
     保存先フォルダは指定も可能(指定が無ければマイフォルダに保存)

    画像

    結果確認

     所定のフォルダにファイルを入れるとスライドが作成されました。
     Inputファイルではエラーがでる(Step2依存)ため、まだ不安定ですが実装できるところまでは確認できました。

     参考までに成功したファイルと結果を共有します。


    5.応用例

     もっと機能が増えたら追加予定
    ※GASをつかいこなすのが難しいので、他の人の奴待ちます。


    6.チュートリアル


    あとがき

     とりあえず触ってみてすごくなりそうな感じはある。ただほぼGeminiしか使ってない私だと下記が不満だけど、解決策はあるはずなので他の人の動き待ち。

    • スターター(起点)で使えそうなのが定期実行とドライブにファイルが入った時くらい

    • GeminiやGemの出力で一番ほしいスライド出力が難しい

      • GASを簡単に選択できない


    参考資料


    改正履歴

    • 2025年11月8日:初版発行

    • 2025年11月9日:GAS実装を更新

     
     

    KIYO

     
     
    普段は製造業で企画/開発/設計しております。記事はプログラミング・機械学習、IoT関係の記事をメインで作成し、なるべく1つの記事で知りたいことを網羅していきます。内容は学術的より実装・アウトプット(ほしくなるもの)を重視して作成しています。 面白そうな仕事があればやりたいです!

    あなたへのおすすめ