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
every page gives the visitor instructions
what to notice first
what to trust
what to skim
what to ignore
what to remember
those instructions are not written in the copy
they are built into the design
this is why “write the content first
then make it look good” is such a weak process
layout changes priority
type changes tone
spacing changes pace
imagery changes credibility
hierarchy changes meaning
design is not decoration around content
design is how content becomes understood
This is a good reminder that hierarchy is doing the persuading before a single word gets read. Do you usually sketch the hierarchy in wireframes first, or do you let it emerge once real content and images are in place?
hierarchy is not something you do once
every change can shift the focus
so you keep checking it from the first wireframe to the final polish
"Design is how content becomes understood" is a perfect summary. If your layout isn't guiding the users eye and telling them what to look for first the copy wont even matter because they will already have gone away.
spot on
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
Spent the last few weeks redesigning the ZipIt Web landing page.
Not because it looked bad.
Because it wasn't explaining the product fast enough.
The goal was simple: help visitors understand ZipIt in under 10 seconds.
✨ What changed?
🎯 Clearer Hero
One strong value proposition instead of multiple competing messages.
Added 🎰a slot-style interaction that cycles through ZipIt's core capabilities, making the value proposition instantly clear while giving visitors a playful, hands-on introduction to the product.
📖 Better Storytelling
The page now walks visitors through the product before asking them to sign up.
🧭 Simpler Structure
Hero → Demo → Features → How It Works → Pricing → FAQ → Contact
🎨 Cleaner UI
More whitespace, better typography, and a stronger visual hierarchy.
🟠 Focused CTAs
Orange is now reserved for primary actions, making buttons stand out naturally.
💬 Better Copy
Rewrote sections to focus on outcomes, not just features.|
💰 Clear Pricing
Free, Pro, and Lifetime plans are easier to compare.
🤝 More Trust
Added real product screenshots, integrations, and social proof.
One thing I kept asking myself:
"If someone spends only 10 seconds here, will they understand the product?"
That question shaped every design decision.
Still refining the experience, but this version feels much closer to what ZipIt has become.
Would love your feedback! 🚀
Happy weekend, builders! 🚀 Take some time to rest, explore new ideas, and come back inspired. See you next week! ✨
#BuildInPublic #ProductDesign #LandingPage #UXDesign #SaaS #ContentDesign #IndieHackers
I love the idea, design & execution and the way you shaped it around the first 10 seconds without distorting the main design and aesthetic. Great work!
I’m exploring two homepage hero directions for a Scramble Systems concept and testing which layout communicates the message more effectively.
Both directions use the same core idea: helping small teams deliver big wins in tough situations.
Direction 1 feels more structured and modular.
The large brand title creates a strong first impression, while the green content block makes the key message feel direct and contained.
Direction 2 feels more dynamic and action-driven.
The headline becomes the main focus, the green emphasis adds more energy, and the large athlete image makes the concept feel more immediate.
Direction 1: bold, structured, brand-forward
Direction 2: dynamic, focused, action-driven
Which direction feels stronger for a consulting/leadership website?
13 voted
30%
30 voted
70%
43 votes
Closed
Direction 2
One of my favourite parts of this website redesign.
The Bento grid.
But the interesting part isn't the final design. It's what happened before it. Instead of jumping straight into UI, I opened Figma's pencil tool and sketched every block first.
Not to make it look good.
To figure out what each section should communicate. That's usually the hardest part.
Once the structure was clear, designing became much faster because every card already had a purpose. After that, I brought the layout to life with subtle animations, giving it a modern, tech-focused feel that made the entire section feel much more interactive.
The client loved the final result, and honestly, this is why I enjoy UI/UX design so much: solving the thinking before solving the visuals.
BTW How do you approach a new design?
Do you sketch first, wireframe, or jump straight into high-fidelity?
Great Presentation!
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.
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?