VPP Home Rental Searach revamp | dennisuiux
top of page

The redesign of the mobile rental home listing & browsing experience for the No.1 Chinese-facing classified listing platform in Westcoast Canada

How I helped VanPeople Classified listings's home rental search gain 50% more monthly visitors on mobile devices, a 30% increase in the avg number of rental listings getting posted daily, and an 80% increase in monthly revenue through executing a massive multi-stage end-to-end design project.
Landing page.jpg
Project overview
As VanPeople's classified listing became more popular, the platform was running into issues hindering further growth

10 years after its launch, benefiting from the massive influx of Chinese international students coming to study abroad in Canada, VanPeople's classified listing platform has grown to become the most well-known platform for Chinese living in British Columbia to look for home rentals.

However, as more of the general Chinese user base was getting younger, VPP's classified listing's outdated design, the lack of modern filter features, and the massive amount of low credibility rental listings populating the browsing pages have resulted in the platform having major difficulty in attracting new users.

To improve the platform's ability to attract and retain new users, as the product design lead of classified listing, I kickstarted a 6-month long massive product revamp project in late 2020 by working with 1 other product designer and 2 full-stack developers.

Background problem
A lot more people have started to search for rental properties somewhere else

When comparing Dec 2019 - Jun 2020 to Dec 2018 - Jun 2019

The home rental section's average daily visit count fell from 14.5k down to 10k .

The average amount of new rental listings being posted each day went from 150 down to 110.

While the decline might have been linked to COVID-19, the drop in these matrics was alarming because it was starting to negatively impact the platform's advertisement service renewal rate.

Average daily visitor count of home rental section.jpg
Qualitative user research
To get a better sense of why the platform was losing users, we spent around two weeks in early 2021 talking to 20 of our existing users

Participants invited through SMS & email were randomly selected so that they could better represent the general user base. 

Participants included active users that have used our platform in the most recent 6 months and users who have not been active for quite some time.

User interview pic.jpg
Interview findings
Low listing credibility, lack of tools to narrow down search results, and a tedious rental property listing flow were the three main reasons behind why people were leaving

17/20

Complained that many rental listings did not seem that credible.

16/20

Reported that looking for homes took too much effort as there were no ways for users to narrow down their options.

For participants who have posted rental ads before

4/5

Reported that they do not really feel like adding detailed rental info when they list properties on our platform.

User feedbacks.jpg
User jounrey mapping
To better visualize the pain points experienced by our users, we created a user journey map by using the data we gathered from the user interviews we conducted earlier
User Jounry.jpg

The sections highlighted in orange are areas that are most likely going to be affected but our design effort

Market competitor research
My team compared VPP’s rental section to other popular platforms used by our users and the finding was consistent with the user feedback we got earlier

Posting a property on our platform was the easiest among all of the companies I compared to because we allowed users to post a rental listing ad by just simply typing [room for rent] in the title and some 20-character-long description about this rental listing without the need to upload photos, put down an address or even state how many bedrooms or bathrooms are included in the rent resulting in VanPeople having the lowest listing credibility.

Position research.jpg
Dive deeper into the why
The lack of incentive to add info to the rental listings resulting in poor listing credibility was creating a chain reaction that was constantly driving users away
Old property listing flow.jpg

Poorly designed listing flow forcing users to manually type in all rental-related information made posting new rentals extremely tiresome and therefore many users felt unincentivized to spend time typing in all the details that could have made their property listing more credible to look at.

Old filter.jpg

Also, because there was no comprehensive search filter, the platform was unable to effectively utilize any detailed rental information to help users find suitable rental listings faster, therefore, users were further disincentivized to put down more detailed information.

Old listing browsing page.jpg

In the end, because of having poor listing credibility, users, in general, have found the home searching experience to be really inconvenient, and the decrease in user base further disincentivizes the landlords to spend enough time filling in property details.

Old listing detail page.jpg

As a result of many of the landlords not adding enough information to their rental postings, most users using VanPeople have found the overall listing quality to be quite poor and were therefore disincentivized to continue using the platform.

Project goal
Strategize, and formulate a design plan to help Chinese home renters look for homes more effectively and with confidence.

