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
The Learns Design System is an interactive documentation site I built for the Code the Dream Learns App. The codebase already had a set of design tokens, components, and patterns. None of it was well-documented.
The site auto-generates tokens directly from the theme file, so docs stay in sync without manual upkeep. Every component page has a live MUI playground with prop controls, a spec sheet, and copyable code. I also documented the app's most complex pattern, a React Flow workflow editor, end to end with a fully interactive canvas.
Built with Next.js, MUI, and deployed on Vercel.
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
Anthropic announces Claude Design.
Everybody on the internet screaming: DESIGNERS ARE DONE!!!
Meanwhile also Anthropic 👇 🤷♂️
Here is how I used Fuser to create a non-existent Supreme x The Monkey campaign along with interactive web site assets for users.
Let's be honest, if you have ever seen that monkey- it creeps anyone out. I had the perfect idea to mix it with Supreme because they are known for "weird" collabs of this sort.
I created a jacket design by hand and built a whole photoshoot campaign along with web site assets around it ready for launch.
Tools used inside Fuser: compositor nodes, creative code nodes, prompt nodes, image generation nodes.
Would you wear this? To be honest- I would
Black or blue, what is your pick?
Workflow link: here
Nice!
Most AI dashboards look like they were built for engineers who already understand everything.
Botrix was built for the person responsible for everything and who needs to see it all in one place.
12 automations running. 8 apps connected. 2 active servers. 98% success rate. Four numbers. Full operational picture. No clicking around.
So I designed the Botrix AI Command Center to feel less like a monitoring tool and more like a control room that actually respects your time.
A soft warm canvas with orange and blue agent activity lines that make peak performance visible at a glance. The +24.11% agent execution spike isn't buried in a report; it surfaces as a live tooltip right on the chart at the moment it matters. The server status panel shows Singapore running at 42% CPU, 68% RAM, and 124GB bandwidth with Restart, SSH, and Scale actions one click away. The New York backup node shows Stopped in red, immediately, with no digging required.
The Live Activity Feed filters by All, Success, Failed, and Paused so nothing hides behind a green average. The connected tools panel shows OpenAI active and Stripe ready to toggle the entire integration layer visible without opening a settings page.
The goal was clear:
See everything. Act immediately. Trust the system.
Because when AI agents are running your business, the dashboard can't afford to be the bottleneck.
Designed by Orbix Studio.
#AIDashboard #AgentMonitoring #UIDesign #DashboardUI #ProductDesign #SaaSDesign #AITools #OrbixStudio
Nice work
Trending
Runway
AI video generation is exploding. What are you dreaming up in Runway?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
portfolioreview
The best portfolios tell a story, not just show a grid. Share yours for feedback.
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?