Rapid prototyping to explore ways to onboard customers

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.

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.

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.

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