Illustration of various house and building outlines on a green background with the words "My Place" in the center.

Designed a responsive real estate app and website with an intuitive, visually appealing interface for effortless browsing, searching and contacting agents.

Homepage of a real estate website called 'My Place' with navigation options for commercial, residential, buy, rent, sell, and a sign-up/sign-in button. The page features a neighborhood scene at sunset, with the headline 'Your Real Estate Concierge' and search options for buy, rent, or sell. Below, there's a section highlighting the top 20 best places to live in the US with images of happy people and a red 'Read More' button. Further down, there are three sections explaining services: buying, renting, and selling homes, with each having a call-to-action button.
A real estate listing for a house at 3825 Shadow Ridge Ct, Las Vegas, NV, showing exterior and interior images, price, and details.

SUMMARY

During the UI/UX design process for this real estate website and mobile app, I conducted competitive research to understand strengths and weaknesses. I developed low-fidelity wireframes to explore and iterate on layout and functionality, then transitioned to high-fidelity prototypes to refine the design details.

Key features such as advanced search filters, interactive maps, virtual tours, and seamless communication tools were integrated to enhance user experience. The final design ensures a responsive and visually appealing interface that adapts seamlessly across devices, providing a consistent and engaging experience for users.

ROLES

User Experience

UI Design

Research

TOOLS

Figma

HeyCollab

RESPONSIBILITIES

Competitive Research

Moodboards

Sitemap

Low Fidelity Sketches

High Fidelity Wireframes

Prototype

A miniature house model with a set of keys and a keychain on a wooden surface.

CHALLENGE

The challenge for MyPlace lied in three key pain points: a lack of personalization, difficult navigation, and nothing setting them apart and above competitors.

SOLUTION

To address this challenge, I leveraged user research and feedback to design an intuitive, responsive interface that prioritizes ease of navigation and personalized experiences, integrating advanced search capabilities and real-time communication tools. This design enhances the app's distinctiveness in a competitive market by incorporating innovative features such as virtual tours, AI-driven property recommendations, and a visually striking design that conveys professionalism and trust.

THE PROCESS

1

COMPETITIVE RESEARCH

The initial step is to comprehensively analyze the competitive market landscape. This involves examining the offerings, strengths, and weaknesses of existing real estate applications.

Comparison of realtor website interfaces on mobile and desktop. The mobile screens show app and map views with property filters, while the desktop view displays property listings, a homepage image, and informational text about real estate services in
Comparison of the Trulia website across mobile app, desktop, and mobile screens showing real estate listings and features.
Comparison of Zillow mobile app and desktop website interfaces showcasing real estate features and search options.

2

MOODBOARD

Creating a moodboard for a real estate app involves curating a collection of colors, textures, fonts, and imagery that convey a sense of elegance, trust, and professionalism, setting the visual tone for an inviting and user-friendly interface.

Mobile app screens displaying real estate listings, property filters, and search interface with color palette samples.
Two mobile phone screens displaying a real estate app interface, showing options to buy or rent homes, local area information, and property listings with images.
Mobile app interface displaying apartment listings and rental options, featuring images of buildings, prices, and details, along with color-coded labels and buttons for navigation and actions.
Three mobile app screens showcasing architecture and urban planning projects, with color swatches on the right side.
Three smartphone screens displaying a real estate app featuring a black modern house in Bali, Indonesia, with options to view details, descriptions, and rental pricing, alongside a photo of a modern dining room interior with a table, chairs, plants, and shelving.
Online real estate listings showing properties for sale, including a house and a modern outdoor area with seating and a pool.
Screenshot of a mobile app interface for a logistics or vehicle services platform, showing options for selecting services, a map with a route, and service categories like cleaning and office logistics.
Screen showing property listings, filters for property type, price range, location, bedrooms, and amenities like garage and pool.
A collection of mobile app user interface screens showcasing features like meeting location search, meeting details, chat, notifications, and checkout pages for a social or event planning app.

3

SITEMAP

Developing a sitemap for the UI/UX design process of a real estate app is crucial as it provides a structured blueprint, ensuring logical navigation, efficient organization of content, and a seamless user experience across the platform.

Flowchart outlining user navigation for a real estate app, including login, property search, feature highlights, property details, user account, and settings.

4

USER EXPERIENCE

Designing the user experience with low-fidelity sketched wireframes first allows for rapid iteration and exploration of layout and functionality, facilitating early feedback and alignment with project goals. These wireframes serve as a foundational blueprint, enabling a focus on the structural aspects of the interface before delving into finer details.

