HomeConnect – Property rental platform
Front End Responsive design
HomeConnect approached us at the beginning of 2019 to redesign their website. Competition in this industry is fierced in Bangkok. In order to stand out and reach a wider audience (mostly Thais), they seeked external design consultancy to take their website to the next level by creating a more unique and targeted user experience.
One of HomeConnect’s unique services is their premier services which comes completely free. They offer free chauffeur car service to all tenants who wish to visit one of their property. This service is really appealing to expat audience who just arrived to Bangkok and are not yet familiar with this large city.
What we did
For this project we redesigned the HomeConnect from scratch. We spent the first half of the project to research and redesign a new and improved structure, experience and flow while creating a modern and professional design style and layout (all branding was done by www.mandalastudio.asia). The end result is not only beautiful but also functional and unique in the Thai market.
Everything looks great. Very happy with the direction of the outcome – Michael Reinsch, CEO at HomeConnect and BangkokCondoFinder
Before starting the design, the team took time to understand the business and users by interviewing main stakeholders. Currently, website is mostly targeted to Expats in Bangkok with a small minority of Thais, middle to upper class, each audience with very different goals which we had to account for in our designs.
We also analyzed some of the main competitors in Bangkok to set a benchmark for this project. Most Thai websites have very standard designs and with pretty bad user experience on average. To find design inspiration for modern layouts and experience, we had to look beyond Thailand.
Once we gathered enough information about the business, we studied a few different concepts and layouts and reviewed early on with the client to see which direction was best for them. At the end, we decided to create a really simple search flow to help users find their perfect home in just a few clicks.
All search results are then displayed in a left sidebar along with a map. Users never leave this map view while browsing through different condos. Map is totally dynamic and information displayed on the map changes based on what is selected in the left sidebar. This allows users to quickly browse through different condos quickly and efficiently with an option to check location on the map and get all relevant information pertinent to this condo.
The reason why we chose this solution is because location is really important to users. Traffic is really bad in Bangkok and users do not want to travel for long period of times.
Before designing high fidelity concepts, we convinced our client to do a complete rebranding of their logo. For this job, we brought our partner MandalaStudio to this project. They helped design a brand new logo and set clear brand guidelines for this project. Once we received the CI documents, we started designing a few different design concepts for the client. Concept on the right below is the final artwork designed by our team and on the left is their previous design.
For this design, we made sure to understand user needs and behaviors in oder to decide what information to display on the search results. Our research showed that users primarily look for location, number of bedrooms, size, price and last they want to know if it is close from a subway (MRT) or sky train (BTS) station because of the traffic in Bangkok.
Because expats are less sensitive about price we decided to put more emphasis on the location. This is one of the reasons why we decided to make the map really central in our designs. To complement the map, we also created categories and filters for some of the main districts in Bangkok to help facilitate their search.
For Thai users, trust is a big factor. They care more about the constructor & brand reputation rather than location. To respond to this need, we gave users an option to search by brand. This takes them through a flow that allows them to select a specific condominium building and then access search results for that building only.
Map & Filters
Maps and filters take a really central place in our designs as discussed above. We spent a considerable amount of time refining them in our designs. Too many options can be paralyzing for users. To simplify the experience, we reduced the amount of filters to only the top 5 filters on the search results page: home type, price, size, number of beds and “near train”.
Search results along with different map zooms and filters.
Design of filters for the search form pages
Another web persona for this website are property owners. HomeConnect let anyone register on their platform to allow them to list their condos or home on their website. This allows them to give users access to a large database of condos in Bangkok. Each condo submitted need to reviewed by a HomeConnect agent before being approved and listed on their website. They also offer professional photography service for free to all property owners. This allows HomeConnect to display quality images on their platform.
While designing the desktop version, we also developed the mobile version. Below are just some of the main mobile screens we designed for this project.
On Completion of the project, we created a complete styleguide to help assist the developers in their task. This included different specs about colors used in this project, fonts, form, icons, buttons, etc. Below is a small sample of our style guide.