top of page

WE NEED THIS

Research / UX & UI / Adding a Feature to an Internal Retail Mobile App (iOS)

BACKGROUND

Company employees use this xxx mobile app to look up products in the store inventory to see if they are available or not. If a product is out of stock, the employee can use the app to place an online order for the guest or to check if other stores nearby have it. 

bbr pic scan.png

The Problem

In the first few months of working at a high-end athletic wear company, I started noticing that there were products that were consistently being requested by customers that our store did not have. I found myself consulting the xxx app for the same products in the same sizes, over and over with the same result. We were nearly always out of stock for those items. 

 

In the situation that we don't have a product, we are encouraged to place an online order for the guest:

“We offer free shipping straight to your home. It will arrive at your doorstep in 2-6 days.”

 

But more often than not, the guest declines the offer, 

“Thanks, but in that case I’ll just do it myself when I get home.”

 

The customer leaves empty handed and we are left without a sale. More importantly, since there is no record tying the need of the product to the store, the product remains out-of-stock and the cycle continues. Another customer comes in asking for the same product, often in the same size, and we go through the same motions, only for it all to be repeated again. Essentially, nothing is resolved. 

​

After repeatedly running into cycle, I reimagined the employee-facing app used at the retail company by adding a feature that could potentially solve that problem. 

Roles assumed

UX Designer, Researcher

Tools used

Figma, Miro, Otter.ai, Photoshop

Timeframe

6 weeks: April - May 2023

The Approach

A simple way to track missed sale opportunities in the moment.
​

With a click of a button on the product page, get the process started to track products that guests are coming into the store for but are unavailable. Help guests be notified when products do come back in stock. 

Directly indicate store needs based on guest feedback. 
​

Feedback of products that guests wanted but weren't available in store will be compiled into a spreadsheet that will inform weekly product strategy and store needs.

Notify guests when products come back in store. 

 

Take a proactive approach to bringing guests the product they want in store in the future, thus making each guest's entry into the store valuable, whether they leave with a purchase or not.

My Design Process

RESEARCH

I conducted research to understand why there is a gap between customer needs and in-store inventory. I did this by looking into company policies and resources and interviewing store employees at all levels. 

Background Research

  • There are no company forums for merchandising.

  • Product performance feedback happens only at the regional level and not for specific stores.

  • The company relies on heavy app usage for all employees. The xxx app is just one of many apps that an employee will use to handle products in the course of one shift. 

blurred bbr.png

In-depth Interviews

I interviewed employees at all levels of the company, including store associates, floor leaders, the operations manager, and the store manager. Age of interviewees: 24 - 55. Length of tenure: 8 months - 8 years.​

Affinity Diagram - Frame 1.jpg
IMG_6296 (1).jpg
  • Associates have never followed up on the lack of product: While management is keen to receive feedback, associates have never given feedback on the lack of product. It's not top of mind to say anything and there is no platform to voice feedback.  

  • Stark difference between associates and managers on their opinion of the availability of products in store: It also has to do with the length of time working at the store. More experienced employees have the ability to encourage the sale of a very similar product. 

  • The lack of sizes 0 and 2: There are size 0s and 2s that arrive in boxes but they are often snapped up by online orders before they even hit the floor. Often, the store only receives one size 0 and 2 in a new color.

  • Company history and policies: Historically, the company has a “boutique mindset”. Colors are exclusive and once they sell out they are gone. It encourages the type of shopping where, if you see it, grab it because you don’t know if it will come back again. 

  • With too many apps it's unclear where resources are: There is an overwhelming amount of company apps and resources. A lot of the time, employees don’t know what resources are available or in what capacity each app can be used.

  • The company relies on customer feedback via surveys that are rarely completed: Management puts together weekly business performance and gathers notes from customer feedback surveys. On average the store receives one completed survey a week. Surveys do not ask for specific product availability. 

Persona

Based on my research, I created a persona to inform the feature I would make to address the users' goals, motivations, and frustrations.

