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
Had a fun weekend building Lumina ⚡
Designed with Google Stitch.
I'm a developer who's been putting off rebuilding my portfolio for months. My question going into this challenge: could Stitch help me ship a real product — not just a mockup — in a single sitting?
So I built Lumina. Paste your GitHub URL, watch a fully animated portfolio stream onto the canvas in 60 seconds. Real repos, real data, live and shareable immediately.
How Stitch fit in:
I designed all five screens in Stitch before touching any code. The streaming canvas generation was the moment that changed everything — watching the portfolio build itself section by section made me realise: that's exactly what I want users to feel. The feature inspired the feature.
From there I worked almost entirely through in-place edits. Clicked the project cards, typed "stronger 3D hover with a glow matching the language color." Clicked the hero, typed "mesh gradient with a grid pattern." Changes in seconds. No re-prompting from scratch.
The motion work was where Stitch surprised me most — particle backgrounds, animated skill rings, 3D card hovers, all authored inside Stitch. Then one push to Netlify.
Features I used:
Streaming canvas generation
In-place AI edits via prompts + point-and-click
Import from existing website (used Vercel.com as style reference)
Native motion and hover states on HTML canvas
Netlify export
Feedback:
The streaming canvas collapses the describe → wait → judge → re-prompt loop into something that actually feels like designing. In-place editing is where I spent most of my time — clicking and describing beats tweaking properties in a panel every time.
Stitch didn't feel like a tool I was prompting. It felt like a canvas that understood what I meant.
Check it out:
Live site → https://grand-pixie-01f370.netlify.app
GitHub → https://github.com/AbdullahTariq74/Lumina-Stitch
Really like the idea of turning a GitHub profile into a live portfolio in seconds. Also interesting that the streaming canvas ended up influencing the core experience you built.
This was my take on the challenge:
https://on.contra.com/pnfJBQ
Curious what stands out to you.
on.contra.com
Introducing Voya: Revolutionize Your Travel Planning Experience
Connect with next-gen talent and tools to get work underway. Hire more independents. Start more projects. Get more creative.
Peak creativity right here in this piece.
Thanks for the appreciation!
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
Challenges
View all
Related posts
Working on the homepage for Still Blooming, a wedding and floral studio, I explored two different layout directions for the hero section. Same brand, same copy, just a different structure and visual rhythm.
Option 1 : Left Aligned. Text sits on the left with supporting content beside it, giving an editorial, asymmetrical feel.
Option 2 : Centered. Everything is stacked and centered, giving a clean, balanced, more classic hero layout.
Would love your honest UX/UI take which direction feels more elegant, functional, and true to a wedding/floral brand, and why?
22 voted
41%
32 voted
59%
54 votes
Closed
Great Design :)
Designed a dashboard concept for tracking net worth across every asset type — stocks, crypto, property, pensions, funds, cash, and liabilities — all in one place.
Instead of the usual pie chart or bar graph, the centerpiece is a dial: a single, glanceable gauge showing where your wealth actually sits. Behind it, a quiet grid of every asset category fades in and out of visibility, reinforcing that everything's accounted for even when it's not the focus.
Dark UI, a single confident green accent, and a lot of negative space — built to make a genuinely overwhelming task (seeing your entire financial picture at once) feel calm instead of cluttered.
wow the animation feels super smooth, what is this animation for?
Day 10/30 of my hero section challenge.
Today: Ofelia, a spa in Bali.
→ The wordmark sits at eye level, spanning the full width, cutting across the middle of the space. Here the type claims the room, and because the interior is symmetrical and calm, it can take the weight.
→ A high-contrast serif against soft plaster. The architecture is all curves and matte texture, so the type brings the only sharp edges in the frame. Contrast without adding a single element.
10 down, 20 to go. A third of the way.
Template by Hariom, adapted and customized by me. Interior imagery generated with AI.
Contrast without adding a single element is such a clean way to put it. With 20 more of these to go, are you locking the typographic approach per venue type, or is Ofelia's centered serif going to be the constant across the whole 30?