agency-agents/examples/workflow-landing-page.md
jiangnan 4773e686d2 Add multi-agent workflow examples
Adds two step-by-step workflow examples showing how to coordinate
multiple agents for real projects:

- Startup MVP: 7 agents across a 4-week build cycle
- Landing Page Sprint: 4 agents shipping a page in one day

Each example includes exact prompts to copy, handoff patterns, and
tips for passing context between agents. Checks off the
"Multi-agent workflow examples" item from the roadmap.
2026-03-06 05:10:21 +08:00

3.3 KiB

Multi-Agent Workflow: Landing Page Sprint

Ship a conversion-optimized landing page in one day using 4 agents.

The Scenario

You need a landing page for a new product launch. It needs to look great, convert visitors, and be live by end of day.

Agent Team

Agent Role in this workflow
Content Creator Write the copy
UI Designer Design the layout and component specs
Frontend Developer Build it
Growth Hacker Optimize for conversion

The Workflow

Morning: Copy + Design (parallel)

Step 1a — Activate Content Creator

Activate Content Creator.

Write landing page copy for "FlowSync" — an API integration platform
that connects any two SaaS tools in under 5 minutes.

Target audience: developers and technical PMs at mid-size companies.
Tone: confident, concise, slightly playful.

Sections needed:
1. Hero (headline + subheadline + CTA)
2. Problem statement (3 pain points)
3. How it works (3 steps)
4. Social proof (placeholder testimonial format)
5. Pricing (3 tiers: Free, Pro, Enterprise)
6. Final CTA

Keep it scannable. No fluff.

Step 1b — Activate UI Designer (in parallel)

Activate UI Designer.

Design specs for a SaaS landing page. Product: FlowSync (API integration platform).
Style: clean, modern, dark mode option. Think Linear or Vercel aesthetic.

Deliver:
1. Layout wireframe (section order + spacing)
2. Color palette (primary, secondary, accent, background)
3. Typography (font pairing, heading sizes, body size)
4. Component specs: hero section, feature cards, pricing table, CTA buttons
5. Responsive breakpoints (mobile, tablet, desktop)

Midday: Build

Step 2 — Activate Frontend Developer

Activate Frontend Developer.

Build a landing page from these specs:

Copy: [paste Content Creator output]
Design: [paste UI Designer output]

Stack: HTML, Tailwind CSS, minimal vanilla JS (no framework needed).
Requirements:
- Responsive (mobile-first)
- Fast (no heavy assets, system fonts OK)
- Accessible (proper headings, alt text, focus states)
- Include a working email signup form (action URL: /api/subscribe)

Deliver a single index.html file ready to deploy.

Afternoon: Optimize

Step 3 — Activate Growth Hacker

Activate Growth Hacker.

Review this landing page for conversion optimization:

[paste the HTML or describe the current page]

Evaluate:
1. Is the CTA above the fold?
2. Is the value proposition clear in under 5 seconds?
3. Any friction in the signup flow?
4. What A/B tests would you run first?
5. SEO basics: meta tags, OG tags, structured data

Give me specific changes, not general advice.

Timeline

Time Activity Agent
9:00 Copy + design kick off (parallel) Content Creator + UI Designer
11:00 Build starts Frontend Developer
14:00 First version ready
14:30 Conversion review Growth Hacker
15:30 Apply feedback Frontend Developer
16:30 Ship Deploy to Vercel/Netlify

Key Patterns

  1. Parallel kickoff: Copy and design happen at the same time since they're independent
  2. Merge point: Frontend Developer needs both outputs before starting
  3. Feedback loop: Growth Hacker reviews, then Frontend Developer applies changes
  4. Time-boxed: Each step has a clear timebox to prevent scope creep