> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dify.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# レッスン 2：フローの頭と尾（開始ノードと出力ノード）

> このドキュメントは AI によって自動翻訳されています。不正確な部分がある場合は、[英語版](/en/learn/tutorials/workflow-101/lesson-02) を参照してください。

前回のレッスンでは、ワークフローをレシピに例えました。今日は実際にキッチンに入り、材料の下ごしらえ（開始）とお皿の準備（出力）をしていきましょう。

## アプリを作成する

<Steps>
  <Step title="空白から作成">
    画面上部の **スタジオ** をクリックします。左側のアプリ作成メニューから、**空白から作成** をクリックします。

    <Frame>
      <img src="https://mintcdn.com/dify-6c0370d8/Z6MqdkI3dck9_1H6/images/use-dify/tutorial/workflow-101-lesson-02/creating-the-app.png?fit=max&auto=format&n=Z6MqdkI3dck9_1H6&q=85&s=dd30740eaf7d7dec5b9e266a40638de0" alt="アプリを作成" width="3814" height="618" data-path="images/use-dify/tutorial/workflow-101-lesson-02/creating-the-app.png" />
    </Frame>
  </Step>

  <Step title="アプリタイプを設定">
    アプリタイプとして **ワークフロー** を選択し、**アプリ名とアイコン** を入力して、**作成** をクリックします。

    <Frame>
      <img src="https://mintcdn.com/dify-6c0370d8/Z6MqdkI3dck9_1H6/images/use-dify/tutorial/workflow-101-lesson-02/create-workflow.png?fit=max&auto=format&n=Z6MqdkI3dck9_1H6&q=85&s=78fe2892e03ecf512a67e057376501bb" alt="アプリ名とアイコン" width="3024" height="1262" data-path="images/use-dify/tutorial/workflow-101-lesson-02/create-workflow.png" />
    </Frame>
  </Step>

  <Step title="開始ノードのタイプを選択">
    ポップアップウィンドウが表示されます。ここには、アプリの実行方法を決める 2 つのオプションがあります。

    * **ユーザー入力**

      これは **手動モード** です。あなた（ユーザー）がチャットボックスに何かを入力したときにのみ、ワークフローが動き始めます。

      適した用途：ほとんどの AI アプリ。例えば、チャットボット、文章作成アシスタント、翻訳など。
    * **トリガー**

      これは **自動モード** です。特定のシグナル（毎朝 8 時、特定のイベントなど）に基づいて自動的に実行されます。

      適した用途：特定の時間に繰り返し実行するタスクや、別のタスクが完了した後にこのワークフローを実行する場合。例えば、毎日のニュースまとめなど。

    <Frame>
      <img src="https://mintcdn.com/dify-6c0370d8/W-660XSNevX1HYUo/images/use-dify/tutorial/workflow-101-lesson-02/trigger.png?fit=max&auto=format&n=W-660XSNevX1HYUo&q=85&s=1bf22e13835e5533e13f9971ac829516" alt="トリガー" width="1392" height="744" data-path="images/use-dify/tutorial/workflow-101-lesson-02/trigger.png" />
    </Frame>
  </Step>
</Steps>

## オーケストレーションキャンバスを知ろう

開始ノードを選択すると、大きな空白のエリアが表示されます。これがオーケストレーションキャンバスです。ここでワークフローを設計し、構築し、テストしていきます。

<Frame>
  <img src="https://mintcdn.com/dify-6c0370d8/W-660XSNevX1HYUo/images/use-dify/tutorial/workflow-101-lesson-02/orchestration-studio.png?fit=max&auto=format&n=W-660XSNevX1HYUo&q=85&s=8086103e251092ffd0f6f5466363b894" alt="オーケストレーションスタジオ" width="3840" height="1912" data-path="images/use-dify/tutorial/workflow-101-lesson-02/orchestration-studio.png" />
</Frame>

レッスン 1 で学んだノードを覚えていますか？今キャンバスに表示されているユーザー入力ノードが、すべての出発点です。

