-
-
Workflow Executions:Track and review agent workflow executions, including inputs, outputs, and step progress for completed or running tasks.
-
Workflow Builder: Design agent workflows with drag-and-drop interface, connecting nodes like, RAG, and Tools for efficient task automation.
-
Agent Creation Dashboard: Create agents by specifying functionalities, persona, tools, objectives, and more to customize AI behavior.
-
Templates: Access pre-built agent and workflow templates (e.g., Customer Support, Content Writer) with setup guides and required API keys.
-
Model Marketplace: Discover and integrate AI models (e.g., GPT-4, Claude 3) with detailed pricing, capabilities, and integration options.
-
Agent Library: Manage and organize AI agents with search and filter options by status and type for easy access and oversight.
-
Settings: Manage API keys securely, update profile, notifications, and security preferences with encrypted storage and revocation options.
-
Analytics: Monitor agent performance with execution trends, success rates, response times, and error rates over customizable time periods.
-
Description page : Elaborating features and functionalities of the platform a
AgentFloww: Our Hackathon Vision for Democratizing AI
The Hackathon Genesis
The idea for AgentFloww emerged during a particularly intense hackathon weekend in mid-June 2025. Our team of four technical enthusiasts had entered the "AI for Everyone" challenge, determined to build something that would democratize AI beyond the usual suspects who could afford enterprise solutions.
By 2 AM on Saturday, we were deep in the weeds—spinning up APIs, writing boilerplate prompt engineering code, and debugging integration nightmares. Despite our collective experience in full-stack development, machine learning, and DevOps, we found ourselves spending more time on infrastructure than on the actual AI logic that would make our solution valuable.
"This is exactly the problem we should be solving," said our team lead, gesturing at the mess of configuration files and API wrappers scattered across our monitors. The irony wasn't lost on us: here we were, four technical people struggling to rapidly prototype an AI solution, while the real end users—the business folks who understood customer pain points—would never be able to iterate on or customize what we built.
That's when we pivoted hard. Instead of building yet another AI chatbot, we decided to tackle the platform we wished existed: a visual, no-code interface for creating sophisticated AI workflows that could be understood and modified by anyone, regardless of their technical background.
What We Built (So Far)
By Sunday evening, we had a functional prototype that demonstrates our core concept. We just submitted it to the hackathon judges and are waiting for feedback, but we're excited about what we've managed to create in such a short timeframe.
Technical Architecture
For the hackathon prototype, we focused on proving the concept with a solid but streamlined tech stack:
Frontend: React + TypeScript for rapid development and type safety Backend: Supabase for quick auth, database, and real-time capabilities Workflow Engine: Built on top of ReactFlow with custom modifications Deployment: Vercel for easy deployment and demo hosting
The heart of our prototype is the visual workflow builder. We customized ReactFlow to support our specific node types and interaction patterns:
// Our custom node implementation for the prototype
export const LLMNode: React.FC<NodeProps<LLMNodeData>> = ({ data, selected }) => {
return (
<Card className={`min-w-[180px] p-3 border-2 ${selected ? 'border-blue-500' : 'border-purple-500'} bg-purple-50`}>
<Handle
type="target"
position={Position.Left}
className="w-3 h-3 bg-purple-500 border-2 border-white"
/>
<div className="flex items-center gap-2">
<div className="w-3 h-3 bg-purple-500 rounded-full"></div>
<span className="font-medium text-purple-800">{data.label || 'LLM'}</span>
</div>
{data.config?.model && (
<div className="mt-2 text-xs text-purple-600">
Model: {data.config.model}
</div>
)}
<Handle
type="source"
position={Position.Right}
className="w-3 h-3 bg-purple-500 border-2 border-white"
/>
</Card>
)
}
Current Features (Prototype)
What we managed to implement during the hackathon:
- Visual Workflow Builder: Drag-and-drop interface for creating AI agent workflows
- Basic Node Types: LLM calls, conditional logic, input/output handling
- Template System: A few pre-built templates for common use cases
- Real-time Preview: Live testing of workflows as you build them
- Multi-provider Support: Integration with OpenAI, Anthropic, and local models
Technical Challenges We're Tackling
Even in this early prototype stage, we've encountered and started solving some interesting technical problems:
Workflow Execution Engine: Building a reliable system for executing asynchronous AI workflows. Our current implementation handles basic cases but needs refinement for edge cases:
// Current execution logic - works but needs optimization
async executeWorkflow(workflow: WorkflowDefinition, input: any): Promise<ExecutionResult> {
const context = { input, variables: {} }
for (const node of workflow.nodes) {
try {
const result = await this.executeNode(node, context)
context.variables[node.id] = result
} catch (error) {
return { success: false, error: error.message }
}
}
return { success: true, output: context.variables }
}
State Management: Keeping the visual editor responsive while handling complex workflow state. We're using a combination of React state and context, but we're already seeing where we'll need to optimize for larger workflows.
API Key Security: Currently using basic environment variables, but we know we'll need proper key management for any real deployment.
Demo & User Testing
We've tested our prototype with a few friends and fellow developers during the hackathon. The initial feedback has been encouraging:
- The visual interface is intuitive even for non-technical users
- Drag-and-drop workflow creation feels natural
- The template system helps users get started quickly
- Real-time testing makes iteration fast and satisfying
However, we also identified several areas that need work:
- Performance degrades with complex workflows (>20 nodes)
- Error handling and debugging could be much better
- Need more sophisticated conditional logic options
- Template library is too basic for real-world use cases
Vision & Next Steps
While we're still waiting for hackathon results, we're already thinking about how to evolve this concept. Our vision is to create the infrastructure that lets every company become an AI company without needing a team of ML engineers.
If We Continue Development
Immediate Priorities (next 2-4 weeks):
- Improve workflow execution reliability
- Add better error handling and debugging tools
- Expand the template library based on user feedback
- Optimize performance for larger workflows
Short-term Goals (next 3 months):
- Multi-modal support (vision, audio, documents)
- Advanced conditional logic and loops
- Webhook integrations for real-time triggers
- Better collaboration features
Long-term Vision:
- Agent marketplace for sharing workflows
- Advanced analytics and A/B testing
- Enterprise deployment options
- SDK for programmatic agent creation
Market Opportunity
Based on our research and the problem we experienced firsthand, we believe there's a significant gap in the market. Current AI tools fall into two categories:
- Simple chatbots that anyone can use but lack sophistication
- Complex AI frameworks that require significant technical expertise
AgentFloww aims to bridge this gap by providing the power of category 2 with the accessibility of category 1.
Technical Learnings
Building this prototype taught us several valuable lessons:
Visual Programming is Hard: Creating an intuitive interface for complex logic flows requires careful UX design. We went through multiple iterations of our node design and connection system.
AI Integration Complexity: Each AI provider has different APIs, rate limits, and capabilities. Abstracting these differences while maintaining flexibility is challenging.
Real-time Collaboration: Even basic real-time features add significant complexity. We're already planning how to handle conflict resolution and state synchronization.
Performance Matters: Visual editors can become sluggish quickly. We learned the importance of virtualization and efficient rendering early.
Why This Matters
For the startup and hackathon community, AgentFloww represents a shift from "AI as a service" to "AI as a creative medium." Instead of consuming pre-built AI solutions, teams can rapidly prototype and customize AI workflows for their specific needs.
We're essentially building the development tools for the next generation of AI-powered applications, where the bottleneck isn't technical implementation but creative problem-solving and user experience design.
We're excited to see how the hackathon judges and community respond to our prototype. Whether we win or not, we've learned a ton and are considering turning this into a real project. If you're interested in the concept or want to contribute, we'd love to hear from you!
Demo Link: https://agentfloww.netlify.app/
Built With
- anthropic-claude
- auth
- github-actions-**testing**:-vitest
- google-gemini-**devops**:-netlify
- openai
- playwright
- react
- reactflow
- recharts
- recharts-**backend**:-supabase-(postgresql
- storage)-**ai-integration**:-openai-api
- supabase
- tailwindcss
- typescript

Log in or sign up for Devpost to join the conversation.