The Brief

 

LEGO® as a company are constantly pushing for better experience in-store & online. There was a team inside of LEGO® that wanted to create something that would bridge the online & in-store customer experience as well as help store staff bring a new dynamic while interacting with customers.

I was brought in to design the UX & UI for iPad app which would be used by store staff
across stores in the UK & US.

 
IMG_6954.jpg
 

The team

Head of Retail Operations
Programme Manager
UX Director
UX Manager
Business Analyst
6 Developers
Senior UX/UI Designer (Me)

 
 

The client

IMG_6934.JPG

LEGO® Group

The LEGO Group, is a Danish toy production company based in Billund. It is best known for the manufacture of LEGO-brand toys, consisting mostly of interlocking plastic bricks. 

They have retails stores in multiple locations across Europe, America & Asia. They have also created multiple amusement parks around the world (Legoland).

Like with all large companies, they have a lot going on in multiple different departments & teams. The teams I were embedded in were focused on the LEGO.com website and the new In-Store Application.

 

Problem they are trying to solve

Problems_sketch.png

Customers typically deal with the issue where they are in-store browsing for products and find that eithier a product is out of stock, the box is too large to take home, some cases might get put off at long queues or are with their kids and want to make a discreet purchase.  The goal of this project was to improve the in-store customer experience by creating an app that allows you to purchase an item for delivery.


UX Research

Not long into my first week at LEGO®, I arranged a trip to the UK’s Flagship store in Leicester square to observe the current in-store experience and to speak to staff about some of the existing systems they had in store & what their thoughts were on the proposed solution the company were planning to implement into stores.

IMG_6937.JPG
IMG_6942.JPG
IMG_6945.JPG

Key findings

The Leicester Square store had quite a big space, with multiple large scale LEGO builds all around highlighting different themes. Staff were very welcoming as soon as you walk through the doors (Hands on Bricks Experience). Both floors had tills to handle sales, but these systems were very old and needed to be updated.

The signup to the VIP loyalty programme was done via an erasable laminate sheet of paper which customers would use to write their details on for later input into the LEGO system. There was also a Pick a Brick area where customers can buy separate pieces in bulk & a LEGO Self Portrait machine which 3D prints your portrait (Not in all Stores).


Interviews with store staff

I spoke to LEGO® Employees at the Leicester Square store what their thoughts were
on having an iPhone/iPad mini in store to assist with the point of sale with a customer.

 
 

“I like the idea of having another device to speed up the purchase process. Will this device also handle the Pick a Brick sales & will it replace all the tills in every store?”
- Store Staff

 
 
 

“It’s a cool idea, but not sure how it is going to work in the LEGO Store, what happens when we put a transaction through on the device and we have to go and pick up the item for the customer and in-between getting the product we get stopped by another customer or having to leave the customer to get a bag behind the till. What about gift with purchase?”
- Store Staff

 
 
 

“It sounds like a cool tool to help us, but do we need to carry the device on us at all times? What happens it it gets damaged or lost?” - Store Manager

 
 

In-direct competitor store experience

laurenz-heymann-VkfhJLz5SMQ-unsplash.jpg
thomas-serer-R_0rTS9ENnk-unsplash.jpg

Key findings

I also had a look at some other store experiences including Apple store & Nike store. Both stores had a strong digital presence, almost every employee had an iPhone or iPad mini on them ready to help customers with their purchase.

I also noticed that the Apple store used their devices not only for point of sale but also as a booking, tracking & communication tool. It helps bring continuity to their customer experience, before they reach the store, while they are in
the store and when they leave the store.


LEGO® online experience

The LEGO® website is quite complex with mixture of small sites linked to it, the main priority of the lego.com site was to help customers find new & exclusive products and checkout with ease. Other parts of the website were built to help retain
customers and learn more about their customers via the LEGO ID or the VIP loyalty programme which allowed customers to
earn & burn points online or in store. LEGO Kids zone is a separate website for kids to use with engaging content and games
to keep them interested in the product. There is also another links for LEGO Life, an app for kids to help them keep inspired, share their LEGO creations, find interactive building instructions and much more.

It was important for me to keep in mind all the different products & services LEGO offer online as it could
potentially be brought into the app at a later stage.

 

Ecosystem Map

Eco-system_map.png

I spoke with multiple teams in different departments working across LEGO® Stores, Website, Adventure Parks & Mobile apps.
There were a lot of things that were changing throughout the project (Website was being merged into one,
VIP program was in the process of being redesigned). This all had an effect on the delivery on my project as I needed to get
a better understanding of their roadmap & keep them in the loop on what we were producing for stores.

Customer & Business Requirements Review

I sat down with the Head of Retail Operations & the Business Analyst to breakdown the full list of
customer & business requirements, prioritised them for design & development. 

IMG_6947.JPG
 

Development delivery stages

Phase_01.png
 
Phase_02.png
 
Phase_03.png

UX Design

Sitemap & Flow diagrams

IMG_6972.JPG
IMG_6973.JPG
 
 
LISA_Sitemap_PoC_V6 .png
 

Prototype & Testing

nik-macmillan-YXemfQiPR_E-unsplash.jpg
 
Iteration_and_feedback.png

Using a combination of Sketch & InVision we prototyped & tested iterations of the app with Store Staff & Managers
to get feedback on the usability of the app. We also tested with LEGO® Employees at their head office in London when
they had time. I made multiple iterations of the app until we got it right. 

 

UX Sign off & Documentation

Screenshot+2020-02-27+at+15.27.04.jpg

Once we finally signed of the UX (Users/Business/Devs/Design) I demoed the prototypes to the entire development team to ensure they understood how were were expecting the app to work & I added the development team to the InVision Prototypes to use as reference to build the foundation for the UK & US versions of the iPad application. This gave me the breathing room I needed to work on the UI for the application.

 

UI Design

LEGO® Brand guidelines

LEGO_Brand_Guidelines.png

LEGO® had Brand guidelines which they shared with me, they also had guidelines for web & mobile which I used for reference & would collaborate with the design team weekly to check it is aligned with their guidelines and they were happy with any new components I introduced.

 

Designs

 
james-pond-26vBUtlufFo-unsplash.jpg

Design process

I worked closely with the design team constantly iterating
& improving the user interface. There was quite a lot of
input from different departments/teams on the UI of this application from the Business/Design/Development teams. Even though there was a lot of back & fourth on the UI,
we managed to get through it and deliver all the UI
for the development team to use and implement.

 

The app was released in 1 UK store & 1 US store in late January 2020 as a trial before being opened up to wider stores across the UK/US/Europe. The developers continue building new features and will continue to release new versions of the app to push the in-store experience to the next level.