JB Direct

JBD-Cover-(Staff-&-Cust).jpg

JB Direct: A new way to sell and shop during COVID-19

4 teams of Devs, 2 separate UIs, 1 Designer & next to no time

 

Overview

In response to COVID-19, JB Direct is a new service providing customers the ability to seek assistance with one of our JB sales staff over the phone and complete their order via their smart phone.

This was an emergency project brought forward due to the concern JB Hi-Fi stores were going to close as a result of the strict lock-downs enforced by the State Governments. I was only 5 months into my role, and was tasked with leading the design of this mission - and we were racing against the clock!

 

Role

Workshop facilitation, stakeholder management, User Research, UX/UI Design, Prototype & Testing.

Project Time

March 2020 - Present

 

Background

When I joined JB Hi-Fi as part of the IT Engineering department, I was the only Experience Designer in the company, therefore, human-centered design was not commonly practiced throughout the business.

When COVID-19 hit, it was clear JB stores may be forced to close and we needed to come up with a solution to not only continue offering customers access to our products and services, but to save our staff from unemployment. New to the business, I was building my voice to advocate for HCD practices, therefore, when I was tasked with leading the design of this effort knowing I’ll be working along side 4 separate teams, I knew it was going to be a challenge - one that I was up for.

 

The A-Team

JBD_Project Team Map.png
 

Accessibility

As a deaf person, I value solutions to problems where designing for accessibility & inclusion was at the forefront of the design process.

When the business decided to utilise a call-center service to connect customers to our JB Staff, I did my best to advocate for accessibility and inclusive solutions. Unfortunately, I had no success on that part and had to move on because time doesn’t stop for us.

 
A11y-note-.png
 
 

Understanding the Problem

With time not being on our side, I didn’t have the luxury of conducting a thorough discovery on the problem space with customers and current JB sales staff. Therefore, I was forced to utilise all staff in the head office who used to work in the stores to get as much relevant information I can. Below are some of the assumptions we had at the time:

  • Customers will want assistance in getting:

    • Themselves set up with the right products so they can work from home with ease.

    • Their children set up so they can continue to comfortably be educated from home.

  • It will be a challenge to train staff to adjust to this new way of selling via the phone.

  • Customers will assume to call their local store directly for sales support, instead of the new JB Direct number.

  • May have a lot of failed conversions if Customers aren’t supported all the way through.

 

Customer Journey Map to better understand the problem. Click on image to expand.

Therefore…

JBD_question.jpg
 

Known Challenges

  • Working from home - not being able to see progress with ease.

  • Design and development working simultaneously - therefore a race to get user flow & UI done before it’s too late.

  • Being the design point of contact across 4 teams - endless videocall meetings (a exhausting challenge for a deaf person).

  • Advocating for HCD - All teams involved had a dev-heavy mindset with little interest in design.

  • Working blind - Everything was designed & built based off educated assumptions & minimal discovery.

 

Product Vision

The idea was to replicate the in-store experience between staff and customers over the phone by creating two separate web-based applications - one for the JB sales staff, and one for the customer. These two UIs would be linked to each other, providing the customer with visibility of the recommended products with links to the their respective detailed page on the main JB site as a reference for further discussion. It was believed this would add value to the conversation, having that transparency between the two parties.

 
JBD Vision Illustration.png
 

Design

As always, I begin my design process with a lot of hand sketches to get my thoughts down on paper.

 

First round UI

Due to multiple responsibilities throughout this project, I requested additional help from a colleague to work on the UI with me. Together, we were able to create the first round staff and customer facing UIs for the application.

 

Receiving an SMS with a link to their live JB Direct order, while on the phone to a JB salesperson.

 

User Testing:

While the UI was being built (which I managed via daily check-ins), we took the opportunity to prepare and conduct some user testing to ensure we were on the right track. It was not the ideal approach since user testing is generally done prior to the building stage of the process, however due to the circumstances, we had to take every opportunity we can get. Once the app was complete in UAT, we began user testing straight away.

 
 
lookback logo.png
 

User testing with JB Sales Staff:

Due to a covid-lockdown, we utilised Lookback to conduct the user testing sessions with JB sales staff to gain insights into what works for them and what doesn’t, keeping in mind this new tool is essentially a hybrid of the current in-store POS software and the JB Hi-Fi website.

User testing with customers (friends and family):

Teaming up with my BA, who used to work in JB stores, we were able to replicate the envisioned JB Direct experience. On one end the BA plays the role of the salesperson while the participant plays the customer. It turned out to be a fantastic approach to gain insights into the flow of the conversation and how the Customer UI supports the main objectives.

JBD_ah-ha-moment.jpg
 

Due to the high demand for a nation-wide release ASAP, this meant we couldn’t make desired changes based on the feedback we received during user testing.
But then Black Friday was creeping up fast and we had another opportunity…

 

Black Friday

The Black Friday sales is one of the busiest periods on the JB calendar. With Covid-19 causing much uncertainty around what social distancing restrictions will be in place for the stores, the business were keen to discuss how we could utilise JB Direct to tackle this potential challenge.

What happened next?

I was asked to facilitate a virtual workshop, utilising Miro, with key stakeholders and colleagues to further understand the problem space and how we can tackle it together. It was a constructive session, resulting in clear actions to take moving forward.

 
miro-logo.png
 
Screen Shot 2021-02-22 at 4.49.15 pm.png
 

Revised designs

Staff facing solution

Customer-facing solution

 

Results & takeaways from this project

Working with the teams to bring JB Direct to life was an experience like no other. Here are some key takeaways I learnt from this project:

  • Sometimes you need to be assertive when advocating for HCD practices - In the beginning it was a challenge to encourage developers to follow the designs that were presented to them. As a result there were a lot of inconsistencies between the design and finished product. It taught me to stand my ground and educate my colleagues the benefit of following the design - an improved user experience for sales staff and customers.

  • Collaborative design thinking is key to solving problems - From the start I encouraged all colleagues to share their thoughts on the user flow and designs. All feedback was constructive which helped with the progress of the design.

  • Include the Developers early - Regardless if you have plenty of time or not, I found it’s beneficial to include the Developers from the start of the process with regular check-ins to ensure everyone is on the same page. This was also an opportunity for me to develop further knowledge about the front and back end process, which in turn greatly complimented my design progress.

  • Bring stakeholders along for the ride - I found by taking the stakeholders through the whole process, they were able to develop a greater appreciation for what we do as Experienced Designers, thus providing ongoing support for design-led initiatives.

130,000+

Individual Sales

 

250,000+

Products Sold

 

$100,000,000+

In Sales