|
|
4 months ago | |
|---|---|---|
| .github/workflows | 6 months ago | |
| examples/sample-images | 6 months ago | |
| logs | 7 months ago | |
| public | 4 months ago | |
| src | 4 months ago | |
| .env.example | 5 months ago | |
| .gitignore | 5 months ago | |
| CHANGELOG.md | 4 months ago | |
| CLAUDE.md | 5 months ago | |
| LICENSE | 4 months ago | |
| README.md | 4 months ago | |
| next.config.ts | 6 months ago | |
| package-lock.json | 4 months ago | |
| package.json | 4 months ago | |
| postcss.config.mjs | 7 months ago | |
| prd-image-workflow.md | 7 months ago | |
| server.js | 6 months ago | |
| tsconfig.json | 6 months ago | |
| vitest.config.ts | 6 months ago | |
README.md

The Visual Workflow Editor for AI Media Generation
Build AI image and video generation pipelines by connecting nodes on a visual canvas.
Multi-provider support. Prompt-to-workflow generation. Built mainly with Claude.
Build Complex AI Pipelines Visually
Node Banana is a node-based workflow editor for AI media generation. Drag nodes onto an infinite canvas, connect them with typed handles, and execute pipelines that call AI APIs in dependency order.
- Build dynamic prompts with variables, LLM-powered text construction, and reusable prompt chains
- Generate workflows from natural language or choose from preset templates
- Chain multiple AI models together across providers in a single pipeline
- Generate images, video, 3D models, and audio from a single workflow
- Annotate and edit images with a full-screen drawing editor
- Save and share workflows as portable JSON files
Features
| Feature | Description |
|---|---|
| Dynamic Prompting | Build prompts with variables, LLM-powered text construction, and reusable prompt chains that adapt per run |
| Prompt to Workflow | Generate complete workflows from natural language descriptions |
| Visual Node Editor | Drag-and-drop nodes onto an infinite canvas with pan and zoom |
| Image Generation | Generate images using Google Gemini, Replicate, fal.ai, Kie.ai, and more |
| Video Generation | Generate and trim video clips via Kie.ai (Sora, Veo, Kling) and other providers |
| Audio Generation | Text-to-speech and AI audio generation |
| 3D Models | Load and display GLB models as node inputs |
| Image Annotation | Full-screen editor with drawing tools (rectangles, circles, arrows, freehand, text) |
| Text Generation | Generate text using Google Gemini, OpenAI, or Anthropic models |
| Workflow Chaining | Connect multiple nodes to create complex multi-step pipelines |
| Group Locking | Lock node groups to skip them during execution |
| Save/Load | Export and import workflows as JSON files |
Supported Providers
| Provider | Status |
|---|---|
| Google Gemini | Fully supported |
| Replicate | Supported |
| fal.ai | Supported |
| Kie.ai | Supported |
| WaveSpeed | Supported |
| OpenAI | LLM only |
Getting Started
Prerequisites
- Node.js 18+
- npm
Quick Start
git clone https://github.com/shrimbly/node-banana.git
cd node-banana
npm install
npm run dev
Open http://localhost:3000 in your browser.
Environment Variables
Create a .env.local file in the root directory:
GEMINI_API_KEY=your_gemini_api_key # Required for prompt-to-workflow
OPENAI_API_KEY=your_openai_api_key # Optional
ANTHROPIC_API_KEY=your_anthropic_api_key # Optional
REPLICATE_API_KEY=your_replicate_api_key # Optional
FAL_API_KEY=your_fal_api_key # Optional
KIE_API_KEY=your_kie_api_key # Optional
WAVESPEED_API_KEY=your_wavespeed_api_key # Optional
API keys can also be configured per-project in Project Settings within the app.
Build
npm run build
npm run start
Example Workflows
The /examples directory contains example workflow files. To try them:
- Start the dev server with
npm run dev - Drag any
.jsonfile from the/examplesfolder into the browser window - Review the prompts in each node before running — they're targeted to specific use cases
Node Types
| Type | Purpose |
|---|---|
| Image Input | Load or upload reference images |
| Prompt | Text prompt input |
| Generate | AI image generation (multi-provider) |
| Video | AI video generation and trimming |
| LLM | AI text generation |
| Annotation | Draw on images with full-screen editor |
| Split Grid | Split image into grid cells |
| Audio | AI audio/TTS generation |
| GLB Viewer | Load and display 3D GLB models |
| Output | Display final result |
Tech Stack
Testing
npm test # Watch mode
npm run test:run # Single run
npm run test:coverage # With coverage report
Contributing
PRs are welcome! Please branch from develop and target develop with your PR.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request targeting
develop
Note: This is primarily built for my own workflows. If a PR conflicts with my plans I'll politely decline. For larger contributions, join the Discord to coordinate.
Community
- Discord — Chat, get help, and share workflows
- Documentation — Guides and reference
- GitHub Issues — Report bugs and request features
License
MIT