Introduction
When a feature requires more than one perspective—implementation, security, UI validation—splitting the work across specialized agents can keep momentum high while preserving quality. VIBA makes it possible to run several models (ChatGPT, Claude, Gemini and others) in a single session, assign each a role, pause for human approval, and watch cost per agent update in real time. The following walkthrough shows how a small team could tackle a modest logging‑middleware feature using three agents and a single approval checkpoint.
Defining the Task and Choosing Agents
The goal is to add request‑ID propagation to an Express API. Three distinct concerns emerge:
- Code generation – turning the design into production‑ready middleware.
- Security review – ensuring the IDs are not leaked or tampered with.
- UI testing – confirming that a simple front‑end dashboard displays the IDs correctly.
Each concern maps to a different model strength. A generative model like GPT‑4 excels at writing idiomatic code, while Claude’s strong reasoning helps spot edge‑case vulnerabilities. Gemini’s multimodal capabilities are useful for interpreting UI mockups and generating test scripts. By assigning each model a dedicated role, the workflow stays organized and the output stays comparable.
Configuring Agents and Approval Steps
VIBA’s configuration lets you declare agents, their models, roles, and whether a step needs explicit approval. Below is a minimal YAML snippet that captures the three agents for the logging feature:
agents:
- name: CodeGenerator
model: gpt-4
role: implement feature
approval: required
- name: SecurityReviewer
model: claude-3
role: check auth
approval: required
- name: UITester
model: gemini-pro
role: run ui tests
approval: required
The approval: required flag inserts a pause after each agent finishes its work. The human reviewer receives a concise summary, the generated artifacts, and a cost estimate for that agent. If the summary looks reasonable, the reviewer clicks “Approve” and the next agent starts. This deliberate hand‑off prevents unexpected side effects and keeps the total spend visible at every stage.
Running the Workflow and Reviewing Costs
With the config loaded, the session begins with the CodeGenerator. It outputs a middleware file (requestIdMiddleware.js) that injects a UUID into each request. VIBA displays a cost line—e.g., “$0.012 for CodeGenerator”—and a “Review” button. The reviewer opens the file, checks style, and confirms it matches the Express version used in the repo.
Approval triggers the SecurityReviewer. It analyzes the middleware for injection attacks, token exposure, and proper error handling. The reviewer sees a security report, the associated cost, and decides whether to accept, request changes, or reject outright. Because the cost is shown upfront, the team can decide if the security depth justifies the expense.
The final agent, UITester, runs a headless browser test against a static HTML prototype. It generates a report ranking issues by severity. Again, the cost is displayed before the reviewer finalizes the step. After all three approvals, VIBA aggregates the reports into a single repair checklist, ordered by impact.
Iterating with Human Feedback
If any agent’s output fails approval, the workflow loops back to the responsible agent with a concise feedback note. For example, the SecurityReviewer might flag a missing rate‑limit header. The CodeGenerator can regenerate the file with the header added, and the cycle repeats until the human reviewer is satisfied. Because each iteration is isolated, the cost remains transparent, and the team can stop early if the feature meets requirements.
The entire process—from initial config to final approval—demonstrates how multi‑agent AI can be treated like a coordinated development squad. The human stays in control, the models bring specialized expertise, and the cost per agent is never hidden.
Explore how VIBA can streamline your own multi‑agent workflows at https://viba.guru.
See VIBA: https://viba.guru
Top comments (0)