Client
Sage
Sector
Technology and software
Financial services
Duration
8 weeks
What we did
User experience design
Product innovation
Design Engineering
Sage cover

Sage is one of the UK’s largest software companies, with a range of solutions helping businesses of all shapes and sizes manage their finances and operations.

Sage wanted to increase subscriptions from new business owners to their cloud-based accounting software for small businesses. This is a crowded and competitive sector. Although their SaaS product (Software as a Service) is rich in features and backed by expert support, the value is more evident through extended use rather than initial impressions.

Sage needed to find a way to introduce users to the standout features in the software and for them to quickly see how it will benefit their business. Users are reluctant to spend time entering their business data and reading instructions for a product they are trialling. There was a need for a new approach. We called it longboarding: the incremental and ongoing discovery of product features and benefits from first encounter through to adoption and beyond.

Our whole team commented on how much they enjoyed working with Clearleft. They struck a great balance of addressing the starting hypotheses and challenging some of our assumptions along the way, and a number of their concepts are already making their way onto roadmaps for the coming year.
Adam Perfect
Adam Perfect Experience Design Manager

The Results

Five new features added to the product roadmap

Gaining confidence in the concepts from user research sessions

The Sage UX team coached in new techniques for innovation

Growing the skills needed to continue exploring potential futures

A demonstration of the benefits of prototyping rapidly, in code

An accurate articulation of the product that calculates and displays the impact of any input

The Full Story

How do you spot opportunities to improve an established product?

All digital products, however well established, need to adapt to changes in customer needs and expectations to stay competitive. To help clients uncover and explore potential future ideas we have a format we call an accelerator project.

Accelerator projects typically last six to eight weeks. This provides just enough time and space to supercharge a design team to get deeply immersed into a tricky problem and create and test novel solutions to it.

From the outset we knew the benefits of forming a single project team with digital practitioners from Clearleft and Sage. The mix of internal product knowledge and fresh eyes combined with the blend of skills from business strategy, content design, visual design, research, and design engineering gave the team a wide range of perspectives.

As a single team we started by getting to grips with the problem at hand and identifying potential opportunities. We spent the first few days of the project collecting insights and available data, carrying out a combined expert product walkthrough and reviewing contemporary techniques for onboarding customers.

How can you generate many ideas and know which to pursue?

Exploring new ideas is best done at speed and at low fidelity. Early on, the quantity of ideas trumps the quality of drawing. The whole team was involved in a series of remote collaborative co-design sessions. In these we’d identify a customer goal or focus on a discrete part of a task and sketch out many ideas.

A montage of sketches.

The sessions followed a rapid design cycle. Sketching was timeboxed. Then we’d take photos of our drawings and upload these to an online whiteboard. The sketches were reviewed and critiqued by the team. The most interesting or intriguing ideas were developed in more detail in subsequent rounds of sketching.

Within a few days we had a virtual wall of sketched-out and annotated ideas. Collectively we grouped the emerging concepts and highlighted the ones we felt were most compelling and offered the biggest competitive advantage to take forward to a stakeholder review.

We played back the longlist of concepts to our stakeholders, enabling them to interrogate the ideas and prioritise our upcoming design efforts. In the playback session we showed rough sketches and talked through each of the strongest concepts. With questions and insights from business strategists, system architects and the Sage research team we had the benefit of a wide range of expert opinions to direct our next steps. Getting this early input gave us focus and momentum.

Sage features

How can you quickly and confidently test new ideas?

With any prototype it’s important to find the right fidelity to best test your ideas. In this case we knew we wanted to allow participants in usability testing to be able to add their own data and to see the interface respond. To do this we needed a coded prototype that could calculate and display the impact of any input.

Although we needed the skills of a design engineer the creation of the prototype was another example of a combined team effort. As React components from Sage’s design system were being augmented with new code, design elements in Figma and updated copy were created and rolled into the prototype. With regular team reviews and a browser-based prototype to refer to, each member of the delivery team could check on progress and suggest improvements.

A good prototype will feel like the final product, allowing the participant to test the features, not the limitations of our tooling. By creating a responsive and reactive HTML prototype for Sage, we were able to let users navigate the experience in a natural way, adding their own information in their own time, rather than leading them down a set path that mockup-based prototypes force you into.
Trys Mudford
Trys Mudford Design Engineer
Sage prototype

The main purpose for the prototype was to have an artefact for Sage’s research team to test with users. Booking the sessions early gave us a hard deadline to work towards and helped prioritise our efforts.

The benefits of having a coded prototype for this project included:

  • having a realistic experience that worked responsively on a user’s computer;
  • the speed of making and deploying amendments between testing sessions,
  • and with a click on a link, changing the product from an empty first-time use state, to one populated with indicative data.

How do you move from design ideas to delivering value?

Sustaining momentum is a big challenge for innovation projects. The results of usability testing sessions and feedback from stakeholders gave us the confidence to develop the new concepts, yet it can be a long road from an initial prototype to production-ready code.

Having a prototype that is easily shared around the business provides a tangible articulation of new ideas and how they will add a competitive advantage. Working alongside an in-house team means there are internal champions who’ve been integral to the creation of the features and who can continue developing them.

Closing notes

Making time and space to uncover and explore new ideas is imperative to maintain and grow a digital product. An accelerator project is a perfect catalyst to supercharge a project team to think differently and to bravely explore potential futures

More work