Considering that the platform's majority of users were older and have used VanPeople for a long time so drastically changing the looks and feels of everything all at once was too risky as it might create too much disruption to the current user experience.

group_14249.png
The need for immediate action while having limited manpower prompted us to adopt a design strategy I called Mulitple stage implementation

Due to limited resources, my team faced a significant challenge in executing the revamp project for the home rental section. Moreover, the product we were responsible for had been losing users steadily. To address this, we decided to break down the project into multiple stages, each with its own success metrics. This approach allowed us to introduce improvements quickly and effectively, despite the constraints we faced.

Stage 1
Redesign the property listing flow & property detail page

We hoped that by redesigning the property listing experience, our users would start to create informative listing ads without encountering much resistance and hesitation. 

We will also redesign the property detail page so that it can utilize any additional information being added through the new property listing process by displaying that information in an obvious manner to browsing users.

Stage 1.jpg
Stage 2.jpg
Stage 2
Add in a property filter and the property map search function

Now, once we are able to get people to start inputting more listing data thanks to the completion of stage one, we will then be able to implement a property filter so that users can start to narrow down their options according to personal needs.

In addition, we will also add a browse-by-map feature giving users the ability to narrow down their options further according to more specific locations.

Stage 3
Redesign the property listing page for a more efficient browsing experience

Once users can quickly narrow down their home search results by using the new features we have added in step 2, then the only thing left to do is to improve the property browsing experience so that the users can browse the refined research results with higher efficiency and make the decision on whether to click into a listing with more confidence than before. 

Stage 3.jpg
A new visual design system
Setting a better product foundation with a basic but more coherent design system

The old UI for the VanPeople classified listing seems to have been using multiple design systems at the same time. A user could find different font sizing and usage of color across different sections within the classified listing platform. 

To make matters worse, the platform was also using different styles of design for its web and native app client sides which each looked outdated and poorly designed in their own way. Therefore, I thought it would benefit us a lot if we could base the new design on a relatively basic but more coherent design system that provides guidelines on all future font and color usage.

Typography.jpg
Color.jpg
Property listing flow redesign
Redesign the property listing flow so that it can help users list their properties with detailed information without spending much effort

The goal here is to ensure that users will spend less time completing the listing of a property and also should express more willingness to add more detailed information when using the new flow.

Research & gather design requirements

I began the property listing flow redesign by first determining the sort of information that would be essential for producing a proper listing post with a good amount of detailed information.

I carefully read through the contents of over 100 listings and organized a list of items that were included most frequently by our users in their listing posts. To make sure that the list would match the actual expectations of our users, I took the time to talk to 5 co-workers of mine who have used our rental service actively in the past few months.

All of the items on the list were resorted according to the feedback I gathered during the mini round of user research.

Design requirements v1.jpg
New Interactive elements.jpg

Introduced new interactive elements to help user save time

in order to make sure that the users would spend less time listing their properties, I introduced elements such as checkboxes, dropdown buttons, and auto-complete mechanisms into the design so that our users could avoid typing in the detailed property information by hand.

The one thing to note here is that I specifically used different forms of buttons between muti-option and single-option menus to make sure the design is more visually intuitive.

Version 1 - An improved one-page design basing off of the old design

So, because of the time constraint, I did not spend much time on coming up with various different approaches; instead, I went for a straightforward one-page design which was simply a longer version of what we had before.

However, after running a short validation test with the same 5 co-workers I talked to before, they claimed that this first draft felt a bit too overwhelming; I believe that adding too much information into one long page has cause a problem of information overload.

Mulitipage approach.jpg

Coming up with an alternative multipage approach

After some additional exploration, I thought if the problem was users feeling like they were seeing too much information at once, perhaps I could break them up and get users to see only smaller chunks of the whole process one at a time.

Version 2 / Final version
A 3-step process that allowed users to list their properties 3x faster as average listing completion time went down from 7 mins to just around 2 mins

The above result was obtained after running a short design usability test with my co-workers before the feature was pushed to development. Participants were asked to list a property using both the Old and the New flow on two separate days and the speed of completion plus any feedback given during the process were documented for comparison. 

Page 1 - Basic information

