Client
Huttons Group – Property Agency
Role
Creative Lead + Designer
Context
Website Redesign – Merge different Sites
Scope of Work
Information Architecture
Mapping
Prototyping
UX UI Design
The Brief
Huttons Group is a leading property real estate agency in Singapore, and they approached us to redesign their website with modern and functional design that incorporated multiple uses in helping their agents and clients reach information easily.
Their 4 different existing portals – huttons group, huttons resale, huttons agents and huttons each served different functions. Our role was to merge these sites into a cohesive website.
The new huttons was a dynamic and interconnected website that had two sections – an external main site and a microsite for individual agents to showcase their work and most content was populated through APIs.
/ The Challenge
The user experience design had to connect the sprawling sitemap and information and a large variety of functions in a seamless manner, so that users could:
- search properties of various types
- message agents
- look up their reviews
- calculate their taxes
- read up current news and blogs
- visit agent microsites -linked to specific properties, reviews, view property maps,
- View new launch properties
/ Existing Old Design
Based on our user research and stakeholder interviews – the current site was dated in terms of User Experience as well as design. A lot of functions where needless long winded, and main items looked for by users where hidden behind many interactions – like filtering for specific things they wanted in a new property.
/ Documentation and Information Architecture
Increased Complexity
The filtering functions of the hutton website was also complex in that – there were three models – buy, rent, new launch within which there were groups of properties such as HDB, Condo, Warehouses, Offices etc…
Each property type had different filters, e.g HDB Buying had a built year filter, incase people did not want to buy a HDB flat older than a specific year. However for HDB rent such a filter was not necessary. Similarly, for Condos there was a filter on maintenance fee amounts – which was not present for HDBs. There were many more examples of each set of properties with its unique filters.
/ Wireframes
Wireframes were tested with team members and stakeholders to ensure the design was usable and useful. Many different layouts were explored for high usage pages, like the property pages.
Once such example:
Ultimately, a horizontal sticky filter was chosen, as all options could be seen within a single window view when user scrolled down the list of properties. A vertical side bar menu, though decreased the length of the page, it required users to scroll back on forth to change or check on filters they set, hence was a more tedious experience.
Hence we chose the horizontal filter bar. I wanted to still compress the page down with less visual clutter, hence the possibility of hiding away the advanced filters helped us to make the design of the page more easy to use while also being accessible.
/ The Design
We opted for a refreshed design in the same brand colours, with an increase in graphical elements to better aid users. The shapes and warm colours help to convey the idea of home – which is the main aim of the hutton group as well as most users who are looking for a property while keeping to an uncluttered aesthetic to help information transfer.
