The great SaaS UI design dilemma: Customisation vs consistency

October 3, 2024

Over the years, SaaS and B2B software has shifted towards cleaner, simpler designs, sacrificing unique visual identities for a more generic look. While this homogenisation can improve usability by creating uniformity across platforms, it makes it difficult for organisations to showcase their brand or personality through their software. The challenge doesn’t end there, in addition to the platform’s own brand, customers (those procuring the software to use in their organisation) often want to customise interfaces with their own brand too. This can be tricky for designers, who then have to design a platform with a cohesive brand identity while simultaneously incorporating a customer’s brand. The visual design needs to reflect the product’s unique brand personality and values, creating a consistent experience across all touchpoints while, at the same time, allowing for customisable UI components - such as adaptable layouts, personalised themes, and customer logos.

There is a spectrum of approaches to address this challenge. Many choose not to allow any customisation of the interface at all. Take Google, it is not possible to customise the UI of their Google Docs platform but it is possible for the user to add custom themes to their Gmail platform. Docs provides a consistent experience for all users, whereas Gmail's experience can vary from person to person. While this is a smart approach for someone as large as Google, it can be trickier for smaller SaaS products whose customers require elements of custom branding as part of their purchasing decision.

Finding that delicate balance between customisation and consistency is crucial to the success of a product.

Maintaining branded, customisable UIs can be a complex process, requiring careful planning and execution. While providing flexibility and personalisation can enhance user satisfaction, it also demands a scalable design approach that doesn’t dilute the brand’s consistency. 

Designing a customisable UI

We have experienced this challenge first hand in our work on brand intelligence platform, Enlyta Insights. Enlyta can be personalised by each client by displaying their respective branding in the UI, including logos, brand colours and even fonts. We recently embarked on a re-design of the platform’s homepage along with a fresh look at the overall design system. We took this opportunity to examine whether the flexibility of incorporating client branding was being deployed in the most optimal way. 

We found that the client’s brand colours were being overused throughout the design compared to competitor products and the wider industry - there was an opportunity to be more selective with the colour usage, meaning it could be more effectively used as part of the page’s visual hierarchy. There was also an opportunity to create a more contemporary design that reflected new and upcoming UI trends, to further position Enlyta’s website design against their competitors.

Strategic use of brand colour

Using the client's brand colour within the Enlyta interface presented some complications. Some clients had colours that didn’t translate well across various design patterns, such as instances where a light colour like yellow or white was supplied as their brand colour. This created accessibility issues - the primary call to action used the brand colour as a background, so when the brand colour was yellow, the white text on top of it couldn’t be easily read. To address this, we reduced the usage of the primary brand colour within core interface elements to minimise accessibility issues and instead we introduced a range of tints of the primary brand colour at lower opacities, offering more variety and subtle ways to incorporate the brand’s identity without overpowering the design. This ensures that when the brand colour is used at full opacity, it has a higher visual impact and draws the user’s attention.

Embracing the grey area 

When thinking about the other colours with the interface, it’s key to avoid any that might clash with client brand colours. So as part of our work on the design system we also expanded the colour palette, introducing more neutral shades. These neutral tones, a variety of greys, provide flexibility, allowing us to safely apply design patterns across different clients without the risk of clashing with their unique colours. This is common practice when looking across the landscape of SaaS UI. Many products avoid using bright or distinctive colours in their interface and it is why when compared side by side, many of the UI’s can begin to look similar. 

Utilising flexible layouts

In addition to allowing Enlyta clients to customise the platform with their brand, they also have a lot of freedom when it comes to the layout and features of the platform. On the homepage clients can re-order the key components to suit their needs. They can also opt out of key platform features if needed. This is typically something we would try to avoid with website designs, but with a platform such as this it is important to allow people to customise the interface to suit their own needs. This leads to another design challenge as pages need to work in many configurations and with different amounts of content. 

Utilising a componentised approach to the UI is essential. By creating flexible layouts composed of interchangeable blocks, we ensure that the pages can be put together in different ways and still function properly.  

The importance of testing

If there is one thing that is essential for designing highly customisable interfaces, it’s testing thoroughly. As we developed new UI patterns for Enlyta, we rigorously tested them across various clients to ensure our design choices blended seamlessly with each brand's individual aesthetic. It’s important to test all of the edge cases - for example, brand colours which might cause accessibility issues, simulating scenarios where clients are new to the platform, or clients who have pushed the boundaries of what we expected. Only by testing across the spectrum of possibilities can we ensure the design changes will work effectively for all clients.

Finding the balance

Personalisation is a powerful tool for appealing to the B2B market. By providing tailored branded experiences, customers can feel more comfortable introducing a new product in their business ecosystem and end users feel an immediate sense of trust. But those benefits can come at the cost of increased overhead for the design and development teams. It's important to have designers and engineers familiar with the challenges of client customisation and to have a robust and up to date design system. If you are dealing with similar challenges within your SaaS or B2B product and you need help with strategies to implement and maintain a customisable user interface, get in touch. We would love to chat about how we can help.

No items found.
Next Up:

More insights:

Get in touch with the team to discuss your idea, project or business.

workshop session for a service design project
service design workshop with Furthermore teamLarge Furthermore logo in white