Interacting with design

What is a prototype for?

Several weeks after working on the Testing programme I noticed that all the designers from consultancies were only trained to use Sketch.

There design approach had one purpose in mind:

draw up some ideas quickly, get them signed off quickly, and code the solutions quickly.

This was efficient as a process could get, until the team needed to start testing designs every week – i.e. to put some brakes in place to check solutions worked for users before national release.

We conducted a few rounds of usability testing using these Sketch prototypes; it works o.k. for some projects as you can make the prototype clickable,

Sketch prototypes are not ideal for regular usability testing because:

  • you can’t see what a design looks like on different devices (e.g. a mobile view),
  • users cannot interact with form elements,
  • form errors / validation don’t work,
  • users are exposed to button prompts every time they click the incorrect button, leading them to the answer each time,
  • users may see comments from designers,

These factors make for a very sketchy usability testing session, where the participant is unable to experience the service as they would if they were at home on their own. It gives the research and design team less confidence in the research findings.

For live-like usability testing I would much prefer to give the participant a link to the prototype that will work on any device they are using, at any resolution, with any additional software tools they have installed.

I made the case to the consultancy designers that they needed to create these prototypes in html, using the prototype kit; however as they had not done this before as most hadn’t worked as interaction designers on X-gov projects.

If you know what good looks like – don’t stand still – move things forward

Honestly, after working with NHS designers for 4 years I was really frustrated at the unavailability of an html prototype. I decided to take two days out of my role as a researcher to build the first end-to-end journey using the prototype kit. We tested with this version for two weeks, while NHS Digital quickly redeployed other interaction designers from their national programmes to continue the design work and train consultancy staff in best practices for html prototype design.

In the end, the outcome was positive and the researchers have had good quality prototypes to work going forward; although at the time it was slightly awkward to need to step over an imaginary UR/UX/UI “role boundary” to help speed up an inevitable change.

Obviously it caused some challenges and debate within the team at the time, but from that point on many benefits of being able to design with version controls, test on any device, conduct unmoderated testing; these have hopefully far outweighed any initial discomfort within the team.

Map of the Testing world

Another new concept I introduced within the team was the end-to-end interaction design service flow. From the prototype I created, I took screenshots of every page and link these all up as a flow in Miro (Yes, it took a while).

[image goes here]

The primary reason at the time was to help capture notes from multiple user research sessions in the same place, so that we could identify which screens were most problematic by ‘virtually affinity sorting’ the findings.

This approach was then adopted by the service designers and interaction designers, who continued to maintain up to date maps of the current, the past and the future design iterations week on week.

The resource has been great for user researchers, designers, product, clinical and governance colleagues, but more generally anyone who recently joins the team they can instantly view what the end-to-end service looks like all in one place.