Comparis.ch
Various UX/UI
In this page you'll find a mixed selection of design innovation and a
UX project (second case study with full explanation of processes) that I created for Comparis.
As a brief introduction, Comparis.ch is the leading comparing platform in Switzerland, with various product areas, from Health insurance to broadband. It also has a marketplaces platform for selling/buying cars and property, I ended up leading the marketplaces design after these projects (car platform showcase).
​
Comparis aims at being 100% user-centric, and of course one of the challenges is long-term user-centricity vs short-term corporate profit. Nonetheless all Product design is heavily researched, design thinking and innovation follows a double diamond approach and has strong market analysis always present.
The setup
​
I joined a very ambitious team with a lot of talent and challenges to overcome. The website was still the market-leader in many areas, but the dated look and feel, together with some old-fashioned view on user needs in some areas needed to be tackled and that's where my team came in. The topic of innovation had to become a priority, and I'll show you some of the efforts done in this field.
​
​
The navigation
​
Let's start with one of the key triggers, the header (image above), that had problems of accessibility (colour contrast for instance) and an outdated grouping of information. This was the perfect set upt to kick-off these discussions of colour, processes and dated-website feel. The team started by doing some user research on how to cluster the topics (with exercises like card-sorting), due to the vast number of products in this website the mega-menu approach was the preferred choice. I was the lead designer in charge of finalising all the visual aspects of this project as I joined the company, you can see some results above. The more minimalistic approach of colours, information and data started being challenged already. User testing was present all the way, including A/B testing on release, analysing data on the most clicked elements and iteratively making sure that from a business perspective we did not lose traffic. (more information available on request, due to length of this page and company privacy I need to keep it short and sweet).
The Colour scheme
​
With the navigation task, we managed to tackle a few pain points of the users, such as difficulty to access certain topics. With this new brand structure we could think of re-starting the on-site 'search' or improve our SEO (main traffic driver of the website). From a visual perspective, this change continued the plan to reduce the usage of the 'mamba' green due to it's accessibility issues, and from there try to rebuild a stronger branding strategy.
​
We had collaborations from various agencies such as Dept and KLAR. who worked on the umbrella brands of Comparis. With their help I managed to start a more sustainable colour scheme, with stronger contrast between the light and dark green to finally go into a more modern approach to the website. After all logos were consistent (pic above), we were finally in a position where we could make it transparent for the user that we are a group of companies, transferring brand trustworthiness and opening a clear path for a brand refresh across the board (more info below on this process).
Brand strategy
​
After adding consistency to the colours, making the website logically organised and uniform across all products and making the company logos all under the same visual space, we were ready to start building a strategy for the Comparis brand from the ground up.
​
The first challenge was to get everyone on board, so we started by doing an adaption of the 3h brand-sprint from google ventures. In this workshop that we facilitated, we included representatives from the brand council, Extended board of directors and a more sales driven person, to try and get a nice overview from different departments. Some of the most interesting elements strategically were the personality ranges and competitive landscape, where we could really start seeing where we were and where we wanted to be (some elements of the image above were blurred or removed for privacy reasons). On the image above you can also see an analysis of the future landscape in terms of brand and colour trends.
Testing and Iterating
​
I conducted user tests, these aimed at reducing the number of assumptions. Be it a company assumption such as on how the green colour is so important for brand recognition, but also to test if the internal values match the way the brand was perceived externally. The image above shows an example of one of the questions asked.
​
As part of the problem framing phase, these tests were created to fully understand how much we could open up, how far can the discovery go, what is real, what should stay the same.
​
Below you can see some explorations, as all the examples on page, these are just a representation of how the process went, the colours and logos are not the final ones.
Basically a wide research was conducted, from tick marks to colour palettes. Keeping in mind the modernity, innovation and brand legacy (green colour).
The possible outcome (for now)
​
This project is still on the internal side, with the 'getting everyone' on board phase still taking place. The need for innovation is great, and the idea was that we kick-started this project internally to spark change and inspiration to move it forward. if this will end up looking similar to this version, or continue more on an agency side and change quite drastically, are all still valid possibilities.
​
Some user research and internal research was already done, the first impression is extremely positive and we believe the objectives were all reached successfully.
​
There are still many barriers to innovation, but this is just another step forward in the long journey that is creating the right structure to allow for change.
​
As a final innovation topic in this project, also because innovation is not only branding but should be technological as well, I've included an image, of a complete different direction of the website, with ChatGPT integration, or other AI language modules, to help the user find what they are looking for in a conversational matter and a smarter way of using the conventional search field.
​
As explained previously, and I'm sorry to repeat myself, but the images are not final, and the mockups are only a representation of a possible solution (image below, also at the top of this page).
We move on to a more UX-focused process to give an idea of the type of work that could be conducted on a daily basis.
'How might we' and more detailed problem-solving solutons are not disclosed here to keep privacy over the design thinking process that belongs to Comparis.
The problem
the results page was very unsatisfying for some users, the funnel was long and most interviewed users would not take much away from the results, for instance, they wouldn't understand how the price range was calculated and what it meant. This results page (image above) is part of the funnel for the home 'valuation', to find out how much a property is worth. This is done via an algorithm that puts together the amenities of the house, location, sqm, etc. and gives a range estimate of how much that house can be sold for according to the Swiss property market.
​​
​
The first challenge
​
to figure out who was using this page. We found out that there was a bit of a mismatch between people using it, and people we wanted to use it, which in this case are the home owners in a more advanced part of their journey to sell (as these are definitely the users with more potential for conversion and cross selling). With this in mind, when optimising the funnel, we decided to have a dropdown that would ask the users in what stage they are in. We have a few main categories that helps us separate the users: 'Just looking', 'I'm looking to sell', 'I'm looking to buy', etc. For instance, for a user looking to sell it makes a lot of sense to suggest an agent to do a free valuation insitu, whilst for someone looking to buy it might make more sense to redirect them to property listings.
Other challenges
​
After figuring out how to have results pages that better cater to each user, we still had the issue of complexity in the results page, as we have 4 main types of property: House, Apartment, Multi-family house and Land. Land can be a big problem, as it's almost impossible to find out an accurate estimate, most of these users will not get a result, so another challenge was to create a results page that gives the user the possibility of still getting something out of it. A question tree with all possibilities and outcomes was created to clearly map what can happen where and how to better solve the issues.
Besides the Land area, we've improved the results page visually as well, with a graph that clearly shows the price range, alongside an info icon that clearly explains how this value gets calculated and that in the end it's still an estimate (as it proved to be one of the pain points of some interviewed users), but we can provide a free agent to come and evaluate the price in person. We also added cross-selling elements for our estate agents, and for instance an informative, yet conversion driven element, that would show the user how many people are looking for property in that region.
​​
​
Results
​
Besides Google analytics to evaluate the user journey (dropouts, time spent on final page, etc), we also used Usabilla to ask the users, in a non-intrusive way (side element that only pops in to a percetange of users after 10 seconds), if the results page was catering for their needs and what we could improve. Results were extremely positive and we succeeded in solving our main problem of user frustration and bringing this page to a competitive place. This page was released in an iterative way, starting with a simple MVP (minimum viable product), and slowly releasing a more functionalities, from cross-selling to better UI.
Related to this topic of property market, I also helped pages like a map of Switzerland with colours to define prices for certain areas to better inform our users on price developments and trends, overview here. Not all pages are based on conversion, for instance here, one of the main focus is the informative value and possibility of being a market leader creating more user retention and convert at different stages of the property buying / selling processes.