すべての完全なワークフローは、基本的な骨格に支えられています。それが開始ノード（頭）と出力ノード（尾）です。

## 開始ノード

<Frame>
  <img src="https://mintcdn.com/dify-6c0370d8/W-660XSNevX1HYUo/images/use-dify/tutorial/workflow-101-lesson-02/start-node.png?fit=max&auto=format&n=W-660XSNevX1HYUo&q=85&s=691cdff1ad2db52bb0b34b59579ec2dc" alt="開始ノード" width="1348" height="760" data-path="images/use-dify/tutorial/workflow-101-lesson-02/start-node.png" />
</Frame>

開始ノードは、ワークフロー全体の唯一の入口です。料理でいう*材料の下ごしらえ*のステップのようなものです。ワークフローが動き始めるために、ユーザーからどんな情報を受け取る必要があるかを定義する役割を持っています。

先ほど、**ユーザー入力** を開始ノードとして選択しました。

### コアコンセプト：変数

開始ノードの中に、**変数** という言葉が出てきます。難しく考えなくて大丈夫です！変数とは、**ラベルが貼られた収納ボックス** のようなものです。

それぞれのボックスは、特定の種類の情報を入れるために用意されています。

例えば、旅行プランナーを作る場合、ユーザーに `Destination`（目的地）と `Travel Days`（旅行日数）の 2 つの情報を提供してもらう必要があります。

ユーザーA は日本に 5 日間行きたいかもしれません。ユーザーB はパリに 3 日間行きたいかもしれません。

ユーザーごとに入力する内容は異なるので、アプリが実行されるたびに、これらの*ボックス*の中身は変わります。

これが変数の意味です。ユーザーが埋めるための枠を用意しておくことで、ワークフローが毎回異なるリクエストに柔軟に対応できるようになります。

## 終了ノード（出力）

<Frame>
  <img src="https://mintcdn.com/dify-6c0370d8/W-660XSNevX1HYUo/images/use-dify/tutorial/workflow-101-lesson-02/output.png?fit=max&auto=format&n=W-660XSNevX1HYUo&q=85&s=8cf8622fc272318458615dc7e0916f7f" alt="出力" width="842" height="458" data-path="images/use-dify/tutorial/workflow-101-lesson-02/output.png" />
</Frame>

これはワークフローのゴールです。料理でいう*盛り付け*のステップで、最終的にユーザーが目にする結果を定義します。

例えば、先ほどの旅行プランナーを思い出してください。ユーザーがユーザー入力ノードで目的地：パリ、期間：5 日間と入力した場合、出力ノードでシステムが最終結果を返します：「こちらがパリ 5 日間の旅行プランです。」

まとめると、開始ノードと終了ノードが基本的な入力と出力を定義し、アプリの骨格を形作ります。

## ハンズオン実践：AI メールアシスタントを作ろう

メール作成を手伝ってくれる AI アシスタントの基本的なフレームワークを構築しましょう。

