Software Used:
Adobe XD
This project explored web design and UI/UX prototyping & layout through the creation of a real estate website for Southern Hills. Designed in Adobe XD, the study focused on accessibility, layout systems, navigation structure, and client-centered user experience across desktop and mobile platforms.
The objective was to design a modern real estate website that simplifies property discovery while increasing visibility for Southern Hills Real Estate. Beyond showcasing listings, the platform needed to support lead generation and encourage prospective buyers to contact an agent.
Phase 1 — Discovery & Project Definition
Discovery Phase
Three questions guided the initial discovery:
How extensive should the website be?
How should the business generate revenue through the platform?
Who is the intended audience?
The client's responses revealed several important priorities:
Keep navigation approachable without overwhelming first-time visitors.
Display essential property information such as pricing, location, etc.
Create opportunities for commission-based lead generation.
Appeal to buyers and renters across a broad range of income levels.
Those responses became the foundation for every design decision that followed.
Phase 2 — Research & Exploration
Establishing a Visual Direction
Before designing the interface, I gathered inspiration from leading real estate platforms to identify common interaction patterns and user expectations. The mood board focused on clean layouts, intuitive search functionality, card-based property listings, and simple iconography that would make browsing feel familiar and approachable.
Early hand-drawn wireframes were then used to rapidly explore page hierarchy, navigation, and overall user flow before investing time in higher-fidelity designs.
Phase 3 — Wireframing & Prototyping
Bringing the Experience to Life
The approved concepts were translated into interactive wireframes using Adobe XD, allowing the entire user journey to be tested before development. The prototype simulates desktop and mobile experiences, search functionality, property browsing, listing detail pages, agent profiles, and contact workflows.
Design decisions throughout the project emphasized clear information hierarchy, accessibility, and reducing friction for first-time home buyers.
Final Prototypes
Interactive Experience
The final prototypes demonstrate the complete experience across desktop and mobile, showcasing how users can search for homes, explore listings, connect with agents, and navigate the platform through realistic interactions.