Transitioning from low-fidelity sketches to UX wireframes provides a more detailed blueprint, refining layout, functionality, and interactions while maintaining flexibility for iterative improvements and feedback. This approach ultimately shapes the foundation for the app's user experience before moving into higher-fidelity prototyping stages.

Sketches

  • Sketch of a smartphone screen displaying a simple home icon, the words "MY PLACE," and a horizontal line below the text.

    Splash

  • Sketch of a house with a triangle roof and a rectangular base, three horizontal lines beneath it, and several rectangular boxes below the lines, all drawn on a smartphone screen.

    Sign Up

  • A hand-drawn sketch of a smartphone screen with various illustrated interface elements, including a back arrow, status bar, progress bar, buttons, and other UI components.

    Filter

  • Sketch of a smartphone screen with interface elements, including navigation icons, a large 'X' symbol, three squares with 'X' marks inside, a progress bar, lines representing text, and a row of rectangular buttons at the bottom.

    Listing: Images | Description

  • Sketch of a smartphone screen displaying a map with marked locations, navigation controls, and a map preview in the center.

    Listing: Map | Details

  • A black and white sketch of a smartphone screen showing a schedule tour app interface with various menu options and checkmarks.

    Listing: Tour | Contact Details

Low Fidelity Mobile

  • A digital illustration of a smartphone screen showing a logo with a house outline, outlined buildings, and the bold text "MY PLACE" in the center, with a black line underneath.

    Splash

  • Mobile app screen for a real estate concierge service, with a house icon above the text, and options to enter an email or continue with Apple, Facebook, or Google. There is a 'Skip' button at the bottom.

    Sign Up

  • Mobile app screen for real estate search with options for residential or commercial, buy, rent, or sell, and a search bar for location.

    Landing

  • Mobile screen showing a real estate app with a map of Las Vegas, NV, displaying house prices, and a listing for a house at 4863 Springs St priced at $495,000.

    Search Results

  • Mobile app screen showing saved property searches for Las Vegas, NV, with options to view Homes or Searches. The search results include details like price range, number of bedrooms and bathrooms, and the presence of a pool. The bottom navigation bar has icons for Search, Feed, Saves, Updates, and More.

    Saved Searches

  • Black and white photo of a large residential house with a wrap-around porch, multiple gabled roofs, and a landscaped front yard.

    Listing 1 of 5

  • Mobile interface for scheduling home tours, including search commute times, description of the home, options for in-person or video chat tours, and date and time selection.

    Listing 2 of 5

  • Real estate listing details for a single-family home built in 2002, with central gas or central AC, two attached garages and space for one RV, located on a 7,321 square foot lot, priced at $231 per square foot, with a monthly HOA fee of $56.

    Listing 3 of 5

  • Real estate app screen showing property for sale at 4863 Springs St, Las Vegas, NV for $495,000. Features include 4 bedrooms, 2.5 bathrooms, 2,156 square feet on a 7,489 square foot lot. Sections for community, schools, price history, and recommended places, with contact agent input at the bottom.

    Listing 4 of 5

  • Mobile real estate listing form with fields for phone number, email, and property interest, including checkboxes for buyer's agent, financing info, and terms agreement, along with listings of similar properties, agent contact info, and options to call, message, or tour.

    Listing 5 of 5

Low Fidelity Desktop

Registration popup with house and hand icon, an input box for email, and options to continue with Apple, Facebook, or Google.
Screenshot of a real estate website displaying homes for sale in Las Vegas, NV, with filters for price, property type, square footage, and location map, featuring various house listings, similar places, and nearby places.
Listing for a house for sale at 3825 Shadow Ridge Ct, Las Vegas, NV 89117, priced at $499,999, featuring 4 bedrooms, 2.5 bathrooms, 2,156 square feet, and a 7,489 sq ft lot. Includes interior and exterior images, a virtual tour, map, and details about the property.
A real estate website homepage with a gray scale theme. It features navigation options for commercial, residential, buy, rent, sell, and sign in. The main headline reads 'Your Real Estate Concierge,' with options to buy, rent, or sell. A search bar for locations is prominent. Below, there's a section highlighting the top 20 places to live in the US, with a call-to-action button. The page offers help with buying, renting, and selling homes through three columns. There are listings of four homes with images, prices, addresses, and options to schedule a tour or view the listing. Further down, a section prompts users to begin their search with questions about the type of place, desired activity, and location, followed by a 'Get Started' button. At the bottom, there's a footer with links for company info, buyers, sellers, renters, advertising, social media icons, and an email subscription form.
Real estate website dashboard displaying saved searches for Las Vegas, Nevada, showing listings for sale with details on price, bedrooms, bathrooms, and pool features.