<Steps>
  <Step title="アプリを作成">
    以下のどちらかを選べます：

    * 先ほど開いたキャンバスでそのまま続ける
    * スタジオに戻り、空白から作成 → ワークフローを選択して、*メールアシスタント*と名前を付ける（ポップアップで **ユーザー入力** を選択するのを忘れずに！）
  </Step>

  <Step title="開始ノードを設定する（材料の準備）">
    AI にメールの返信を手伝ってもらうには、どんな情報を渡す必要があるでしょうか？

    そうです。通常は、顧客の名前とメールの原文です。

    1. **開始** ノードをクリックします。右側のパネルで**入力フィールド** を探し、**+** ボタンをクリックします。

    <Frame>
      <img src="https://mintcdn.com/dify-6c0370d8/W-660XSNevX1HYUo/images/use-dify/tutorial/workflow-101-lesson-02/input-field.png?fit=max&auto=format&n=W-660XSNevX1HYUo&q=85&s=93a318b5aabc02ae4bc0939a8b29f63c" alt="ユーザー入力フィールド" width="1848" height="790" data-path="images/use-dify/tutorial/workflow-101-lesson-02/input-field.png" />
    </Frame>

    2. ポップアップで、2 つの変数（2 つの収納ボックス）を作成します：

       **変数 1（顧客名用）**

           <Frame>
             <img src="https://mintcdn.com/dify-6c0370d8/W-660XSNevX1HYUo/images/use-dify/tutorial/workflow-101-lesson-02/variable-01.png?fit=max&auto=format&n=W-660XSNevX1HYUo&q=85&s=5a4b169b879b4c5daf910d5cad49d0ac" alt="最初の変数を追加" width="1052" height="1200" data-path="images/use-dify/tutorial/workflow-101-lesson-02/variable-01.png" />
           </Frame>

       * フィールドタイプ：テキスト（短文テキスト）
       * 変数名：`customer_name`
       * 表示名：顧客名
       * その他のオプションはデフォルトのままにします

       **変数 2（メール内容用）**

           <Frame>
             <img src="https://mintcdn.com/dify-6c0370d8/W-660XSNevX1HYUo/images/use-dify/tutorial/workflow-101-lesson-02/variable-02.png?fit=max&auto=format&n=W-660XSNevX1HYUo&q=85&s=d48b579660cb3ec129cb6fe7dfdc9a2a" alt="2 つ目の変数を追加" width="1052" height="1324" data-path="images/use-dify/tutorial/workflow-101-lesson-02/variable-02.png" />
           </Frame>

       * フィールドタイプ：ドロップダウンをクリックして **段落** を選択します（メールは通常長いため、段落ボックスの方が大きく、より多くのテキストを入力できます）
       * 変数名：`email_content`
       * 表示名：メール原文
       * 最大長：長いメールに対応できるよう、手動で **2000** に変更します

           <Tip>
             **変数名 vs 表示名**

             2 つの名前を入力したことに気づいたかもしれません。それぞれの違いは何でしょうか？

             * **変数名**：これはシステム用の ID です。一意であること、英字を使用すること、スペースを含まないことが必要です。
             * **表示名**：これはユーザー向けのラベルです。日本語など、どの言語でも名前を付けることができます。画面上に表示されます。
           </Tip>
  </Step>

  <Step title="終了ノードを作成する（ゴールを設定）">
    キャンバスの空白部分を右クリックします。**ノードを追加** を選択し、一覧から**出力** を選択します。

    <Frame>
      <img src="https://mintcdn.com/dify-6c0370d8/Z6MqdkI3dck9_1H6/images/use-dify/tutorial/workflow-101-lesson-02/create-end-node.png?fit=max&auto=format&n=Z6MqdkI3dck9_1H6&q=85&s=7838a53644b5d14d5f38df4b7a4e866b" alt="終了ノードを作成" width="972" height="578" data-path="images/use-dify/tutorial/workflow-101-lesson-02/create-end-node.png" />
    </Frame>
  </Step>
</Steps>

キャンバスの状態を確認しましょう。名前とメールを受け取る準備ができた **開始ノード** と、最終結果を送る **出力ノード** があります。

<Frame>
  <img src="https://mintcdn.com/dify-6c0370d8/Z6MqdkI3dck9_1H6/images/use-dify/tutorial/workflow-101-lesson-02/basic-workflow.png?fit=max&auto=format&n=Z6MqdkI3dck9_1H6&q=85&s=942b3056eb172951c1fdec8d6482e502" alt="開始ノードと出力ノード" width="1204" height="358" data-path="images/use-dify/tutorial/workflow-101-lesson-02/basic-workflow.png" />
</Frame>

ワークフローの基本フレームが完成しました。真ん中の空白スペースは、次のレッスンで LLM（AI の頭脳）ノードを配置して情報を処理する場所です。

## ミニチャレンジ

**課題**：旅行プラン生成器を作るとしたら、開始ノードにはどのような変数を含めるべきでしょうか？

<Tip>
  **変数を追加** のフィールドタイプを探索してみてください。
</Tip>
