feat: release Vibeflow n8n v0.6.0

This commit is contained in:
Felipe Domingues 2026-04-12 13:43:57 -03:00
parent 097f35215f
commit 260d447f40
15 changed files with 435 additions and 56 deletions

View file

@ -72,3 +72,12 @@ Initial public skeleton of the Vibeflow n8n skill kit.
- system prompt
- intake and final report templates
- example plans and briefs
## 0.6.0
- added showcase-oriented demo docs
- added placeholder SVG assets for hero, terminal, workflow, and report visuals
- added AI lead enrichment and Slack-to-Notion triage recipes
- updated README to highlight demo flow and stronger launch materials
- updated roadmap for a showcase-ready release

View file

@ -69,6 +69,28 @@ Start here:
- `templates/system-prompt.md`
- `docs/conversation-contract.md`
## Demo flow
Use these files to create a polished first impression:
- `docs/demo-assets.md`
- `docs/demo-script.md`
- `docs/recipes-gallery.md`
- `assets/hero-banner.svg`
- `assets/terminal-demo.svg`
- `assets/workflow-demo.svg`
- `assets/final-report-demo.svg`
## Recipes to try first
Fastest value demos:
- `recipes/lead-triage.md`
- `recipes/support-triage.md`
- `recipes/invoice-reminder.md`
- `recipes/ai-lead-enrichment.md`
- `recipes/slack-to-notion-triage.md`
## Example prompt
```text
@ -96,21 +118,27 @@ See:
- `docs/launch-day-checklist.md`
- `docs/tutorial-subir-github.md`
## Safety and practical limits
## Suggested launch stack
The n8n MCP route is powerful, but not magic. Review the upstream limits before promising full automation behavior. The current n8n docs explicitly call out constraints such as a five-minute timeout, no binary input support, and no human-in-the-loop during MCP execution. citeturn863639search0
For the first public version, ship with:
- 1 hero banner
- 3 to 5 screenshots or SVG placeholders
- 1 short terminal GIF
- 3 strong recipes in the README
- 1 release with screenshots attached
## Roadmap
Current release line: `0.5.0`
Current release line: `0.6.0`
Planned improvements include:
- richer recipes by domain
- test fixtures for client configs
- sample workflow exports for safe local testing
- recipe packs by team or department
- validation helpers for plan payloads
- gallery assets and demo GIFs
- community issue labels and starter tasks
- screenshots and GIFs from real runs
- optional quality scoring for generated workflows
See `docs/roadmap.md`.
@ -171,6 +199,26 @@ Comece por aqui:
- `templates/system-prompt.md`
- `docs/conversation-contract.md`
## Demonstração e vitrine
Arquivos para montar uma landing page forte dentro do próprio README:
- `docs/demo-assets.md`
- `docs/demo-script.md`
- `docs/recipes-gallery.md`
- `assets/hero-banner.svg`
- `assets/terminal-demo.svg`
- `assets/workflow-demo.svg`
- `assets/final-report-demo.svg`
## Recipes para mostrar valor rápido
- `recipes/lead-triage.md`
- `recipes/support-triage.md`
- `recipes/invoice-reminder.md`
- `recipes/ai-lead-enrichment.md`
- `recipes/slack-to-notion-triage.md`
## Exemplo de pedido
```text
@ -198,11 +246,6 @@ Veja:
- `docs/launch-day-checklist.md`
- `docs/tutorial-subir-github.md`
## Referências
- n8n MCP server docs: `docs.n8n.io`
- GitHub publishing docs: `docs.github.com`
## Licença
Consulte `LICENSE`.

View file

@ -1 +1 @@
0.5.0
0.6.0

View file

@ -1,10 +1,22 @@
# Assets
Place public screenshots, social preview images, logos, and demo captures here.
This folder contains launch and showcase assets for the repository.
Suggested files:
- `social-preview.png`
- `demo-intake.png`
- `demo-plan.png`
- `demo-workflow.png`
- `demo-report.png`
## Included
- `logo.svg`
- `social-preview.svg`
- `hero-banner.svg`
- `terminal-demo.svg`
- `workflow-demo.svg`
- `final-report-demo.svg`
## Usage
Use these SVG files as placeholders until you capture real screenshots or GIFs from an end-to-end run.
Recommended replacement order:
1. terminal demo
2. workflow canvas
3. final report
4. hero banner

View file

