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
An interactive analytics dashboard exploring energy-efficiency trade-offs across Europe, built from my Master's thesis research. Features AI-powered forecasting, predictive insights, risk estimation, and real-time analysis tools for energy consumption patterns. Built with React, D3.js, and TypeScript on the frontend with a FastAPI/Python backend, using an editorial design with a muted purple palette. Refactored from a 900-line monolith into a clean, modular 19-file architecture.
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
Trending
Claude
Claude has entered the design space. How are you using it?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
Brand Design
The best brand designers are on Contra. Scroll to see what's trending in brand design. What are you building?
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?
Related posts
UI Factory — The Alert Component
I've been building interfaces for a while now. And for most of that time, I did what everyone does — reached for a library, dropped in a component, tweaked the colors, shipped it. Job done.
But I kept noticing something. No matter how polished the product, the UI always felt borrowed. Like you could see the seams of whatever design system was underneath. Everything started looking the same.
So I decided to start building my own things from scratch. No templates, no defaults. The rule I set for myself: every component has to have its own identity. Its own material, its own physics, its own personality. A notification alert shouldn't feel anything like a pricing card. A dock shouldn't feel like a modal. Each one is its own experiment.
This alert component was the first one I finished. I wanted it to feel physical — like something you could reach into the screen and peel off. That drove every decision: the shadows, the spring physics, the way the stack fans out when you hover it, the way each card exits with a little spin. Nothing about it is accidental.
But claymorphism is just one direction. The library I'm building will go everywhere — glass, depth, brutalism, motion-first, 3D. The point was never an aesthetic. The point is that UI can feel crafted instead of assembled.
I'm in the early stages of building my own UI component library. If this work gets traction, the plan is to open-source the full code so designers and developers can use these in their own products. Every component ships with its own philosophy — no two will feel the same.
This is just the beginning. Follow along.
→ Try it yourself: https://ui-factory-zeta.vercel.app/notification-stack
Stack: React 19 · Next.js 15 · Framer Motion · TypeScript
#SoftwareArchitecture #SystemDesign #FullStack #SaaS #AIEngineering #DistributedSystems #React #PostgreSQL #NodeJS #Python #ProductEngineering #WebDevelopment
The spring physics and layer depth look incredible in action! Crafting components from scratch with true physical personality beats cookie-cutter UI libraries every single time. Awesome work!
hear me out: a Tinder...but for freelance jobs 🤔
idk about you but every morning i find myself sorting through a bajillion jobs in different platforms, looking for any red or green flags that make me want to apply or give up on freelancing all together. is it just me?
so i came up with the idea for FILTER, your morning companion to swipe left and right on job cards with the key info you need to know about them, all while you sip your morning coffee ☕️
then, once you're fully awake and ready for the day, you open your laptop and there you have it: an email with the list of all your picks, so you can apply and move on with the rest of your work day!
check it out for yourself (or see the walkthrough in the video below!)
Cooking something new 😁😁😁
Introducing Portfolio One — a premium Framer portfolio template built for designers, developers, creatives, freelancers, and agencies who want to showcase their work with confidence.
Designed with clean layouts, smooth interactions, and a strong visual hierarchy to keep the focus on what matters most—your work.
Features:
• Premium modern design
• Smooth animations & transitions
• Responsive across all devices
• Project showcase pages
• Case study layouts
• Fast loading & SEO-friendly
• Easy to customize in Framer
Whether you're building a personal portfolio or an agency website, Portfolio One gives you a solid foundation without starting from scratch.
🔗 Preview: https://portfolioone.framer.ai/
#Framer #FramerTemplate #Portfolio #WebDesign #UIDesign #CreativePortfolio #Designer #Freelancer #NoCode #WebsiteDesign
This looks incredible but that mouse effect distorts it a little i think. Also the way you present it with fast scrolls and non smooth agressive scrolling ruins the big potential of the work you do. It has a great potential but my advice for you to work on your presentation. Great designing tho!