The first page is for users to upload photos, create ad titles, add a rental price plus the items included with the price, and add any necessary text descriptions in the end if needed.

We took out the option for people to leave the rent blank so the listings will no longer have "price is going to be negotiated in person" by default.

Made [upload photo] the first thing that users would see when landing on the page to encourage users to upload more photos when listing their properties.

p1.png

Page 2 - Detailed information

Users can quickly fill in all property details in just a few taps. These details include property type, whether you are renting just a bedroom or the whole place, the date the property is available for rent, #of bedrooms/bathrooms, amenities, tenant limitation, and lastly, pet-related limitation.

Most of the non-skippable fields are located on the top and are easy to see at first glance.

p2.png

Page 3 - Contact menthod

The page for users to fill in the detailed property address, name of contact, contact phone number, your preferred language for communication, contact email address, and WeChat account on this page.

Added the option for users to not disclose their detailed addresses so they can avoid harassment.

Added the option for users to hide their email from the public to avoid solicitation.

p3.png

Animated prototype

Property detail page redesign
Redesign the property detail page so that users can now decide on whether or not to contact the person behind the listing post more quickly

The more specific goal here is to make sure that users can spend less time looking through a property's details before deciding if he/she is gonna call the landlord renting the place out or leave the page to explore more options.

What do our competitors' detail pages look like?

To find out how I could improve the existing design, I gathered inspiration by taking a look at how other major players, such as 51.ca located in Toronto and 58.com located in mainland China, were designing their property detail pages. 

51.jpg
58.jpg

Audit the usability of the Old property detail page

After having to look through the design of other major players in the market, I then compared our old listing detail page to theirs and came up with a list of items we can make improvements on.

Old detail page top.jpg

Photo preview area not big enough

The preview area needs to be enlarged to allow users to browse the listing photos with the need to always tab on the area and view in fullscreen mode.

Displaying landlord contact info within the first scroll was an ineffective usage of visual space

Users can easily tap on the shortcut buttons located at the bottom of the page to directly contact the post maker; the space on top should be repurposed to display other more important information.

General address info was too low on the page

With address being such a key factor in determining the likelihood of taking a rental, it should be moved to a much higher position on the page.

Reading through detail description section to get more information was tiresome

The section would either be extremely wordy or useless if the landlord decides to add little information to their listings; it should be optimized so that users can get a good understanding of the property details by just simply taking a quick glance.

The method used for displaying the listing photo was lazy & not user-friendly

There was no limit on the number of photos to be displayed here; the list of photos can easily get very long and users would have to scroll through 10+ pictures before seeing any contents below.

The location map was often not operational and it took up an unnecessary amount of space

A lot of the users we talked to before told us that they often do not put down detailed addresses so they can avoid potential harassment; with that being the case, a map like this was no longer useful.

Listing recommendation lacked photos, rent prices or any other useful info

Looking at this section as a user is a waste of time.

Contact methods displayed in the contact shortcut was not dynamic

Even if the landlord did not put down an email address, the option to contact the landlord using email is still there and you when click on it you will see an error message; this was really unfriendly.

Old detail page bottom.jpg

The enlarged photo viewing mode's experience was also very unfriendly

There was no close/back button to exit this mode and users had to use the phone navigation to go back to the property detail page.

The page also lacked small photo previews that could allow users to jump from one photo to the next more quickly.

Coming up with the high level information hierarchy for the new detail page

Based on how other major players in the market designed their property detail page, I rearranged the information hierarchy for the various sections we had on our current page while also adding some new sections to address the problems that were discovered during the audit I conducted earlier.

artboard___9.jpg
Redesigned version
A more informative page backed by a modern-looking clean design that allowed users to glance through property information more quickly than before

When we compared the speed of decision-making by asking participants to view the same listing post on the new design vs the old design, we saw that the participants were able to decide on whether to contact the landlord or not in less than 30 seconds when viewing the same property on the newly designed property detail page which was ~73% faster compared to the average time of 52 seconds we got with the old design.

New detail page top.jpg
Making user's first scroll more informative & monetizable

Photo preview area got BIGGER

The section now unitizes much bigger screen real estate to display the property photos in a more visually appealing fashion.