@ -0,0 +1,13 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1400" height="900" viewBox="0 0 1400 900">
<rect width="1400" height="900" fill="#ffffff"/>
<rect x="90" y="70" width="1220" height="760" rx="24" fill="#f8fafc" stroke="#cbd5e1"/>
<text x="130" y="140" fill="#0f172a" font-size="42" font-family="Arial, Helvetica, sans-serif" font-weight="700">Implementation Report</text>
<text x="130" y="220" fill="#0f172a" font-size="28" font-family="Arial, Helvetica, sans-serif" font-weight="700">Created</text>
<text x="170" y="270" fill="#334155" font-size="26" font-family="Arial, Helvetica, sans-serif">• Slack trigger, urgency classifier, Notion insert, status reporter</text>
<text x="130" y="360" fill="#0f172a" font-size="28" font-family="Arial, Helvetica, sans-serif" font-weight="700">Assumptions</text>
<text x="170" y="410" fill="#334155" font-size="26" font-family="Arial, Helvetica, sans-serif">• Urgent means billing, outage, or executive mention</text>
<text x="130" y="500" fill="#0f172a" font-size="28" font-family="Arial, Helvetica, sans-serif" font-weight="700">Missing credentials</text>
<text x="170" y="550" fill="#334155" font-size="26" font-family="Arial, Helvetica, sans-serif">• Slack bot token, Notion integration, escalation channel id</text>
<text x="130" y="640" fill="#0f172a" font-size="28" font-family="Arial, Helvetica, sans-serif" font-weight="700">How to test</text>
<text x="170" y="690" fill="#334155" font-size="26" font-family="Arial, Helvetica, sans-serif">• Send one urgent message and one normal message, then confirm both paths</text>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

14
assets/hero-banner.svg Normal file
View file

@ -0,0 +1,14 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
<rect width="1600" height="900" fill="#0b1020"/>
<rect x="70" y="80" width="1460" height="740" rx="32" fill="#111831" stroke="#2a3768"/>
<text x="120" y="220" fill="#ffffff" font-size="72" font-family="Arial, Helvetica, sans-serif" font-weight="700">Vibeflow n8n</text>
<text x="120" y="300" fill="#9fb4ff" font-size="32" font-family="Arial, Helvetica, sans-serif">Plan-first workflow generation for MCP-capable coding agents</text>
<rect x="120" y="380" width="1360" height="290" rx="24" fill="#0e1530" stroke="#2a3768"/>
<text x="170" y="470" fill="#7dd3fc" font-size="26" font-family="Courier New, monospace">User:</text>
<text x="260" y="470" fill="#e5e7eb" font-size="26" font-family="Courier New, monospace">Build a Slack-to-Notion triage workflow with urgency routing.</text>
<text x="170" y="540" fill="#86efac" font-size="26" font-family="Courier New, monospace">Agent:</text>
<text x="260" y="540" fill="#e5e7eb" font-size="26" font-family="Courier New, monospace">1) Asking only critical questions</text>
<text x="260" y="585" fill="#e5e7eb" font-size="26" font-family="Courier New, monospace">2) Generating normalized plan</text>
<text x="260" y="630" fill="#e5e7eb" font-size="26" font-family="Courier New, monospace">3) Building workflow in n8n via MCP</text>
<text x="120" y="760" fill="#94a3b8" font-size="24" font-family="Arial, Helvetica, sans-serif">Use this as a placeholder hero until you replace it with a real screenshot or GIF.</text>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

