Khoj Property Rental Application UX Case Study
A detailed UI-UX Design process for a conceptual property rental application aimed to address challenges & concerns in the current property rental market.
Overview
This UI-UX project is envisioned with the idea of addressing certain challenges faced by the real estate market in India. The process involves a discovery phase, user research, wireframing & prototyping. I have decided to make the User Interface simple & minimal to make the application look premium, and all it’s features consistent within all screens.
The design fundamentals & the principles have given direction to the final outcome of this project.
The process
The design procedure for the Khoj Property Rental Application is a multi-fold process as illustrated below. This procedure allows me to analyze the existing market from different perspectives of all the stakeholders in order to cater to the specific needs of every party.
Domain knowledge
The real-estate market in Mumbai is saturated on a superficial level. The demand for rentals is being met, however most of the dealings take place offline through physical agents. These agents charge high percentages, which often leads to dissatisfied tenants. The dealings are limited in the digital real-estate industry, with most present interfaces listing real estate agents. The design fundamentals & the principles have given direction to the final outcome of this project. I have mentioned a few challenges faced by tenants in the online real-estate market below.
Real estate agents & their high brokerage, coupled with their inefficiency to complete their tasks
Less variety & options of rentals with one single agent, and time wastage by visiting many such agents.
Frequent online & offline housing scams, fraud leading to fear among tenants
I also decided to do a short competitor analysis as it would give me context about the current market & would eventually help me interpret my user research survey better. Moreover, an accumulation of pros & cons would help also help me build a foundation for the affordances in my application.
The Main Objective behind the Khoj Application is to eliminate real-estate agents by providing a professional platform that connects verified landlords directly with tenants, where tenants can browse multiple rentals under one roof.
User Research
Online Survey
Topic: Existing quality & usability of current real-estate mobile applications.
Number of participants: 27
Target Audience: Real Estate Application Users who have used at least one application in last 2 years.
Key Survey Insights
Poor customer support
High membership fees charged with no guarantee for rentals
Slow and glitchy application with sub-par interface
The survey helped us in understanding the current scenario of the online real-estate market. It gave me an overview of the general problems being faced by the end user. It helped me establish a list of expectations that these users might have from a prospective real-estate application. These expectations form the base of my application, since these are areas that users are most concerned about. Moreover, when working with real-life clients, this survey can also help in marketing & copywriting, where the company can advertise the application with the help of these user expectations being staged as unique selling proposition.
I have created a user persona for my application, based on surveys & talks with a real-estate analyst. This persona will serve as a guide towards technical affordances that are demanded by the target audience.
Information Architecture & User flow chart
The user research process, along with the discovery phase has given numerous insights about the prospective application & its features. Keeping the user wish-lists, competitors & business goals on the table, I have compiled all the information to give direction to the application. This information architecture acts as a blueprint, helping in understanding various affordances & cues that will be involved during the design & prototype process.
To make this possible, I first conducted a digital card sorting with different terms & features associated with my application. This process first helped me to brainstorm about the application that I am making, & then allowed me to arrange them in a semantic way.
Along with the information architecture, I decided to create a user flow chart for my application. A user flow chart is very crucial for the UX as it helps in establishing & ordering screens, helps the navigation to become simple & easier & lastly makes the prototyping more straightforward.
The User Flow chart is conceptualized on the basis of a ‘minimum viable product (MVP)’. An MVP is a product that is created considering the core functionality of the application, without any peripheral/bonus features that might hinder the development & design process. Therefore, I decided to first create a user flow for my MVP (Dark Blue) and then add peripheral features to the network (Light Blue). With a proper user flow.
Wireframing & User Interface
I designed a low fidelity & a medium-fidelity wireframe for my application. This wireframe helped me bring my user flow chart to life, with the addition of actual screens. A wireframe also allows me to plan the layout and location of my elements without worrying about the end product & the UI. I have attached a brief wireframing process for my MVP below.
The final UI Design was made with a careful selection of colors and typography appropriate for the application. I decided to go with 2 shades of blue because they indicate reliability & trust. Considering numerous housing scams in the market, it is important to establish trust amongst our prospective tenants. Moreover, the blue color also resembles calmness, which is much needed amongst tenants who are planning to take a colossal decision of spending a large sum of money on their rentals.
I decided to take a few design decisions in order to enhance the User Interface of the application. These decisions mainly include the following:
Subtle Gradients: Adds depth to the CTA & gives a sleek feel
Light Drop shadows: Eliminates dark borders for the cards making the application look more premium.
Smooth & Rounded corners: Makes the user feel more calm & relaxed.
User Application testing & Feedback
I was able to conduct a small scale User Application Testing with 32 participants. The testing consisted of 2 stags.
1. Timed Tasks: The users were given medium & long tasks to complete on the prototype. Medium tasks mainly included the login process and navigation around the dashboard. While the longer tasks involved applying filters, viewing properties & accessing chats.
94% of the users were able to complete the medium tasks without any difficulties.
91% of the users were able to complete the long tasks without any difficulties.
2. Feedback Session: I requested all the participants to test all the screens & provide detailed feedback. Here are some entries by volunteers:
“The application is well structured & is easy to navigate. Little to no animations make it simple & straightforward”
“The dashboard links everything accurately. I feel that there should be more focus on the commercials & booking process.
“The design of the application is minimalistic giving it a premium feel for the users. But, I would have liked some micro animations”
Conclusion & Outcome
The application design was generally appreciated by the users. The general feedback was about the lack of animations & micro-interactions in the design. Yet, I decided to go with the final design because I felt that a property application needs to be straight forward & adding heavy animations would lead to me compromising the usability. In all, the application is known for its simplicity.
As far as the user experience is concerned, I have attempted to solve several problems associated with the real estate market.