Superdrug HHT App

Superdrug Hand Held Terminal (HHT) is a hand held device used by Superdrug store staff. It allows store staff to carry out their everyday shop floor operations everything from booking in deliveries to logging damaged stock. Having been using a legacy HHT for the past 15 years the business invested in a new HHT manufactured by Zebra with the aim of making store operations more seamless. My role was to collaborate with an array of Superdrug stakeholders to research, design and test all UIs related to the project to improve efficiency, effectiveness and satisfaction. This was a large scale project meaning I collaborated with different teams across the business including store staff, store operations, project, design and development to launch this initiative in all 800 Superdrug stores.

To get the project started I attended the kick off meeting to be briefed on the overall project and my role and responsibilities. This was a large scale project with the device being rolled out to over 800 Superdrug stores, a project task force was set up to deliver the project made up of stakeholders not only in Superdrug bu across the group. My role was to revise the user flow, develop the UI and conduct in store user testing sessions to ensure the project met KPI’s. The task force consisted of the following five members:

It was important that I started the project by carrying out comprehensive research of the current HHT to understand existing user behaviours and usability issues. I started off my research by conducting contextual enquiries with store staff in one of Superdrug’s flagship stores in Croydon. I conducted user interviews with three key staff members that use the device frequently, the Store Manager, Assistant Manager and a Store Operative. This allowed me to understand first hand how the current HHT device was being used in store and the biggest issues that affected staff from carrying out their key tasks efficiently.

The interviews with the store staff revealed not only existing usability issues but also allowed me to get an understanding of staff usage. It quickly became apparent that the device was more frequently used on the shop floor on a day to day basis by the store operatives where as the store managers used more of the back office functions in the office located in the rear of the store. Also, the interviews revealed that staff not only experienced issues with the device but also external hardware factors such as the speed of the internet connection that often slowed down the performance of the HHT.

Following the contextual enquiry, I spent time in store shadowing the store staff observing them using the HHT during their shift. The reason for this was because often, what users say they do is very different to what they actually do and I wanted to verify what they told me was actually accurate and the best way to do this was to observe them using it first hand in context of use.

The staff observations confirmed what they had told me but also revealed a couple of extra insights of issues I noticed. These were:

– Scanning from distance
– Security of transporting and storing the device
– Saving tasks and coming back to them later
– Knowing what tasks had already been completed and what tasks were due next

Following the contextual enquiry with store staff, I was able to develop some personas that would help me keep sight of the primary users during the design phase. Prior to the contextual enquiry I was expecting the HHT to be very much geared around the Store Managers but having spoken and observed staff it became apparent that Store Operatives used the device around 70% of their time compared to around just 20% of that for store managers and for very different tasks. For this reason my primary user was the Store Operative and I quite easily defined their goals and key tasks that needed to be factored into the new design that would make it more efficient to use.

Now that I had some solid research on current usability issues of the existing device and how it was being used by staff it was time to map out the user journey. As the current HHT was a legacy system there was already an array of documentation including user flows so I decided to take a different approach on how I tackled the user flows. Having already observed staff using the device in context of use I decided to work backwards analysing the user flows and identify ways of reducing steps and improving each journey. Working with the analyst, I came up with revised flows that would eradicate the existing usability issues and make it quicker to carry out tasks on a daily basis. Below is an example of how I analysed the user flows:

It was time to start working on the new UI and IXD so I conducted a number of wireframing sessions where I would mock the user journeys and IXD in real-time with the project task force so we could make design iterations quickly. The idea of this approach was it would allow us to work in an agile way designing, testing, iterating and developing without getting bogged down in a set framework. However what i found was that when I developed the UI and passed it to the developers for development, they were finding that they couldn’t always develop the UI and/or IXD in the same intended way. The reason for this was that the developers were new to the coding language (base) of the new device and it meant there were limitations on how far they could go when it came to IXD. With this in mind, we simplified the approach by allowing the devs some creative freedom with the UI when they came up against a code limitation meaning they could make amendments to the UI in order for the function to work in conjunction with the device code. This proved to work well during the development phase as my mock ups steered the developers for each user journey and ensured that each function actually worked. To allow us to test each journey we split the development up into batches so that we could test the newly developed function whilst the developers would begin the next batch. This meant that we could feedback usability issues to the devs at the end of each testing cycle in order for them to make alterations. This cycle of design, develop and test lasted for a period of around four months.

