Section 3: Sequential Agent Workflows
In the previous section, we built a single agent that tried to do everything at once. While impressive, single agents often struggle with complex, multi-step tasks because they lose focus or hallucinate details when the context window gets too crowded.
In this section, we solve this by implementing a Sequential Workflow. We will refactor our Website Builder into a pipeline of three specialized agents working in harmony: a Requirements Analyst, a UI Designer, and a Coder.
By breaking a complex task (building a website) into smaller, distinct sub-tasks (requirements -> design -> code), we significantly improve the quality and reliability of the final output. This is the core philosophy of Agentic Engineering.
Master Google ADK - Agent Development Kit
Build Multi Agent Systems | Mac, Windows, Ubuntu | Deploy to Google Cloud | Free Gemini Key
The Architecture: Sequential Website Builder
We are moving from a single "Generalist" to a "Specialist Team." Here is the flow we will implement using the SequentialAgent class:
- Input: User provides a high-level idea (e.g., "A landing page for an AI course").
- Agent 1 (Requirements Writer): Analyzes the request and writes a detailed Product Requirements Document (PRD).
- Agent 2 (Designer): Reads the PRD and creates a Design System (colors, typography, layout).
- Agent 3 (Code Writer): Reads both the PRD and the Design System to write the actual HTML/CSS/JS code.
- Output: Saves the final file to disk.
Key ADK Concepts
SequentialAgent: A workflow controller that executes a list of sub-agents one after another.output_key: A mechanism to store an agent's output into the shared conversation state, allowing subsequent agents to read it.
Step 1: Directory Setup
We will create a new directory structure to house our multi-agent system. This ensures our agents remain modular.
Open your terminal and create the following structure:
mkdir -p version_2_sequential_website_agent/agents
cd version_2_sequential_website_agent
# Create folders for each specialist
mkdir -p agents/requirements_writer
mkdir -p agents/designer
mkdir -p agents/code_writer
mkdir -p agents/root_website_builder
mkdir utils
mkdir tools
Don't forget to copy your .env, pyproject.toml, and initialize uv as done in the previous section.
Step 2: Defining the Sub-Agents
We need to define our three specialists. Notice how we use output_key to save their work.
1. The Requirements Writer
This agent acts as a Business Analyst. It doesn't write code; it clarifies what needs to be built.
File: agents/requirements_writer/agent.py
from google.adk.agents import LlmAgent
from utils.file_loader import load_instructions_file
import os
import sys
# Add parent directories to path to ensure imports work correctly
sys.path.append(os.path.abspath(os.path.join(os.path.dirname(__file__), "../../")))
requirements_writer_agent = LlmAgent(
name="requirements_writer_agent",
model="gemini-2.5-flash", # Using the latest Flash model for speed
instruction=load_instructions_file("agents/requirements_writer/instructions.txt"),
description=load_instructions_file("agents/requirements_writer/description.txt"),
# CRITICAL: This saves the LLM's response to the state variable 'requirements_writer_output'
output_key="requirements_writer_output"
)
output_keyBy setting output_key="requirements_writer_output", the text generated by this agent is stored in the session memory. Future agents can reference this data by asking for {requirements_writer_output} in their prompts.
2. The Designer
This agent focuses purely on aesthetics. It receives the requirements and outputs a visual guide.
File: agents/designer/agent.py
from google.adk.agents import LlmAgent
from utils.file_loader import load_instructions_file
import os, sys
sys.path.append(os.path.abspath(os.path.join(os.path.dirname(__file__), "../../")))
designer_agent = LlmAgent(
name="designer_agent",
model="gemini-2.5-flash",
instruction=load_instructions_file("agents/designer/instructions.txt"),
description=load_instructions_file("agents/designer/description.txt"),
output_key="designer_output" # Saves design specs to state
)
Instruction Snippet for Designer:
In your instructions.txt for the designer, you explicitly tell it to look at the previous output:
"The requirements provided by the requirements writer agent are in the state variable:
{requirements_writer_output}. Use this to create a visual design system."
3. The Code Writer
This agent is the developer. It aggregates the previous contexts and executes the tool.
File: agents/code_writer/agent.py
from google.adk.agents import LlmAgent
from utils.file_loader import load_instructions_file
from tools.file_writer_tool import write_to_file
import os, sys
sys.path.append(os.path.abspath(os.path.join(os.path.dirname(__file__), "../../")))
code_writer_agent = LlmAgent(
name="code_writer_agent",
model="gemini-2.5-flash",
instruction=load_instructions_file("agents/code_writer/instructions.txt"),
description=load_instructions_file("agents/code_writer/description.txt"),
# Only the final agent needs the tool to save the result
tools=[write_to_file]
)
Step 3: The Orchestrator (Root Agent)
Now we stitch them together. The SequentialAgent acts as the manager. It doesn't use an LLM itself; it simply enforces the order of operations.
File: agents/root_website_builder/agent.py
from google.adk.agents import SequentialAgent
from utils.file_loader import load_instructions_file
import os, sys
# Import our specific sub-agents
from agents.requirements_writer.agent import requirements_writer_agent
from agents.designer.agent import designer_agent
from agents.code_writer.agent import code_writer_agent
# Define the orchestration logic
root_website_builder_agent = SequentialAgent(
name="root_website_builder_agent",
description="A sequential agent that builds websites by planning, designing, and coding.",
# The order here defines the execution pipeline
sub_agents=[
requirements_writer_agent,
designer_agent,
code_writer_agent
]
)
Execution & Results
To run this sophisticated pipeline, we point the ADK web server to our agents directory.
adk web ./agents
The Prompt
In the browser UI, select root_website_builder_agent and try a complex prompt:
"Design a landing page for a website called 'The AI Language' that teaches about AI Agents, Model Context Protocol, and ADK. Make it fun, modern, and include a team section."
Observing the Flow
- Trace Panel: You will see the
root_website_builderstart. - Requirements: The first sub-agent activates. It produces a structured Markdown document outlining the page sections (Hero, Features, Team).
- Design: The second agent activates. It reads the requirements and outputs a color palette (e.g., modern greens and greys), font choices, and spacing rules.
- Code: The final agent activates. It takes the logical requirements and the visual design to produce the final HTML file.
- Tool Call: Finally, you will see
write_to_filebeing called.
The Outcome
If you navigate to your output folder, you will find a timestamped HTML file. Because we separated concerns:
- The content is richer (thanks to the Requirements Agent).
- The design is more consistent (thanks to the Designer Agent).
- The code is cleaner (thanks to the Code Writer focusing only on implementation).
What's Next?
Now that we have built a deterministic multi-agent pipeline, it's time to learn how to Run these agents in different environments. In the next section, we explore the four execution methods: Web UI, API Server, CLI, and Python Scripts.
Master Google ADK - Agent Development Kit
Build Multi Agent Systems | Mac, Windows, Ubuntu | Deploy to Google Cloud | Free Gemini Key