17
assets/terminal-demo.svg Normal file
View file

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1400" height="900" viewBox="0 0 1400 900">
<rect width="1400" height="900" fill="#0a0f1f"/>
<rect x="80" y="70" width="1240" height="760" rx="24" fill="#111827" stroke="#334155"/>
<circle cx="130" cy="110" r="10" fill="#f87171"/>
<circle cx="160" cy="110" r="10" fill="#fbbf24"/>
<circle cx="190" cy="110" r="10" fill="#34d399"/>
<text x="120" y="170" fill="#93c5fd" font-size="28" font-family="Courier New, monospace">$ use vibeflow skill to build a support triage workflow</text>
<text x="120" y="245" fill="#86efac" font-size="28" font-family="Courier New, monospace">Agent&gt; What should trigger the workflow?</text>
<text x="120" y="300" fill="#e5e7eb" font-size="28" font-family="Courier New, monospace">User&gt; New support emails tagged urgent or billing</text>
<text x="120" y="375" fill="#86efac" font-size="28" font-family="Courier New, monospace">Agent&gt; Which systems should receive the result?</text>
<text x="120" y="430" fill="#e5e7eb" font-size="28" font-family="Courier New, monospace">User&gt; Zendesk, Slack, and a spreadsheet</text>
<text x="120" y="505" fill="#86efac" font-size="28" font-family="Courier New, monospace">Agent&gt; Generating normalized plan...</text>
<text x="120" y="580" fill="#7dd3fc" font-size="28" font-family="Courier New, monospace">✔ objective</text>
<text x="120" y="625" fill="#7dd3fc" font-size="28" font-family="Courier New, monospace">✔ trigger</text>
<text x="120" y="670" fill="#7dd3fc" font-size="28" font-family="Courier New, monospace">✔ branching logic</text>
<text x="120" y="715" fill="#7dd3fc" font-size="28" font-family="Courier New, monospace">✔ validation plan</text>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

24
assets/workflow-demo.svg Normal file
View file

@ -0,0 +1,24 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1600" height="900" viewBox="0 0 1600 900">
<rect width="1600" height="900" fill="#f8fafc"/>
<text x="80" y="90" fill="#0f172a" font-size="40" font-family="Arial, Helvetica, sans-serif" font-weight="700">Sample Workflow Layout</text>
<rect x="100" y="220" width="220" height="100" rx="18" fill="#dbeafe" stroke="#60a5fa"/>
<text x="145" y="278" fill="#1e3a8a" font-size="28" font-family="Arial, Helvetica, sans-serif">Slack Trigger</text>
<rect x="420" y="220" width="250" height="100" rx="18" fill="#dcfce7" stroke="#4ade80"/>
<text x="455" y="278" fill="#166534" font-size="28" font-family="Arial, Helvetica, sans-serif">Normalize Message</text>
<rect x="790" y="220" width="240" height="100" rx="18" fill="#fef3c7" stroke="#f59e0b"/>
<text x="835" y="278" fill="#92400e" font-size="28" font-family="Arial, Helvetica, sans-serif">Classify Urgency</text>
<rect x="1170" y="120" width="220" height="100" rx="18" fill="#fee2e2" stroke="#f87171"/>
<text x="1238" y="178" fill="#991b1b" font-size="28" font-family="Arial, Helvetica, sans-serif">Urgent Path</text>
<rect x="1170" y="320" width="220" height="100" rx="18" fill="#e0e7ff" stroke="#818cf8"/>
<text x="1230" y="378" fill="#3730a3" font-size="28" font-family="Arial, Helvetica, sans-serif">Normal Path</text>
<rect x="790" y="520" width="240" height="100" rx="18" fill="#ede9fe" stroke="#8b5cf6"/>
<text x="835" y="578" fill="#5b21b6" font-size="28" font-family="Arial, Helvetica, sans-serif">Create Notion Item</text>
<rect x="1170" y="520" width="220" height="100" rx="18" fill="#cffafe" stroke="#22d3ee"/>
<text x="1225" y="578" fill="#155e75" font-size="28" font-family="Arial, Helvetica, sans-serif">Report Status</text>
<line x1="320" y1="270" x2="420" y2="270" stroke="#64748b" stroke-width="6"/>
<line x1="670" y1="270" x2="790" y2="270" stroke="#64748b" stroke-width="6"/>
<line x1="1030" y1="270" x2="1170" y2="170" stroke="#64748b" stroke-width="6"/>
<line x1="1030" y1="270" x2="1170" y2="370" stroke="#64748b" stroke-width="6"/>
<line x1="1280" y1="420" x2="1280" y2="520" stroke="#64748b" stroke-width="6"/>
<line x1="1030" y1="570" x2="1170" y2="570" stroke="#64748b" stroke-width="6"/>
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB

View file

