Building AI Agent Workflows With Vercel’s AI SDK: A Practical Guide

Kewin Wereszczyński
No items found.

In short

This article offers a hands-on approach to building AI Agent workflows using Vercel’s AI SDK, demonstrating practical implementations of chaining, routing, and parallelization. By the end, you should be able to apply these techniques to create your own custom workflows.

There is a new trend in almost every corner of the internet, and it revolves around AI Agents. In case you are new to this topic, an AI Agent is an implementation of LLM communication, where an LLM is provided with tools, accesses, and decision-making abilities. Think of it as a remote working freelancer.

This technology and concept are powerful by themselves, but joining those Agents in teams is where they get insanely powerful. Those teams are usually called “Workflows”. You provide a task to workflow, and your Agents work together to provide you with a satisfying result.

What are AI Agent Workflows?

I am sure you understand the concept of Agents working together. In the real world, we have well-known organizational structures in place, and we don’t even think about them. We will implement and talk about those structures (or ‘workflows’) in a moment. If you want a bit more in-depth explanation, the read this fantastic article from Anthropic.

Getting started with AI Agent Workflows is easier than you think

It’s easy to think that implementing such an agent workflow must be a very complex and technical task. Of course, some technicality is required. But if you have any experience with programming (a.k.a. run a hello world with typescript project) and you know English (assuming you read this article, you can), then, believe it or not, you are good to go.

There are a lot of resources and frameworks on the internet that can help, but in this article, I am going to present a solution created with AI SDK from Vercel.

Building AI Workflows step-by-step

We will be working on a simple node project with AI SDK as a dependency. So start up a new project, and feel free to follow along. Our setup is extremely simple.

Chaining

Chaining Workflo

Think of a situation where you’d like to apply for a loan. You start at Agent A, and after that, your application is passed along to Agent B for initial screening. Agent B can either deny you a loan or pass it along for a more in-depth check, etc. It’s all processed synchronously, one step at a time.

We will start with the first point of contact: the agent receiving a conversation with a client and then passing it along for further inspection. We will implement an agent that gathers information with a different workflow later.

This agent prepares a nice object for us to work with further down the chain.

The outcome of a Chain Workflow

Now that we have that, we can implement a “gate.” A gate is an agent that decides whether to continue or stop the chain based on the input values and system prompts.

And it looks like my application passed through the gate!

The result of a Chain Workflow

Believe it or not, but this is the chain workflow. We get the response from one model, and then pass it to the next one. Repeat ad infinitum, and your chain can be as complex or as simple as you need.

Routing

Routing Workflow

You must have called a call center or customer support at some point in your life. Imagine meeting Agent A, who decides who to contact you with. You can be ‘routed’ to Agent B, C, or D. After they resolve your issue, your call ends.

This time, we will start by making the Agents to whom our call will be dispatched. Here are our Tech, Account, and Finance specialists:

In this example, our specialists are simple system prompts. You could, however, improve that with their own tool calls, or other improvements. As an example, this is enough.

Now that we have our specialists, let’s prepare our dispatcher.

With that simple setup, I tested a couple of angry clients to check the response from the dispatcher. Here are the results:

The result of a Routing Flow

It looks like our dispatcher understands clients’ needs. That’s awesome. But now we need to pass the call! So let’s connect them with their Agent.

Now, our Agent is correctly passing clients to the required specialist. That’s the idea behind Routing Agents. Of course, there are different techniques and different models, but this will work as a simple implementation.

Parallelization

Parallelization Workflow

Think of a translation task. You rarely have one person who speaks three languages, not to mention more. So, you pass your article to Agents A, B, and C, who are specialists in their respective languages. After they finish work, you receive an article in multiple languages.

So first, let’s create our specialists who will work in parallel and pass each of them the same message. Remember that the keyword here is “parallel.”

Here, we trigger all our translators at once. Now, we need an Agent that Anthropic article calls an Aggregator. So, let’s ask him to make small corrections and give us all the translations.

And with that code, in a much shorter amount of time, we received all the translations:

An outcome of a parallel workflow

You might wonder why I passed all of those translations to the Agent in the end, instead of just pushing them into object. Well, as much I love AI Agents, they still can hallucinate, and add some boilerplate to the translation, like “Happy to help with translation, here it is:”. Aggregating Agents at the end grants us additional protection.

Orchestrator-Workers

Orchestrator-Workers Workflow

Let’s think of a project team. Our team will consist of a QA, a Developer, and a DevOps. We pass our feature request to our virtual Tech Lead, and he splits the tasks for estimation. Later, they estimate their tasks and get back to the Scrum Master to give us the final estimation in man days. Let’s start with the Tech Lead!

After the Tech Lead finishes splitting into tasks, let’s use what we learned with our parallel workflow and pass the tasks to the team members.

Now that we have all the responses, let’s pass them to our Scrum Master for the final report.

And now, let’s run our workflow. Our Tech Lead prepares the tasks for the team:

Task prepared for by the AI Agent acting as a Tech Lead in an Orchestrator Workflow

After that, our team gives their estimations and reasoning behind it:

Task estimate prepared with the support of AI Agents in an Orchestrator Workflow

At the end, the Scrum Master compiles all the results into a report:

A report prepared by an AI Agent acting as a Scrum Master in an Orchestrator Workflow

Should man days be summed? I’m not sure about it. Maybe we should find a better Scrum Master or explain the details of his work a little bit better! Whether we are happy with that result or not, this is how this workflow can be implemented. It’s basically a mix of routing and parallelization.

Evaluator-Optimizer

Evaluator-Optimizer Workflow

Writing an article is never an easy task. So you give it to Agent A - and to ensure that the paper is of good quality, you also employ Agent B to evaluate and provide feedback. Those two Agents work until Agent B is finally happy with the work and gives you the results.

Let’s create our writer, Kewin, who is tasked with writing an article about AI Agents. He has an additional extreme condition to fulfil: He has to write his article in five sentences!

Now, let’s create his supervisor.

Now that we have them, we need to put them in a loop! Just for the safety of my credit card, let’s set a breaking point at 6 repetitions.

Now, let’s see what our article looks like!

An article written and reviewed by the Evaluator-Optimizer AI Agent

It looks like our writer is much better than we expected! He convinced his supervisor in just two tries! This is how the Evaluator-Optimizer works in practice.

Summary

As you noticed, I allowed myself some freedom in choosing a case. However, all the rules and ideas are present in those implementations. You can freely expand and make them more complex or simplify them. You can also join them together and use in any configuration you need. Workflows are a powerful way of getting your AI Agents to cooperate to finish more complex tasks - and I encourage you to try them yourself, e.g., by playing with the examples from this article.

Latest update:
January 17, 2025

FAQ

No items found.
React Galaxy City
Get our newsletter

By subscribing to the newsletter, you give us consent to use your email address to deliver curated content. We will process your email address until you unsubscribe or otherwise object to the processing of your personal data for marketing purposes. You can unsubscribe or exercise other privacy rights at any time. For details, visit our Privacy Policy.

Callstack astronaut
Download our ebook

I agree to receive electronic communications By checking any of the boxes, you give us consent to use your email address for our direct marketing purposes, including the latest tech & biz updates. We will process your email address and names (if you have entered them into the above form) until you withdraw your consent to the processing of your names, or unsubscribe, or otherwise object to the processing of your personal data for marketing purposes. You can unsubscribe or exercise other privacy rights at any time. For details, visit our Privacy Policy.

By pressing the “Download” button, you give us consent to use your email address to send you a copy of the Ultimate Guide to React Native Optimization.