Using Axure, I imported the UI screens from Sketch to produce an interactive mockup of the revised user flows so the developers could see how to map out the new user journey and see the intricate interaction designs. An example of this flow can be seen in the video below carrying out the pick list function:

The new HHT was rolled out to five stores so we could conduct our user testing sessions with store staff and also obtain real user feedback about the revised device and UI. It was important for me to test the new device vs the old device analysing the key metrics I set out at the start of the project effectiveness, efficiency and satisfaction. To do this I conducted two separate user testing sessions at Superdrug’s Centrale store in Croydon with the Store Operations Manager Fran. What I did is asked Fran to complete 12 of the key tasks on the old device and the new device using exactly the same variables such as stock being scanned, same pack size, number of SKU’s etc. I filmed each of these key tasks so I could compare the user journey like for like and also time each key task to report on efficiency. These testing sessions took place on two separate occasions to avoid minimal store disruption, the old device was tested on 31/08/18 and the new device on 09/09/18. The results were eye opening – the new user flow and UI halved time on task (see results section). To demonstrate the efficiency improvements, the below footage shows one of the key user journeys “Boxed Stock” shown side by side old vs new device:Not only did this approach allow us to document evidence of the differences between the devices, but it proved a powerful way of reporting back to key stakeholders as we used the recordings in presentations later on particularly when presenting to senior stakeholders.

Now that I had clear measures on effectiveness and efficiency, I wanted to also obtain the third and final KPI – satisfaction. To do this I employed a simple survey technique using the single ease question method. This involved me asking the store operative who worked in the Centrale store, to conduct the same user tasks I tested with Fran on the old and new device. Directly after each task was completed I would ask the store operative to rate the task on ease of use using a simple seven point likert scale. I could then compare the satisfaction results of old vs new and the results (see results section)

As this device was brand new to staff who had previously been using a legacy system for the past 15 years, it was important that the business had measures in place to support staff should they encounter difficulties therefore two main initiatives were introduced. Firstly, the Store Operations team created a comprehensive user instructions manual for staff to refer to. This contained detailed instructions on how to perform tasks and troubleshooting information along with key support contacts. Secondly, a dedicated telephone help line was set up that enabled staff to call at any time during opening hours and report issues / bugs. What we found during the pilot was that bugs appeared on the fly and required hotfixes by the dev teams. This helped us iron out any bugs before mass roll out. With successful results of the pilot, it was time to for the Business to roll out the new device. This wasn’t really my area and was mainly handled by Liz the Project Manager, Store Operations team and I.T teams. Following the pilot it was decided to roll out the device by store region so any bugs picked up by new stores could be fixed before roll out to the next store region.

Effectiveness – Task completion: In conjunction with the single ease question survey, I asked the store operative who just rated each task an additional question – did they manage complete the task? I then plotted the results in a graph. It was important to capture this metric however wasn’t as insightful as my other KPI’s as staff already new how to carry out tasks on the old device and had already been using the knew device. Nonetheless, both devices scored 100% for task completion as shown below:

Efficiency – Time on task: Having identified time on task as one of the main KPI’s for the project as time is literally money in stores, it was great to be able to report some radically strong improvements for time on task metrics for the key 12 tasks I tested. Overall, I managed to half the time spent on task for all 12 key user journeys which equated to one whole day per staff member per store per month!  Across the 800 Superdug stores, the impact of this time saving was unprecedented!

Satisfaction – Single ease question: Backing up the strong efficiency results it was interesting to analyse the results of the single ease question (SEQ) to see if staff satisfaction levels had improved on the new device. Overall the new device had made massive improvements in satisfaction from an average score of 4/7 to 6/7.

The new HHT device and UI was rolled out to all Superdrug stores on 07/11/18!

I really enjoyed working on this project for Superdrug mainly because the outcome was so far reaching, impacting a number of different touch points across the business. The result of my work meant that I had improved the daily lives of a variety of stakeholders across the business including shop floor staff, managers, head office staff, supply chain and I.T. However, like many UX projects it wasn’t all plain sailing and I came up against some challenges. The most challenging area was the fact that the code base of the new device was new to the internal Superdrug development team. This meant that the development team couldn’t always follow my new user flows and UI to the degree. As mentioned earlier, I overcame this challenge by allowing the development team a degree of freedom to amend user flows and UI if applicable- this made us work in a much more agile way which for this project worked really well.

Overall, I very much enjoyed this project and am proud to be have played such a major role is such a large scale project!

The following testimonial is taken from the company wide weekly trading update from Superdrug CEO Peter McNab on August 16th: