From outputai
Generates Output SDK workflow skeleton files via npx CLI command. Use when starting new workflows, scaffolding project structures, or understanding file layouts.
How this skill is triggered — by the user, by Claude, or both
Slash command
/outputai:output-dev-create-skeletonThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
This skill documents how to use the Output SDK CLI to generate a workflow skeleton. The skeleton provides a starting point with all required files and proper structure.
This skill documents how to use the Output SDK CLI to generate a workflow skeleton. The skeleton provides a starting point with all required files and proper structure.
npx output workflow generate --skeleton
This command creates the basic file structure for a new workflow.
After running the skeleton generator, you will have:
src/workflows/{workflow-name}/
├── workflow.ts # Main workflow definition
├── steps.ts # Step function definitions
├── types.ts # Zod schemas and types
├── prompts/ # Empty folder for prompt files
└── scenarios/ # Empty folder for test scenarios
The skeleton is created within the standard Output SDK project structure:
src/
├── shared/ # Shared code (create if needed)
│ ├── clients/ # API clients
│ ├── utils/ # Utility functions
│ ├── services/ # Business logic services
│ ├── steps/ # Shared steps (optional)
│ └── evaluators/ # Shared evaluators (optional)
└── workflows/
└── {workflow-name}/ # Your new workflow
├── workflow.ts
├── steps.ts
├── types.ts
├── prompts/
└── scenarios/
After generation, review each file to understand the template structure:
workflow.ts - Contains a basic workflow template:
import { workflow, z } from '@outputai/core';
import { exampleStep } from './steps.js';
import { WorkflowInputSchema } from './types.js';
export default workflow({
name: 'workflowName',
description: 'Workflow description',
inputSchema: WorkflowInputSchema,
outputSchema: z.object({ result: z.string() }),
fn: async (input) => {
const result = await exampleStep(input);
return { result };
}
});
steps.ts - Contains example step template:
import { step, z } from '@outputai/core';
import { ExampleStepInputSchema } from './types.js';
export const exampleStep = step({
name: 'exampleStep',
description: 'Example step description',
inputSchema: ExampleStepInputSchema,
outputSchema: z.object({ result: z.string() }),
fn: async (input) => {
// Implement step logic here
return { result: 'example' };
}
});
types.ts - Contains schema definitions:
import { z } from '@outputai/core';
export const WorkflowInputSchema = z.object({
// Define input fields
});
export type WorkflowInput = z.infer<typeof WorkflowInputSchema>;
name property in workflow.tssnake_case (e.g., image_processor)camelCase (e.g., imageProcessor)In types.ts, define your actual input/output schemas:
import { z } from '@outputai/core';
export const WorkflowInputSchema = z.object({
content: z.string().describe('Content to process'),
options: z.object({
format: z.enum(['json', 'text']).default('json')
}).optional()
});
export type WorkflowInput = z.infer<typeof WorkflowInputSchema>;
export type WorkflowOutput = { processed: string };
Related Skill: output-dev-types-file
Replace the example step with your actual step implementations:
import { step, z, FatalError, ValidationError } from '@outputai/core';
import { httpClient } from '@outputai/http';
import { ProcessContentInputSchema } from './types.js';
export const processContent = step({
name: 'processContent',
description: 'Process the input content',
inputSchema: ProcessContentInputSchema,
outputSchema: z.object({ processed: z.string() }),
fn: async ({ content }) => {
// Implement your logic
return { processed: content.toUpperCase() };
}
});
Related Skill: output-dev-step-function
Wire up your steps in the workflow:
import { workflow, z } from '@outputai/core';
import { processContent } from './steps.js';
import { WorkflowInputSchema } from './types.js';
export default workflow({
name: 'contentProcessor',
description: 'Process content with custom logic',
inputSchema: WorkflowInputSchema,
outputSchema: z.object({ processed: z.string() }),
fn: async (input) => {
const result = await processContent({ content: input.content });
return result;
}
});
Related Skill: output-dev-workflow-function
If your workflow uses LLM operations, create prompt files:
prompts/
└── analyzeContent@v1.prompt
Related Skill: output-dev-prompt-file
Add test input files to the scenarios folder:
scenarios/
├── basic_input.json
└── complex_input.json
Related Skill: output-dev-scenario-file
If your workflow needs shared clients, utilities, or services:
# Create shared directories if they don't exist
mkdir -p src/shared/clients
mkdir -p src/shared/utils
mkdir -p src/shared/services
Import shared resources in your steps:
import { GeminiService } from '../../shared/clients/gemini_client.js';
import { formatDate } from '../../shared/utils/date_helpers.js';
Related Skill: output-dev-http-client-create
After customization, verify your workflow:
npx output workflow list
Your workflow should appear in the list.
npx output workflow run {workflowName} --input path/to/scenarios/basic_input.json
Common issues after skeleton generation:
.js extensionzod instead of @outputai/core// steps.ts
export const stepOne = step({ ... });
export const stepTwo = step({ ... });
export const stepThree = step({ ... });
// workflow.ts
const resultOne = await stepOne(input);
const resultTwo = await stepTwo(resultOne);
const resultThree = await stepThree(resultTwo);
// workflow.ts
const [resultA, resultB] = await Promise.all([
stepA(input),
stepB(input)
]);
// workflow.ts
if (input.processImages) {
await processImages(input);
}
For workflows with many steps, use folder-based organization:
src/workflows/{workflow-name}/
├── workflow.ts
├── steps/ # Folder instead of single file
│ ├── fetch_data.ts
│ ├── process.ts
│ └── validate.ts
├── types.ts
└── ...
After generating and customizing the skeleton:
snake_case namingworkflow.ts has correct name in camelCase.js extensionz is imported from @outputai/coretypes.tssteps.ts or steps/ foldernpx output workflow listsrc/shared/output-dev-folder-structure - Understanding the complete folder layoutoutput-dev-workflow-function - Detailed workflow.ts documentationoutput-dev-step-function - Detailed steps.ts documentationoutput-dev-types-file - Creating Zod schemasoutput-dev-prompt-file - Adding LLM promptsoutput-dev-scenario-file - Creating test scenariosoutput-workflow-run - Running workflowsoutput-workflow-list - Listing available workflowsnpx claudepluginhub growthxai/output --plugin outputaiOutlines standard folder structure conventions for Output SDK workflows. Use when creating new workflows, reorganizing files, understanding file placement, or reviewing compliance.
Creates bite-sized, testable implementation plans from specs or requirements, with file structure and task decomposition. Activates before coding multi-step tasks.