capstone 2 persona pretty-min.png

IDEATION

How might we log missed opportunities in sales in the moment so that we can use the data of requested items to drive future in-store sales? 

Sketching out the idea

Prioritizing ease and simplicity, I decided to make a feature exist in the form of a single button. This feature allows employees to press a button directly on the product page of the xxx app to indicate that a customer requested the product but there wasn't one in store to sell. 

c2 button options.jpg

01

Press the button. Above are variations (A-E) of where the added button would be in relation to the existing sold-out button. The middle shows copy options for the button. 

02

After pressing the button, the user is led to a feedback form (this step is later removed). 

03

A modal appears thanking the user for submitting feedback with an option to undo the request.

04

A weekly log of the requested products is sent to the operations manager at the store in a list/spreadsheet or graph version.   

c2 requested products.jpg

User Flow

This user flow explores the situation where a sales associate is using the xxx app with the "We Need This" feature to help a guest purchase a product that is not in the store.

c2 user flow.png

WIREFRAMES

By aligning with company branding and design systems, I was able to seamlessly integrate the feature into the app. Below is the UI Kit I created by reproducing xxx app screens. 

Capstone 2 UI library v1.png

Below are the key screens in high-fidelity wireframes, including the product screen with the added button, the product screen with modal, and the other stores screen, which automatically activates "We Need This" (a notification banner appears) when clicked on. 

capstone 2 hifi 2.png

TESTING

I used the prototype of my high-fidelity wireframes on my mobile device to simulate the xxx app and asked 9 fellow employees to complete 2 tasks. I recorded their actions and observations in 30-minute moderated sessions. The test participants included 6 store associates, 2 floor leaders, and the store manager

Results

  • 9/9 thought the feature was simple, clear, easy to use, and helpful.

  • 8/9 understood “We Need This” to mean that our store was in need of the product and that the button would send a request for it.

  • 4/9 said that the UX copy "We Need This" was in line with company language (e.g., “We Made Too Much”).

  • 3/9 would take the next step of obtaining guest information to notify them when the product came in store.

  • 2/9 brought up concerns of potential employee abuse of the feature.

capstone 2 feedback grid_edited.jpg

ITERATIONS

Based on the feedback given, I revised the feature to incorporate guest information to follow up on product requests and revised the button to add consistency to the layout of the product screen.

c2 revision pic.png

01

Add a second modal with the option to notify a guest when the product comes back in stock. This adds both a guest profile capture and a level of accountability to the product request. 

we need this button variants.png
capstone 2 hifi 5 1.png
capstone 2 hifi 6 1.png

02

Add an inactive state of the "We Need This" button so that a version of the button will always appear on the product page. The button is inactive when the product is available in the store. 

IMPACT

  • Taking note of missed opportunities in sales is a proactive approach to bringing in the inventory that will actually sell at the store. It considers guest needs and makes each guest's entry into the store valuable, whether they leave with a purchase or not.

  • Requested products through “We Need This” will populate a spreadsheet that is organized in list and graph form. The spreadsheet is sent directly to the leader of operations on a weekly basis and can be attached to the weekly business report to directly indicate store needs

  • Products that are tied to a guest profile will be noted. When those products come into the store, email notifications will be sent. This feature will help stores engage with their guests by listening to their needstaking action on their input, and following up with them afterward. 

REFLECTIONS

  • In this project I directly applied the UX design process to a company product, utilized an established design system, and further developed my interview and user testing skills with company employees at all levels.

  • Because I asked users to walk me through what they normally do, there were cases where the users didn't notice my added feature. Going forward I will remember that adding a feature can require people to do things outside their radar, and therefore the tasks need to better steer users in the desired direction without necessarily leading them.

  • The feature was enthusiastically received by my colleagues. Some thought about how to further integrate the feature into the current system, while others went as far as to discuss ways to curtail potential abuse of the feature by employees down the line. 

bottom of page