Rent price & property address got moved up

Users can now easily see both rent prices and property addresses at the top of the page. In addition, the design was also refined so that information presentation is more visually intuitive.

A new ad banner spot was added

Over 85% of the people scroll to the detailed description section of the page; we thought we could take the opportunity to capitalize on the traffic/views by adding a new ad banner before the detailed description.

All key info at a quick glance

A new basic rental info section

This section aims to give users a brief but comprehensive description of the property. This section includes information such as property type, type of rental, unit available date, number of bedrooms/bathrooms, and pet-related limitations.

The new amenities and tenant limitation

These two sections aim to give users a comprehensive description of all amenities that come with renting the property and whether there would be any limitation sat by landlords on the type of tenant that is preferred. Note that intuitively designed icons were added to the design so users can understand what the items mean even without reading them.

New detail info area.jpg
A more intuitive enlarged photo-viewing experience

Added a proper close/back button at the top right of the screen and also added a scrollable small photo preview section at the bottom of the screen.

Added a "load more" button so users can view more listing photos when they feel like it

Users are no longer forced to scroll past 10+ photos each time they want to view content located at the bottom of the detail page.

Loadmore.jpg
New detail page buttom.jpg
Making better use of the detail page's bottom half

Listing recommandation is now more informative than before

Each of the listings displayed here now will 100% come with a property photo and a rent price.

Added another ad banner to capitalize on the potential traffic located at the bottom

Because only about 9% of the people scroll all the way to the bottom of the detail page, the ad banner we added here was bigger than the one at the top to remain appealing to advertising customers.

The detail contact info were all moved from the top to the bottom of the page

From the feedback we received during the design process, it was evident that most users were satisfied with just seeing the infomation presented within the contact shortcut.

A new shortcut bar that dynamically presents available contact options appearance based on the different types of contact methods added

Users will no longer get error messages when interacting with this new version.

A better contact shorter.jpg
New design in action
Introducing search result filter
Design a property filter that helps users narrow down rental search results quickly based on personal needs

The more specific goal here is to create a tool that would allow users to spend much less time finding homes that fit their specific needs.

Card sorting.jpg
Research the needs and expectations of our users when it comes to using a property filter 

We conducted a short round of user research on 7 of our Chinese-speaking colleagues who have rented a home during the last 6 months and we documented everything that they claimed mattered to them when it comes to searching for a rental property.

Since we wanted to add a filter function to our platform as soon as possible, we thought that perhaps we should design the first version of this filter to be more straightforward but also tailored to the needs of our Chinese target audience.

Coming up with an essential list of categories to be included for the MVP version of the filter

After conducting a short workshop with other members of my team, we have decided on a short set of categories to be included with our filter.

Essential list of categories.jpg
Filterrequirements.png
Gather inspiration by looking at filter implementation from other companies

Before moving into design ideation, I tried to gather inspiration & insights by looking at rental filter designs used by other major platforms. I later also expanded my research to other nonrental related platforms.

Allfiltercompeteors.jpg

Finalizing the more specific design requirements according to the preference of our users

Before committing to designing, I also generated a list of more specific product design requirements for each of the sections we will be including in our filter by cross-referencing the findings I gathered from the market research with the feedback I got from the user interviews I conducted earlier.

Filterdesignreqirements.jpg
Design ideation resulting in two layout variation

By taking the general design patterns that I have gathered from the inspiration-gathering process and applying the list of design requirements I generated earlier, I have arrived at two variations of design.

Variation #1

Image 812.jpg

Opted for a straightforward layout that gives users a top-down view of all the items they can use to filter the search result.

The problem with this version is that users might be missing out on a lot of useful filter options when the list gets longer in the future; this became more apparent when I started to design for our 2nd hand car buy-sell service later.

Image 813.jpg

Variation #2

Changed the price filter to a slider design so that users can set a general price range more quickly than if they were to type in all the numbers by hand

Used various kinds of button designs such as checkboxes and radio buttons to distinguish the multi-selectable buttons from the ones that users can only select option one at a time.

Was able to implement a side navigation bar since all Chinese character has the same box-like shape. We were able to fit the title of each section in the navigation bar while maintaining a large font size for better readability.

