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
Converted a Figma design into a fully responsive real estate website using HTML, CSS and vanilla JavaScript.
The site features a multi-page layout with a property listing page and a dedicated property detail page. Clicking any property card dynamically loads that property's image on the detail page using localStorage and JavaScript.
Built with fluid typography and spacing using CSS clamp() and custom properties for full responsiveness across mobile, tablet and desktop — no frameworks used.
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
Built a quiz funnel for a meditation app that actually converts
Client came through an agency partner with a Figma design for STILL - a meditation subscription app that needed a quiz-style onboarding flow to segment users before checkout.
The build:
Figma design → Replo landing page on Shopify
Custom JavaScript for multi-step quiz logic (personality assessment, goal selection, personalized plan recommendation)
Dynamic pricing display based on quiz responses
Conditional page sections that show/hide based on user answers
Mobile-responsive throughout
The technical fun:
Replo's data-id attribute handling is quirky when you're building complex conditional logic - had to structure the JS to work with Replo's rendering without fighting the platform. Also built fallback logic so the funnel degrades gracefully if JS fails (still navigable, just loses personalization).
Final result: clean quiz experience that feeds directly into Shopify checkout with the right plan variant pre-selected.
Working with agencies on specialized builds like this is where I thrive - you give me a design system and complex requirements, I turn it into functional code that actually works.
The visual hierarchy here is really strong, great work!
Created This Website In Just 35 Minutes With Vibe Coding
(GPT 5.4 In Visual Studio)
What's Your Thoughts On It ?
(And Yeah I Know It's Not So Much Depth But As Starting That's Good I Think)
35 minutes is impressive on the surface and dangerous on the back end. The visual is clean. The real test is what happens at month two when a client wants a CMS, conditional logic, and SEO that performs. Vibe coding gets you to v1. Engineering keeps you alive at v3. Build the muscle for both.
Designing a fashion landing page in a short timeframe taught me that visual storytelling is as important as usability.
Key learnings:
- Fashion design relies heavily on imagery and mood, not just layout
- A strong first impression (hero section) defines brand perception
- Minimal and clean UI enhances the premium feel of fashion products
- Clear CTAs are essential, even in visually driven designs
Most importantly, I realized that in fashion UI, the design should complement the product not overpower it. The goal is to create an experience where users feel inspired while navigating effortlessly.
Still I used figma a for Designing Landing Page.
@Figma
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?
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?