Case study
From internal tool to commercial product
Project overview
Team
Timeline
Impact
The improved design allowed the business to win and retain customers.
What I did
Making the case for design!
I was asked to restructure and redesign the entire SaaS platform.
The legacy product had been designed internally by the engineering team with little consideration for usability, and therefore lacked commercial viability and could not be opened up for self-serve customer use.
I redesigned the product to ensure usability - and the business is now acquiring new external customers who are autonomously managing their own accounts.
About Guru Systems
Guru Systems is an established London based B2B SaaS startup working in the heat networks and low emissions energy space.
Their customers are housing associations and property maintenance teams setting up, remote controlling, and optimising heating devices, analysing meter readings, and calculating energy bills.
They have thirty employees and a five person senior leadership.
I came onboard late-2022 as a contract product designer.
Pre project
Onboarding and diagnosis
A clear brief from the C-suite
The chief product officer demoed the legacy platform and requested that I research and redesign the entire product from the ground up.
The main reasons were
The copy was heavy with inaccessible technical jargon
The page hierarchy and navigation were disorganised
Interfaces were inconsistent without a design system
The brand guidelines were not faithfully adhered to
I planned a project covering stakeholder buy-in, research, design, information architecture, and the creation of a design system.
I planned a project covering stakeholder buy-in, research, design, information architecture, and the creation of a design system.
Part one
Stakeholder buy-in
Design principles workshop
I brought stakeholders together to have their say on design.
I ran a session where each stakeholder described the design related strengths behind their favourite digital products. Acknowledging preferences early in the project helped me earn trust before beginning any actual design work.
I referenced the design principles later in the project when presenting design work
Part two
Research and UX design
Internal discovery and SaaS services redesign
I interviewed the product managers for each SaaS service.
We discussed the product history, its users, use cases, current pain points, technical constraints, and ideas for improvement. Internal research had to suffice as the business did not wish to consult externally.
New SaaS service
I was permitted to consult with external users while designing a new service which allowed property maintenance teams to remote control resident boilers and monitor heating performance.
It was noted that the dashboard would reduce time spent onsite and allow users to focus on more valuable tasks.
Part three
User interface design
UI design
I created a new, bolder, and more on brand UI design language.
I incorporated the top voted design principle 'clean look and feel' into every element.
I focussed on usability, clear signposting and navigation, visual hierarchy, and simple language.
A data table with intuitive search, sorting, and filtering functionality and bulk action buttons
A single dwelling heating controls and boiler performance data visualisation dashboard
High level project tracker kanban board with details, data vis, comments, and tasks sidebar
Part four
Figma design system
Design system
I built a design system to store styles, components, and documentation.
I made sure that the styles reflected the brand guidelines, the components were scalable and reusable, and the documentation was clear and accessible. The front end developer collaborated with me to build out the key components.
Documented styles including colour, gradients, drop shadows, border radius, and typography
A popup modal component with multiple size variants and optional inner elements
A button component with various states, styles, sizes, and hand-crafted vector icons
Part five
Sign-off and handover
Final stages
I spent the last week handing everything over.
During this stage in the project I
Project retro
What was achieved?
Problems solved
Technical language made clear and accessible
Order restored to the navigation and IA
Consistent user interfaces with a design system
A bolder and more on-brand design style
Project takeaways
Earn stakeholder trust early
In previous projects I have experienced friction when creating new design languages. Acknowledging stakeholders' design related preferences prior to design work in this project helped to build a sense of trust and reassurance toward me from the business and helped to streamline and de-stress the overall process.
Push for external research
The business was reluctant to consult with customers during the redesign. I had to weigh up how and when to push for user centred design practices, but I did manage to have the business agree to external user research with the heating control dashboard. This feature went onto become one of the strongest and most used in the product.
Next case study
