← nyxcore-systems
5 min read

Building Multi-Output Workflows: When AI Needs to Show Its Work

How we implemented a feature that lets AI generate multiple design alternatives, pause for human selection, and continue processing—spanning 6 application layers in one development session.

workflow-engineaitypescriptprismauser-experience

Building Multi-Output Workflows: When AI Needs to Show Its Work

Sometimes the best AI feature isn't about making decisions for users—it's about giving them better options to choose from. Today I want to share the story of implementing "multi-output step selection" in our workflow engine, a feature that lets AI generate multiple alternatives, pause for human input, and then continue processing with the chosen option.

The Problem: AI Tunnel Vision

Picture this: you're using an AI workflow to design a browser extension. The AI generates a feature list, but what if its first attempt isn't quite right? What if you want to see a more conservative approach, or a more ambitious one?

Traditional AI workflows suffer from tunnel vision—they generate one output and move on. But real creative work benefits from alternatives, comparison, and human judgment.

The Solution: Pause, Choose, Continue

We designed a system where any workflow step can generate multiple outputs (we call them "alternatives"), pause execution, and wait for the user to select their preferred option before continuing. Think of it like AI showing its work, then asking "which direction should we go?"

Here's what the user experience looks like:

  1. Setup: When building a workflow, users can set steps to generate 1x, 2x, or 3x alternatives
  2. Generation: The AI creates multiple variations using different "strategies" (Balanced, Conservative, Ambitious)
  3. Selection: The workflow pauses and presents radio-style cards for each alternative
  4. Continuation: User picks one, clicks "Continue with [Selected Option]", and the workflow resumes

The Technical Journey: Six Layers Deep

This feature touched every layer of our application stack. Here's how we approached it:

Layer 1: Database Schema

prisma
model WorkflowStep {
  // ... existing fields
  generateCount   Int?     @default(1)
  alternatives    Json?    // Stores the generated options
  selectedIndex   Int?     // Which one the user chose
}

Layer 2: Engine Logic

The workflow engine needed to understand three generation strategies:

typescript
const VARIATION_STRATEGIES = {
  Balanced: { tempOffset: 0, suffix: "Provide a balanced, practical approach." },
  Conservative: { tempOffset: -0.2, suffix: "Prioritize stability and proven solutions." },
  Ambitious: { tempOffset: 0.3, suffix: "Think boldly and push creative boundaries." }
};

For each alternative, we modify the AI's temperature and append strategy-specific guidance to the prompt.

Layer 3: API Routes

We added a new selectAlternative mutation that validates user ownership, sets the chosen output, and prepares the workflow for resumption:

typescript
selectAlternative: protectedProcedure
  .input(z.object({
    workflowId: z.string(),
    stepIndex: z.number(),
    alternativeIndex: z.number(),
  }))
  .mutation(async ({ input, ctx }) => {
    // Validation, selection logic, and state updates
  })

Layer 4: UI Components

The selection interface needed to be informative but not overwhelming. Each alternative shows:

  • A descriptive label (Balanced/Conservative/Ambitious)
  • Token count and estimated cost
  • Expandable content preview
  • Radio-button selection

Layer 5: Workflow Builder

Users needed an intuitive way to configure multi-output generation. We added simple toggle buttons (1x/2x/3x) that appear only for AI-powered steps.

Layer 6: Execution Interface

The running workflow needed to gracefully pause, present alternatives, and resume. We implemented a sticky "Continue" button that chains the selection and resume actions.

Lessons Learned: The Pain Points

Every complex feature comes with its challenges. Here are the ones that taught us the most:

TypeScript and Prisma JSON Fields

The Challenge: Storing alternatives as JSON in Prisma while keeping TypeScript happy.

The Pain: Record<string, unknown>[] isn't directly assignable to Prisma's InputJsonValue type.

The Solution: Explicit casting with alternatives as unknown as Prisma.InputJsonValue. Sometimes you have to tell TypeScript to trust you.

Stale Client Generation

The Challenge: After adding new schema fields, the Prisma client didn't recognize them.

The Pain: Mysterious "Unknown argument" errors that made no sense.

The Solution: Always run npx prisma generate after schema changes and restart your dev server. This one cost us 30 minutes of head-scratching.

Mobile Viewport Testing

The Challenge: Taking screenshots for documentation on mobile viewports.

The Pain: window.scrollTo() didn't work because our dashboard uses a custom scrollable container.

The Solution: Used fullPage: true screenshots and programmatic UI interactions instead of trying to control scroll position.

The Results: Better Workflows, Happy Users

The feature is now live and working across our entire workflow engine. Users can create workflows where AI generates multiple approaches to problems like:

  • Extension feature design: Conservative vs. ambitious feature sets
  • Content creation: Different tones and styles
  • Code architecture: Various implementation approaches

The "nyx" workflow (our Extension Builder template) now pauses at the feature design step, generates three alternatives, and lets users choose their preferred direction before continuing to implementation.

What's Next?

While the core feature is complete, there are always improvements to consider:

  1. Cost estimation: Our workflow cost calculator doesn't yet account for the generateCount multiplier
  2. Prompt editing: We added inline prompt editing for pending steps—extending this to completed steps would enable re-run scenarios
  3. Strategy customization: Currently we have three fixed strategies, but custom strategy definitions could be powerful

The Bigger Picture

This feature represents something important about AI tooling: the best AI doesn't replace human judgment—it enhances it. By giving users multiple options and letting them choose, we're building tools that amplify human creativity rather than constraining it.

Sometimes the most powerful feature isn't about automation—it's about giving people better choices.

Want to see this in action? The multi-output workflow feature is available in our workflow engine, and you can test it with any AI-powered step by toggling the generation count in the workflow builder.