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
I rebuilt the NFCtree website to match the new app.
Same colors, same fonts, same textures, from one design system.
⠀
I explored layouts in Paper first.
Looked at how Anchor, ugly.cash and Klarna handle scrolling.
Picked one.
⠀
Then I designed it in Figma.
Claude Code turned it into code.
Pushed to GitHub.
Vercel published it.
⠀
The scroll motion is CSS only.
It turns off when reduced motion is on.
⠀
Does your website look like your product?
Great work 👏🏻
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
Different products need different shopping experiences.
When exploring Shopify store design, I like thinking about how the brand, product category, and customer journey should influence the final layout.
For example:
→ A home decor store needs strong visual presentation and an editorial feel.
→ A coffee equipment store needs clear categories and product information that helps customers compare options.
→ A fitness store needs organized collections and a straightforward path to the right equipment.
The goal isn't to use the same design for every business.
It's to understand what each store needs and build an experience around it.
These concepts explore three different directions, but they share one principle:
Good e-commerce design should make products easier to understand and easier to shop.
Which of these three store styles would you be most interested in exploring?
Great point. I’d pick the home decor one, editorial layouts really sell the vibe. 🔥
Section, a matcha shop that runs itself
The problem A lot of matcha brands skip the story. You buy a tin and never learn where the leaf grew, how it was shaded or how it was ground. And the instructions come as a little booklet in the box that ends up in a drawer by the second bowl.
The idea Tell the story on the website, and move the instructions there too. Section is a concept matcha brand: the site follows one leaf from the field to your bowl, then sells one box with the matcha and the five tools a barista uses. There's no booklet in the box. The guide lives on the site: every part lettered A to F, four drinks, each step read aloud, and pages that turn by themselves while your hands are busy. Live: pure-section-space.base44.app
Automation depth Behind the counter, the shop runs itself:
Saves time: an order lands on the packing board the moment it's placed, with where it ships. Nobody copies orders out of an inbox.
Improves operations: stock counts itself. Every order takes its items off the shelf (a box takes one of each part). At 3 left the shop says "Only 3 left" and I get an email. At zero, the item sells out on its own.
Increases leads: a sold-out item offers "Tell me when it's in". That's a list of people who want to buy. When I type a new count, each of them gets one email.
Enhances the customer experience: the buyer gets an email at every step: got it, packed, on its way. The last one links to the guide, so the steps arrive before the box does.
The packing board is mine, behind a sign-in, and addresses are kept where only I can read them.
** It all runs on Base44: its database, Google sign-in, one backend function for the emails, and its hosting. **
Design quality
One idea runs through the whole brand: everything is drawn in one black line, and the only colour is the matcha's green.
The first screen is a small matcha bar. Scroll, and it opens into its own drawing.
The phone layouts are designed, not shrunk. The box, its price and its key stay at the foot of the first screen, and the guide's Back and Next stay under your thumb.
How I built it I tried style directions in Figma, built the site and automation in Base44, and I published from there. The video shows both sides: buying the box, and running the shop.
Real-world use Section is a concept, and no payment is taken. Everything else is built to run as a real shop: real orders, real emails, a locked staff board and private addresses. Add a payment provider, and a matcha brand could start selling with it.
Ohhhhh this is very nice
Wild Beasts – Wildlife Website UI/UX Design
A premium wildlife website landing page concept inspired by the beauty, strength, and mystery of wild animals.
The design combines a minimalist layout, immersive black panther imagery, rich forest-green colors, and elegant typography to create a visually engaging digital experience. The animal showcase section highlights different wildlife species while maintaining a clean and intuitive user interface.
Nice work