Reno - Streamlining Home Renovation
Case study
1. Mission & Initial Problem
Many people start their home renovation journey feeling overwhelmed. Whether they’re redesigning a kitchen or updating a basement, they’re met with a fragmented process, including architects, designers, contractors, and permits; all in different silos. Reno set out to simplify that.
This concept project asked: What if we could bring all of it, planning, design, build, into one clear, trustworthy digital experience?
The design challenge was to build a web platform that communicates Reno’s full-service offering, matches users to renovation types, and encourages action—without triggering friction or mistrust.
Industry:
Home renovation / residential services
Project:
Reno
Role: Sole UX/UI designer and researcher; led competitive and secondary research, content strategy, journey mapping, UX design, UI system creation, prototyping (lo-fi to hi-fi)
Type: Concept responsive web platform for renovation service discovery and project initiation
Timeline: 4 weeks (solo sprint project)
Tools: Figma (for flows, wireframes, components, responsive layouts, and prototypes), hand sketches (early layout ideation), web-based research and industry reports
Figma Hifi prototype of website homepage
2. Problem Statement
Real-world renovation platforms tend to fall short in four key areas:
Lack of clarity: Users often don’t understand how the service works or what’s expected of them.
Process anxiety: There’s no clear path from “I have an idea” to “Here’s a plan and team.”
Trust gaps: With high financial stakes, users need validation, proof, and calm UX.
Disjointed visuals: Many sites lean heavily on imagery but lack structure or flow.
Reno was designed to reduce cognitive overload and offer a smoother path from interest to action.
3. Research plan & insights
As the sole researcher and designer, I conducted a mix of exploratory and competitive research:
Competitive teardown of platforms like Houzz, Sweeten, HomeAdvisor, and Smith
Review of renovation industry surveys (e.g. HomeAdvisor’s Homeowner Report, Sweeten’s user pain points)
Light field interviews with 3 individuals who had recently renovated homes
Design audit of relevant verticals (e.g. proptech, mortgage fintech) where high-trust UI is essential
Key Insights:
Users want to see process transparency up front—before being asked for personal info.
“Inspirational overload” is common—users get lost in images but don’t know the next step.
A clear, visual process (Plan → Design → Build) helps people feel in control.
Testimonials and press logos significantly boost conversion trust.
These insights informed the information architecture, visual design, and sequencing of content on the site.
4. Vision
The design vision focused on creating a site that feels:
Simple and human: Avoiding industry jargon or over-technical language.
Trustworthy and clear: With social proof, structured options, and visible outcomes.
Narrative-led: Taking users through a natural scroll-based journey—discover, trust, act.
Visually, I leaned into modern typography, soft earth tones, and generous white space to signal calm professionalism.
5. Opportunity
This concept explored how product thinking could apply to a traditionally offline industry:
How might we show users the renovation journey in one glance?
Can we reduce drop-off by building a “what to expect” model into the landing experience?
Could we shift from portfolio overload to a more focused, conversion-optimised UI?
6. Ideation, prototyping & testing
The Process:
Sketching & Flow Mapping
Initial sketches were done on paper to explore layout rhythm and the hierarchy of trust-building elements. I mapped user flows for:
Homepage → Quote request
Services → Learn more → Schedule call
Gallery → Trust-building → CTA
Wireframes & Component Planning
Wireframes were built in Figma with attention to responsive behaviour and reusability of sections like testimonial blocks, CTA footers, and service cards.
Visual Language & UI
High-fidelity UI combined:
A hero section with a clear one-liner and primary CTA (“Get your estimate”)
A visual process explainer (Plan → Design → Build) with supporting imagery
A service grid sorted by renovation type (bathroom, kitchen, backyard, etc.)
Social proof elements: testimonials, press mentions, and a gallery of results
A persistent call to action anchored at both mid-scroll and page end
All components were built with Figma auto-layout, semantic tokens, and named layers for clarity.
Hand sketch
Colour Palette and Typography (Created on Figma)
Mid-fi & Hi-Fi
Mid-fi Wireframe V1
Mid-fi Wireframe V2
Mid-fi Mock-up
Hi-fi Mock-up (prototype)
7. Solution
The final design offers a cohesive, conversion-ready landing experience:
Simple language that avoids overwhelming first-time renovators
Process clarity that walks users through how Reno works
Options segmented by intent (e.g. “Renovate your bathroom” vs. “Redesign your backyard”)
Gallery and social proof to deepen trust
Soft but modern UI that feels editorial and professional—rather than overly “techy”
The page design is responsive-friendly and optimised for desktop and tablet experiences (mobile to come in later stages).
8. Impact & Metrics
While this is a concept project, the design was built around real user needs and tested heuristics. Based on benchmarks from platforms like Sweeten and Houzz, the expected gains include:
Faster path to inquiry through CTA placement and clarity of flow
Lower bounce rates by reducing up-front friction and focusing user attention
Higher trust conversion via testimonial-first design and soft branding
Improved comprehension of Reno’s value prop through storytelling, not slideshows
9. Reflection & Next Steps
This project allowed me to deepen my thinking around service UX—where trust, clarity, and emotional ease matter just as much as visual polish. I was reminded how often users feel vulnerable or uncertain when making high-stakes, real-world decisions.
Next steps (if developed further) would include:
Testing the layout with first-time renovators to validate flow and comprehension
Designing responsive mobile screens
Exploring quote estimation flows and contractor matching as future user journeys
10. Credits & Constraints
Designer & researcher: Sole creator (concept project)
Tools: Sketching, Figma (end-to-end), self-directed research
Constraints: No live users; research limited to secondary sources and informal interviews