@ -4,7 +4,10 @@ Use this document to prepare screenshots, terminal captures, and visual assets f
## Recommended visuals
### 1. Terminal intake flow
### 1. Hero banner
Use `assets/hero-banner.svg` as a temporary visual until you capture a real workflow screenshot.
### 2. Terminal intake flow
Show the agent asking for:
- the workflow goal
- trigger type
@ -12,21 +15,22 @@ Show the agent asking for:
- final action
- exceptions or approvals
### 2. Plan output
### 3. Plan output
Capture the normalized plan before the build starts.
### 3. Build confirmation
Show the agent summarizing what it created inside n8n.
### 4. n8n workflow canvas
Capture the resulting workflow with readable node names.
### 4. Workflow canvas
Use `assets/workflow-demo.svg` as a placeholder, or replace it with a real n8n screenshot.
### 5. Final handoff report
Show the concise report listing:
- what was created
- assumptions used
- missing credentials
- test steps
Use `assets/final-report-demo.svg` as a placeholder, or capture a real final report from the agent.
## Included placeholder assets
- `assets/hero-banner.svg`
- `assets/terminal-demo.svg`
- `assets/workflow-demo.svg`
- `assets/final-report-demo.svg`
- `assets/social-preview.svg`
## Capture tips
@ -34,12 +38,7 @@ Show the concise report listing:
- use short examples with familiar tools like Slack, Airtable, Gmail, HubSpot
- prefer light, readable terminal themes
- crop screenshots tightly
- keep filenames predictable, for example:
- `demo-intake.png`
- `demo-plan.png`
- `demo-build.png`
- `demo-workflow.png`
- `demo-report.png`
- keep filenames predictable
## Suggested README image order

64
docs/demo-script.md Normal file
View file

@ -0,0 +1,64 @@
# Demo Script
Use this script to record a short terminal demo, GIF, or narrated walkthrough.
## Goal
Show that Vibeflow n8n turns a plain-language request into a structured plan and a workflow build process.
## Recommended demo length
- 30 to 60 seconds for a GIF
- 90 to 180 seconds for a narrated video
## Suggested scenario
"Build an n8n workflow that watches Slack mentions, creates a triage page in Notion, alerts the ops channel for urgent items, and stores a summary for later reporting."
## Demo sequence
### 1. Open the repo
Show the key files:
- `templates/system-prompt.md`
- `docs/conversation-contract.md`
- `recipes/slack-to-notion-triage.md`
### 2. Start the agent
Show the agent receiving a natural-language request.
### 3. Intake questions
Capture a short question set such as:
- Which Slack channel or mention pattern should trigger the workflow?
- What counts as urgent?
- What Notion database should receive the item?
- Should failures notify Slack or email?
### 4. Plan output
Show the normalized plan with these visible sections:
- objective
- trigger
- steps
- branching logic
- credentials needed
- validation plan
### 5. Build handoff
Show the agent summarizing what it is about to create in n8n.
### 6. Workflow view
Capture the n8n canvas or a placeholder workflow image.
### 7. Final report
Show a concise final handoff report listing:
- what was created
- assumptions used
- missing credentials
- how to test it
## Recording tips
- keep the terminal font large
- hide secrets and account names
- use a short but realistic workflow request
- crop tightly and avoid idle pauses
- prefer one clean storyline over many cuts

58
docs/recipes-gallery.md Normal file
View file

@ -0,0 +1,58 @@
# Recipes Gallery
Use this page to choose the strongest recipes for screenshots, demos, and first-run adoption.
## Recommended hero recipes
### 1. Lead Triage
Best for showing business routing, safe defaults, and clean branching.
Use when you want to demonstrate:
- form or CRM intake
- qualification logic
- routing to a sales queue
- notifications to Slack or email
### 2. Support Triage
Best for showing operational workflows with urgency rules.
Use when you want to demonstrate:
- inbound support intake
- priority detection
- response classification
- escalation paths
### 3. Invoice Reminder
Best for finance or back-office audiences.
Use when you want to demonstrate:
- schedule triggers
- spreadsheet or database lookups
- reminder logic
- retry and failure handling
### 4. AI Lead Enrichment
Best for showing AI-assisted steps without becoming overly abstract.
Use when you want to demonstrate:
- enrichment APIs
- summary generation
- structured output fields
- CRM updates
### 5. Slack to Notion Triage
Best for showing a workflow that feels modern and concrete in demos.
Use when you want to demonstrate:
- Slack triggers
- content normalization
- Notion inserts
- urgent routing and summaries
## Suggested README order
1. Slack to Notion Triage
2. AI Lead Enrichment
3. Invoice Reminder
This sequence shows speed, intelligence, and operational depth.

View file