5

USER INTERFACE

This responsive real estate interface is designed to be a seamless and intuitive experience that caters to users on various devices. This process started with understanding user needs and behaviors, leading to a clean and organized layout that prioritizes ease of navigation. Essential features like property search, detailed listings, high-quality images, and interactive maps are designed to be accessible and visually appealing across different screen sizes.

Ensuring fast loading times, incorporating filters, and providing easy contact options further enhance the user experience. The interface is aesthetically pleasing, using a consistent color scheme and typography to evoke trust and professionalism, while responsive design principles ensure a smooth and consistent experience on smartphones and desktops.

  • Green background with white line drawings of various buildings, including houses and city structures, and the words "MY PLACE" in the center.

    Splash

  • Screenshot of a mobile app sign-in page for a real estate concierge service, with an icon of a house in a hand, fields for email input, a large orange 'Continue' button, and options to sign in with Apple, Facebook, or Google, with a 'Skip' link at the bottom.

    Sign Up

  • A person pinning a red pushpin onto a blueprint or map with several other red pushpins nearby, used for planning or marking locations.

    Landing

  • Mobile real estate app showing search results for homes in Lakes, Las Vegas, NV with prices from $400K to $495K, map view with highlighted properties.

    Results

  • Mobile app filter screen for real estate listings, showing options for residential properties for sale, with price range $400K to $500K, 3 or more bedrooms, 2 or more bathrooms, keywords, and property type filters.

    Filters 1 of 2

  • Screenshot of a real estate filtering app. Options shown include 'Days on MyPlace,' 'Lot Size,' 'Year Built,' 'Parking Spots,' and various features like 'Open Houses Only,' 'For Sale By Agent,' 'For Sale By Owner,' with toggles for each.

    Filters 2 of 2

  • Mobile app screen showing saved property searches for Las Vegas, NV with details and results count, tab highlighted at bottom, and navigation options at the bottom.

    Saved Searches

  • Screenshot of a real estate listing for a house at 3825 Shadow Ridge Ct, The Lakes, Las Vegas, NV 89117, showing an exterior photo of the house with a large porch, and interior images of the kitchen and other rooms.

    Listing 1 of 5

  • Mobile app interface for scheduling home tours, showing options for date and time, with a map and location pin at the top.

    Listing 2 of 5

  • Screenshot of a real estate listing app showing home details such as type as single family, built in 2002, central gas heating, central AC cooling, and parking for two vehicles. The listing includes HOA fee of $56 per month, lot size of 7,321 square feet, and price per square foot at $231. Nearby places section features a listing for a house for sale at $495,000.

    Listing 3 of 5

  • Real estate listing interface showing a house for sale at $495,000 with details on size and rooms, contact form, and recommended places.

    Listing 4 of 5

  • Real estate inquiry form with fields for phone number, email, and property interest at 3825 Shadow Ridge, Las Vegas, NV 89117. Includes options for buyer's agent, financing information, and terms agreement. Shows similar property listings, and contact buttons for call, message, or tour. Brokered by At Home Realty, agent Susan Fleicher.

    Listing 5 of 5

A pop-up registration window on a real estate website titled 'Register or sign in and we'll help you find the perfect place.' It contains a field to enter an email address, a red continue button, and options to continue with Apple, Facebook, or Google. The website background shows a suburban street with houses, trees, and the sun setting.
Screenshot of a real estate website showing residential homes for sale in Lakes, Las Vegas, NV, with listings, a map, filters, and navigation options.
A real estate listing for a house at 3825 Shadow Ridge Ct in Las Vegas, NV, showing interior and exterior photos, price of $499,999, and details about the home.
Homepage of a real estate website called My Place, featuring options for commercial, residential, buy, rent, and sell. It highlights top neighborhoods in the US, available homes for sale, and search functionalities for properties. The page includes sections for buying or renting homes, newly listed homes, and a footer with links about the company, buyer and seller resources, and contact information.
Screenshot of a real estate website page titled 'Saved Searches' showing multiple saved property searches for Las Vegas, NV with details and options to view new listings, along with a section to add a new search and website footer with company information and social media links.