Variation #2 won out in the validation testing round and was selected as the choice for implementation in the end

I ran user testing sessions on 5 of my co-workers and the results obtained indicated that the overall usability of variation #2 was much better than that of variation #1. When the participants were asked to perform a specific set of tasks, the time it took for them to complete the task averaged around 19 sec for V1 while V2 had an average of 14 seconds.

Introducing search by map
Design a tool that helps users look for property rental options effectively based on locations

This entire feature was designed end-to-end by Ginny Wang, the other product designer who was on my team. I worked closely with her as product manager to ensure that the feature was going to provide the best possible user experience for our users in the end.

Mapuserneeds.jpg
Research core user needs when it comes to using a property map-searching tool

Ginny conducted a round of user research and organized a short list of items that represented the core user needs for using such a tool.

Create clarity from ambiguity 
Mapuserneeds chart.jpg
Search by map done by other companies
Searchbymapothercomapny.jpg
Experimenting with different layouts

At first, we decided on having a more traditional layout. A lot of the similar products we came across all have the search bar located on the top and an area of control located on the bottom.

Group 15256.jpg
Group 15257.jpg

However, due to the fact the search function we had at the time was unable to search for listings according to their address, we have decided to make the search function a bit less noticeable before we get the chance to improve it.

Fortunately, after altering the design, most of the people we talked to liked the version where there was a fullscreen presentation of the map. Users mainly liked how the overall design looked cleaner and there was more space to display more listings across the map. The best part was, all the controls were still fairly noticeable to users even though they took up less visual space overall.

Group 15258.jpg
Final high fidelity design
Arrived at a visually appealing, and immersive property browsing experience

After launching the feature in late 2021, the feature is now becoming more popular as each day goes by.

Revamp property listing page
Redesign the property browsing experience so that users can browse for homes and make rental decisions more efficiently

Specifically, we want to help users cut down the amount of time they spend scrolling past properties.

The property browsing experience has already been greatly improved due to the changes implemented in stage 1 and stage 2 of this revamp project

By the time we got to stage 3 of this project, the design solutions created in the previous two stages had all been lived for a few months already. As a result of applying those changes, the overall user experience of the VanPeople rental property section has already been greatly improved.

Old property listing page

Frame 405091.jpg

Improved property listing page

Frame 405090.jpg

Looking at this improved version, we can tell that the listing page was no longer plagued by properties without pictures and rent prices. More notably, the top and bottom sections of the page were also modified to include easy access to the new property filter and browse-by-map features. 

The only thing left to do now is redesign the property card so that users can extra information from them more quickly

Upon taking a closer look at what we had with this new listing page, the most notable problem we came across was that each property card replied too heavily on the user-generated titles to give browsing users information on the listing.

Newold property listing page problems.jpg

Low efficient on information extraction due to ineffective presentation of meaningful contents

Users have to spend more effort reading through each of the lengthy two-line titles carefully before they can extract meaningful information for them to decide whether they should click on the listing or not.

In addition, displaying the listing creation date on the bottom right was another piece of useless information taking up valuable screen real estate; since everything was being displayed chronologically anyway if users just wanted to see the latest rental options they could just refresh the page.

Gather design inspiration by looking at the design adopted by other major home rental platforms

Found that the property card from most platforms contained the following items.

Frame 405092.jpg
Frame 405101.jpg
Introduce a label system to complement the user-generated titles by selectively displaying additional rental information to help users extract more information when glancing through the listings

Thanks to the newly implemented property listing flow, all the listings we had now came with a lot more information than before.

However, considering that both layouts allowed for a very limited amount of horizontal space to display these labels, the items we chose to display here had to be things that are most essential to a user's home rental decision-making process.

By looking through the user feedback we gathered from the interview sessions we conducted before, I created a chart that describes the logic behind how information would be displayed through the label system.

Tagsystemchart.jpg
A grid and a list layout to fit the browsing needs of different people
Row format.jpg
Box format.jpg
Arriving at version #1 after considerable exploration

During design exploration, I have found that using any color on the labels would easily cause the browsing experience to feel cluttered. Therefore, after going through various ways of displaying the labels, I decided to adopt a design that is easier on the eye.