@ -1,28 +1,28 @@
# Roadmap
## Current state: v0.3.0
## Current state: v0.6.0
V3 is designed to be GitHub-ready:
- documentation is stronger
- client setup is more concrete
- a normalized plan schema exists
- examples are easier to adapt
- release flow is clearer
V6 is designed to be showcase-ready:
- launch and community docs are in place
- client snippets are documented
- normalized plan schema exists
- demo-oriented recipes are stronger
- placeholder visual assets are included for the first public version
## v0.4.0 ideas
## v0.7.0 ideas
- richer sample plans across domains
- optional validation checklist by workflow type
- repository screenshots and terminal captures
- sample `.mcp.json`, `config.toml`, and `opencode.jsonc` fixtures
- stricter final report format
- sample workflow exports for safe local testing
- richer setup fixtures by client
- validation helper scripts for plan payloads
- GIFs and screenshots from real runs
- recipe packs for sales, support, finance, and internal ops
## v0.5.0 ideas
## v0.8.0 ideas
- test harness for plan validation
- library of domain-specific recipes
- template packs for lead ops, support ops, finance ops, and AI agents
- optional workflow quality scoring rubric
- optional plan linter
- workflow quality checklist by recipe type
- starter gallery page for examples
- benchmark prompts for comparing clients
## Long-term direction
@ -31,3 +31,4 @@ Turn Vibeflow n8n into a portable skill pack that:
- plans before building
- works across multiple MCP-capable coding agents
- remains understandable to non-experts
- feels demo-friendly from the first clone

View file

@ -0,0 +1,30 @@
# Showcase Checklist
Use this checklist before sharing the repo publicly.
## README
- clear one-line value proposition
- 1 hero visual near the top
- 1 example prompt
- 3 highlighted recipes
- quick-start links visible without scrolling too far
## Assets
- hero banner present
- social preview present
- at least 3 demo visuals present
- filenames are simple and predictable
## Recipes
- at least 3 recipes feel production-adjacent
- every recipe includes trigger, steps, assumptions, and test plan
- one recipe includes AI enrichment
- one recipe includes support or ops logic
- one recipe includes finance logic
## Release
- VERSION bumped
- CHANGELOG updated
- GitHub release notes drafted
- topics and description ready
- first screenshot or GIF attached

View file

@ -0,0 +1,48 @@
# Recipe: AI Lead Enrichment
## Goal
Capture a new inbound lead, enrich the company context, generate a short structured summary, score the lead using simple rules, and write the result to the CRM.
## Typical trigger
- new CRM lead
- form submission
- webhook from a landing page
## Systems involved
- CRM such as HubSpot or Pipedrive
- enrichment source such as Clearbit-like data or internal lookup
- optional LLM step for summarization
- Slack for alerts
## Core steps
1. Receive the lead payload.
2. Normalize fields such as company name, email domain, and source.
3. Query enrichment data.
4. Generate a concise structured summary.
5. Apply a scoring rule based on company size, geography, and source.
6. Update the CRM record.
7. Notify Slack if the lead crosses a threshold.
## Important assumptions
- scoring starts with safe defaults
- enrichment can fail without blocking the whole workflow
- missing optional fields should not break CRM updates
## What makes this recipe good for demos
- shows practical AI usage
- stays grounded in business logic
- produces an output people immediately understand
## Validation checklist
- lead payload is parsed correctly
- enrichment failures are captured clearly
- summary format is stable
- score thresholds are visible and editable
- CRM update succeeds even when optional data is missing

View file

@ -0,0 +1,47 @@
# Recipe: Slack to Notion Triage
## Goal
Capture important Slack mentions, classify them, create a Notion item for tracking, and route urgent cases to an escalation channel.
## Typical trigger
- mention of a bot in Slack
- reactions on flagged messages
- specific channel messages matching a pattern
## Systems involved
- Slack
- Notion
- optional AI classification step
- optional email or secondary Slack alert
## Core steps
1. Listen for the configured Slack trigger.
2. Normalize message text, author, channel, and timestamp.
3. Classify urgency and category.
4. Create a Notion page or database item.
5. Route urgent messages to an escalation destination.
6. Write a final status field for reporting.
## Important assumptions
- urgency rules should be explicit and editable
- Notion database schema is known or mapped in advance
- Slack formatting should be simplified before storage
## What makes this recipe good for demos
- looks modern and relatable
- easy to understand visually
- strong before-and-after story from message to tracked item
## Validation checklist
- trigger fires only for intended messages
- urgency logic is deterministic
- Notion fields are mapped correctly
- urgent path and normal path both succeed
- duplicate handling is defined