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

# Manual Canvas Method

> Design workflows by placing nodes on a visual canvas and connecting them with edges.

## Workflow creation on the canvas

<Steps>
  <Step title="Create a new Agent Graph">
    <Frame>
      <img src="https://mintcdn.com/phinite/spbPnSZPWmAXAKhH/images/new-flow.png?fit=max&auto=format&n=spbPnSZPWmAXAKhH&q=85&s=3297254a0192112bc570b510c836b10b" alt="New Agent Graph" width="1919" height="869" data-path="images/new-flow.png" />
    </Frame>

    Open Graph Studio and choose "Create manually".
  </Step>

  <Step title="Add nodes">
    <Frame>
      <img src="https://mintcdn.com/phinite/spbPnSZPWmAXAKhH/images/add-blocks.png?fit=max&auto=format&n=spbPnSZPWmAXAKhH&q=85&s=78c00bb47072d274f9492ca62da6ffe8" alt="Add Blocks" width="1913" height="874" data-path="images/add-blocks.png" />
    </Frame>

    Drag nodes from the Node Library: Start, Master Agent, Child Agent, Tool, End.
  </Step>

  <Step title="Connect with edges">
    <Frame>
      <img src="https://mintcdn.com/phinite/spbPnSZPWmAXAKhH/images/connect-with-edges.png?fit=max&auto=format&n=spbPnSZPWmAXAKhH&q=85&s=e8da39167c837513bb119677fe37bdcf" alt="Connect With Edges" width="1918" height="873" data-path="images/connect-with-edges.png" />
    </Frame>

    Connect source and target handles between nodes to define execution order.
  </Step>

  <Step title="Configure nodes">
    <Frame>
      <img src="https://mintcdn.com/phinite/spbPnSZPWmAXAKhH/images/configure-blocks.png?fit=max&auto=format&n=spbPnSZPWmAXAKhH&q=85&s=84901c6fd9024987569e7f740cb3d49f" alt="Configure Blocks" width="1918" height="879" data-path="images/configure-blocks.png" />
    </Frame>

    Select a node to edit its properties in the Inspector: prompts, RAG, tools, and variables.
  </Step>

  <Step title="Test and iterate">
    <Frame>
      <img src="https://mintcdn.com/phinite/UT09uRGFOHzKWLgb/images/test-and-iterate.png?fit=max&auto=format&n=UT09uRGFOHzKWLgb&q=85&s=a1df9eb6f3713eb7c07ecf1134368bd0" alt="Test And Iterate" width="1915" height="877" data-path="images/test-and-iterate.png" />
    </Frame>

    Run sample inputs, observe outputs, and refine prompts, variables, and edge conditions.
  </Step>
</Steps>

<Tip>
  Use variables to avoid re-computing values and to pass context across agents and tools.
</Tip>
