The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Velox
Built for the Bubble #PromptAndCircumstance Challenge.
Velox is a modern operations dashboard that gives teams a single place to manage projects, track business metrics, and monitor performance in real time.
Instead of juggling spreadsheets, analytics tools, and task boards, teams can visualize their entire workflow from project pipelines to revenue trends in one clean workspace.
Built on a Bubble AI-generated foundation and taken the rest of the way by hand.
Started with a single prompt to Bubble AI.
Bubble AI generated the initial pages, database structure, and dashboard layout.
From there, I refined the workflows, analytics, navigation, and project management experience, then redesigned the interface into a clean, modern dashboard with interactive charts, KPI cards, Kanban boards, and responsive layouts.
Features
1. Real-time business dashboard with KPI tracking
2. Revenue analytics and performance trends
3. Kanban-style project management
4. Task prioritization and workflow tracking
The goal was to transform Bubble AI's starting point into a polished operations platform that feels like a production-ready SaaS product rather than a dashboard template.
This was my first time building with Bubble AI, and it was impressive to see how quickly a single prompt became a functional application.
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Title:
I built a design system generator inside Figma Make. Here's the workflow.
The problem I kept running into: every new client project meant re-explaining the brand to every AI tool from scratch. Figma Make didn't know the colors. Cursor didn't know the tokens. Claude didn't know the rules. I was the shared memory — and I kept losing things.
So I built Design System Gen. Entirely inside Figma Make. Powered by Claude API.
The workflow:
Upload brand references → Claude API analyzes them across 8 dimensions (palette, mood, typography, composition, lighting, texture, motion, UI DNA) → structured data, not vibes → generates 11 files, each formatted for a specific tool in your stack.
figma-make.md → paste once, Figma Make knows your entire design system
design-system.css → all tokens as CSS custom properties
tokens.json → W3C format, imports directly into Figma Variables
starter.tsx → React starter with tokens already bound
.cursorrules → Cursor knows your system from root
Claude.md → Claude reads it automatically every session
+ 5 more for docs, LLMs, prompts, components
Every tool gets its own context file. All consistent with each other.
The part I'm most proud of: I'm a designer. I don't write code. The entire tool — UI, API integration, file generation logic — was built and shipped inside Figma Make. No external hosting. No separate codebase.
Live at: vibecodingdsgen.figma.site
Add your Claude API key and try it with your own moodboard.
#FigmaMake #DesignSystem #VibeCoding #AI #Claude #UXUI #DesignSystems #ConfigMakeathon
As someone who constantly jumps between Figma, Claude, ChatGPT, Cursor, Lovable, and other AI tools, this problem feels very familiar 😅
The tools are getting smarter, but keeping context consistent is still surprisingly manual. Love seeing people tackle that gap.
Amazing sites for UX/UI designers, part 11
1. Grainient Supply for static and animated color gradients
2. Supahero for hero section inspiration at one place
3. Freefaces Gallery for free fonts that stand out
Fluxo | Personal Finance Dashboard 💵
Finance apps are one of the hardest UX challenges in product design.
It's working with stress, numbers, and decisions people actively avoid making. The design has to build trust — creating an app where users feel comfortable enough to hand over their most sensitive numbers.
What I look for in a well-designed money dashboard:
Clarity over completeness — show the 3 numbers that matter, not all 47 Visual hierarchy that guides — your eye should land on the most important data first Emotional tone — dark, clean, premium = I trust this with my money Micro-context — not just €5,210 spent, but -3% vs May tells a story
This Fluxo concept gets a lot right. Cash flow visualization, spending donut, saving goal progress — all scannable in under 5 seconds.
Yes, it's just a concept. But it's built on real interaction logic between a user and a product.
What types of financial products have you worked with? 💰
#FinTech #UXDesign #ProductDesign #UIInspiration #DashboardDesign
Great breakdown. "Clarity over completeness" is the golden rule for dashboards. The high-level metric cards and subtle data comparisons make the interface feel alive and actionable, rather than just a wall of numbers. Looks incredibly clean!
Trending
Claude
Claude has entered the design space. How are you using Claude Design?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
MagicPath
The canvas is infinite, and exploration is becoming the workflow. How are you using MagicPath?
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?