Bayut App | Portfolio

Bayut - UAE Real Estate App

An app by Bayut.com to connect users with a vast database of active properties in the UAE, allowing them to find apartments, villas, offices, townhouses, and shops.

ROLE

Product Designer

User Research, Data Collection & Persona,

Low to High-fidelity wireframes, Prototyping,

User Testing & QA Testing with the Dev Team

DURATION

3 Months

TOOLS USED

Adobe XD

COMPANY

While I was working at Bayut, as a Lead Product Designer, I was tasked to redesign their customer-facing mobile app both for Android as well as iOS.

OVERVIEW

Bayut is the leading UAE real estate app built for buyers, sellers and tenants keeping a seamless user experience in mind. Today, Bayut stands as the most trusted real estate website in the UAE with over 2.8M visits per month, and close to 1200 agencies listing on our platform.

PROJECT GOALS

I was responsible to redesign the app, keeping in mind the different users and giving them an easy user experience combined with a new and modern look and feel. This project took 3 months to complete with me being the sole designer, along with a team of android and iOS development teams. I worked very closely with the CEO of the company, giving him weekly briefings and incorporating his feedback.

This project didn't require me to go over the entire design process like user interviews, contextual inquiries, and persona development. The scope of the project like what features were required and what improvements were needed was already defined by my PM and the CEO based on their own research.

However, I still incorporated a human-centered approach for my short research befire I dived into high-fidelity designs.

RESEARCH

The product was already on the market with thousands of users. I made use of those users to interview them and understanding what they liked and disliked about the old design and experience.

After some initial user research, I conducted a direct and indirect competitive analysis looking at some real estate apps out there such as Zillow, Trulia, Realtor.com as well as other indirect competitors such as Airbnb.

The customer who wants to buy a property in the UAE.

The real estate agent who wants his properties to be sold or rented out.

The customer who wants to rent a property in the UAE.

The Users

IDEATE

Determining the solution.

The redesign of the app focused on the following:

UX improvements such as decreasing the number of taps and screens for the filters screen.
Adding the 'Add Property' feature for the real estate agents.
Adding 'Listing Quota' view feature.
Adding a new Google Maps integration for nearby amenities and utilities.
Adding the 'Arabic Language' toggle.

WhatsApp%20Image%202020-03-06%20at%2012.

DESIGN

I started off the design using a paper and pen to sketch out the possible versions of the improvements for the app. Once I was clear on what I wanted, I digitized the low- fidelity wireframes into mid-fidelity wireframes in Adobe XD. Below are the final mid-fi wireframes.

USER TEST

Validating the designs.

The designs went through a lot of cycles of user tests and improvements to enhance the user experience and provide added value to the product. I worked very closely with the CEOs in order to make sure the designs meet the business requirements as well as the user needs.

BEFORE THE TESTS

KEY SCREENS

The filters screen changed quite a bit from the previous design. The user tests showed that people did not like using two different screens and more taps to choose the filters. Hence, I changed the filters screens from more than one to just one, with fewer taps.
The listings screen looked pretty cluttered with the filters displayed at the top especially on smaller phones. Hence, it was decided to remove those filters from this screen to emphasize more on the listings.
The locations screen did not change much, except that I added a check to select more than one location and reduce the number of nearby locations to three to reduce the clutter.
The maps screen was changed to accommodate 'nearby' and 'directions' in the same screen with the use of tabs as will be shown in the final design. Also, the utility (schools, hospitals) buttons were changed into a carousel to accommodate more buttons on one screen.