Client

John Lewis

My Role

Senior UX Designer

Summary

I helped create the 'Partner App' - a point of sale app to allow customers to order and pay for items without standing in line at the till.

Project Summary

The problem that staff faced in the stores was that during busy periods the queues for the checkout became long and this would cause customers to become frustrated and abandon their purchase. During these busy periods, staff that would normally be available for customer queries on the shop floor would be requested to work on the tills instead thereby causing a secondary frustration for customers that wanted help in some way.

The 'Partner App' is an iOS iPhone application that is used by staff in-store and allows them to check stock levels of any given item, order products, compare products and create shopping lists for their customers. When the device is connected to a card reader, it also allows staff to take payment for items and serve as a portable checkout for customers instead of making them stand in line at the tills, thus making their in-store experience more efficient and more personable.

Stage 1: Observation

The first stage of designing a solution was to speak to the retail team themselves to try to better understand the problems they face and surface any other requirements that they may have. We discovered that alongside the original problem surfaced by the business (employees being made unavailable on the shop floor during busy periods) employees also found the process of manually checking stock availability in the stock room to be laborious and time consuming. An additional task of some employees also included a 'personal shopper' service and so the ability to create a share lists of items, including those that weren't available to buy in-store, would also be helpful.

Methods and skills used:
...

Interviewing

...

Surveys

...

Journey Mapping

...

Competitor Analysis

...

John Lewis & Partners pride themselves on good customer service.

...

Large queues for the till during busy periods were causing frustration to customers.

Stage 2: Ideation

After all requirements had been gathered, my colleague and I started to plan the architecture of the app. As a starting point, we used the code base from the existing customer-facing app as it already contained many of the features that could be used to answer the needs of the employees in store. However, some features needed to be added and so a lot of time was spent working with developers to work out the best ways to remove some content and add new features gracefully without breaking the functionality.

Methods and skills used:
...

Information Architecture

...

Wireframing

...

User Flows

Stage 3: Prototyping

When a basic architecture was decided upon and we thought the proposed user journeys made sense we turned these ideas into low fidelity wireframes that could be used as a prototype using 'Axure'. As the real users of this app are in-store employees, we guerilla tested the product with them in their place of work rather than making them come to the office. This had the added benefit of allowing us to observe them use the app in it's actual enviroment rather than a hypothetical one such as the user testing lab.

Methods and skills used:
...

Prototyping

...

Guerilla Testing

...

Sketch

...

Axure

Stage 4: Implementation

After three rounds of testing with our users we then felt confident that we could start to create the UI for our app. Using elements from the existing pattern library I created the final screens using 'Sketch' and then shared them with the developers using 'Zeplin' to give them the specifications.

Methods and skills used:
...

Sketch

...

Zeplin

...
...

The personal shopping experience in store.

Lessons Learned

  1. There's no need to re-invent the wheel. Some of the problems the employees faced could be solved using features from the existing customer app so it made sense to adapt those features to suit our own needs rather than design and build new ones.

  2. It can be much more beneficial to do user testing in the environment that the final product will actually be used in.