Frame 405127.jpg

When we ran a usability test on version #1, we came to realize that the new version's one-line title was not able to fully display the lengthy titles that our users creating

Most of the tiles that our users were coming up with before were at least two lines tall. However, when we ran the pre-release internal beta test using live data, we saw that most of the titles were not being displayed in full.

Problem new page.jpg

First solution, just give the 2 lines back to all the titles

The first straightforward approach I thought of was just to try and see if giving the two lines of display space back to all the titles would work.

Well, it didn't work. There were two problems with this approach. First, the spacing between all listings would end up being uneven as some listings may have shorter titles taking up just a single line. Secondly, just giving the two lines of display space back does not resolve the problem of most of these titles being unnecessarily long to begin with.

Problem new page v2.5.jpg
New page agt.jpg

Another solution that may be better was to automatically generate shorter format titles for our users

Considering that a lot of other rental platforms all had their own version of auto-generated listing titles, I thought that we could do the same thing. 

Since most of the titles created by our users were saying the same thing as the new property label system recently introduced, the idea I had was to just merge the content of the different labels and display that as the new titles for all of our listings. Ideally speaking, this feature should declutter the browsing experience more while also saving people time listing a new property.

However, when we ran a test on this design with live data later, we encountered a lot of criticism.

Listings became indistinguishable under the second solution, making it harder for users to sort them out as they all appeared similar

When we ran an A/B test on this new version later using live data, while the overall UI seemed a lot cleaner, many people complained that the auto-generated titles took away all visual cues that helped them to tell the listings apart from each other. 

When we ran an internal usability test to investigate the issue, we found that the lack of distinctive titles forced users to click into more posts because they were no longer able to make informed decisions just by looking at the property cards on the listing page.

New page agt problem.jpg
The easiest way to encourage users to write shorter and more precise titles was to reduce the allowed word count by half

So after having interviewed 7 users who have posted a property for rental recently, I came to realize that the best solution is actually simple; all I had to do was just reduce the word count limit for the title by half, and our users would automatically find more creative ways themselves to write unique looking titles that are shorter and more precise.

Shorter title = good.jpg
Final version for release
A property listing page that allowed users to make home rental decisions faster than before

As a result of having a lower word count limit, users were encouraged to write titles with more targeted and meaningful content. 

Before solution.jpg
Final solution.png

Received various positive feedback directly from our user after release

Although we were not able to gather numerical evidence to suggest any significant improvement in decision-making speed, we did receive positive feedback from many of our users after the newly designed property listing page was launched. They reported that browsing for properties with the new design was much easier and required less effort compared to before.

Userfeedback.jpg
Better monetization
Find more ways to better capitalize on the traffic of VanPeople's mobile home rental section while also adding diversification to the source of revenue

Specifically, the object here was to add different types of ad banners to the property listing page while also introducing new ways to capture potential revenues from non-advertising clients.

Approach #1 - Add an entire ad section to the top of the listing page to display sponsored ads from business clients

Since the majority of our revenue came from sponsored business ads, the more straightforward solution that the sales team and I arrived at was to add a dedicated advertisement section to the top of the property listing page.

Later, the sales team suggested that sponsored ads should be displayed in between the property feed. As a result, a new card design was introduced to showcase these ads in a slideshow format.

Ad section solution.jpg

The sponsored ad section at the top included a big banner ad followed by a section below dedicated to displaying a maximum of 4 sponsored VanPeople yellow-page business ads.

Ad section solution add banner.jpg

After clicking on "learn more", the slide-up card will explain to potential customers that their ads are going to appear once at the top of the page and a couple more times within the property feed below.

Approach #2 - Add a new feature called "ad exposure acceleration" allowing nonbusiness users to buy more property listing exposure with a small fee

Since the completion of stage 2 of this project, I have been managing a customer service WeChat account all by myself to better collect customer feedback. On average, I receive at least one inquiry per day from users asking if they can pay for additional exposure for their rental property listings.

In response to our users' requests, I have decided to introduce a new service that allows them to display their rental ads multiple times across the listing feed, resulting in increased visibility. This service is designed to be more affordable than the business ads, and as such, the new ads that receive accelerated exposure will be displayed right after the business ads at the top of the page.

exposure acceleration.jpg

A checker has been implemented to ensure that all paid advertisements rotate evenly whenever a feed-embedded sponsored property advertisement slot is loaded for a browsing user.

"Hey, here is our friendly tip on how you can get quicker results by paying a small fee"

The main challenge I faced was to promote our new service effectively to our users without annoying them. After careful consideration, I realized that the best time to promote this service would be right after someone has completed the listing of a rental property. My aim was to present this new exposure acceleration service as a friendly quick tip that could help improve the effectiveness of their rental ads by paying a small fee.

The whole payment process was also designed so that users could potentially complete payment in as little as two steps.

Frame 405159.jpg

After conducting in-depth conversations with some of our users, I have devised three design criteria that will help us effectively sell our new accelerated exposure service to the right target audience. Below is how I have translated the design criteria into design.

User should have control over how often they see the promotion material

In order to reach all potential customers, we planned to display a service introduction slide-up card to every user who completes listing a property for rent, at least once. However, we understood that interrupting the user experience in this way would not be ideal. As a result, I added an option for users to opt-out of seeing this promotional ad for 7 days.

I designed the card in a way that users are unable to close it until they decide between paying for the services or turning them down. This ensures that users must make a conscious decision before proceeding to the completion screen. It's worth noting that by this point, the property would have already been listed, regardless of whether the user closes the window or not.

User should have control over how often they see the promotion material.png
The material presented should be short and easy to digest..png

The material presented should be short and easy to digest

It can be frustrating for users to have to scroll down a lengthy page to learn about a new service and its benefits. To address this, I utilized a design approach that incorporates concise explanation text and simple illustrations presented side-by-side. This combination helps to enhance the user experience and make the information more easily digestible.

The pricing should have high transparency so people know exactly what are they paying for

I aim to remove user's fear of any hidden fees by providing a clear breakdown of the amount of money they will be paying for. 

I initially considered merging the service selection and payment selection pages to make the payment process shorter. However, many of our users are not tech-savvy, so I thought it would be more reassuring to display the full payment information and remind them of the service they are paying for at the same time. It's important to ensure that users are aware of the additional 3% service fee and taxes that may be included in their selected payment method before they make a payment commitment.

The entire process should have low ambiguity so people know exactly what are they paying f
clear follow up instruction.png

Provide clear follow-up instructions on how long this service will last and how a user can renew it if needed

The post-purchase experience is also fairly important as it will help the platform

Payment flow interaction prototype

Impact measured after 9 months
A massive increase in the overall monthly visitor count, the number of rental listings posted per day, and the monthly revenue generated
Project Result
50% increase
In the total amount of people visiting VanPeople's home rental search on mobile devices

The number of unique monthly visits to VanPeople's mobile website and native app increased from around 60,000 to around 90,000 indicating that more users were using VanPeople to post or search for rental properties on mobile devices.

30% increase
In the number of properties posted on the platform each day

The average number of properties being listed on VanPeople home rental each day increased from around 110 to ~140 and almost all of the properties listed after the project's completion included photos and detailed property descriptions indicating that the property listing flow redesign was a huge success.

80% increase
In the total amount of monthly revenue generated by home rental section

The result of introducing new monetization methods was measured in the form of total monthly revenue generated by the home rental section across all platforms since the changes implemented were all cross-platform as well (desktop, mobile web + native app). The number was increased from ~8,000 CAD to ~14,000 CAD. 

400% growth
In the incoming from users instead of business compared to before

The project successfully transformed VanPeople's business model from solely targeting businesses to targeting platform users as well. The income generated from selling ad exposure acceleration services to users of home rental section went from only around 500 CAD/month to 2,000 CAD/month after 3 quarters. The best part about this new income source was that it was free from commission cuts since it would not involve anyone from sales. The amount we earned from selling this service to users of the entire classified listing platform was estimated to be ~15,000 CAD/month.

Project display.jpg
Next project to view

Revamped a real estate messaging system resulting in a much higher user engagement rate while preventing huge potential losses

bottom of page