UI Designer, UX Designer
Aug/14 - Sep/1 2017
Sketch / Keynote
Starbucks has a very complicated business. Their internal process is paper-based right now, which can't help partners (Starbucks Employees) solve standard and opportunity gaps efficiently.
This Proof of Concept project is to outline how digital engagement will empower partners to identify and close standard gaps in the business with real-time data in a centralized system. I worked on client workshop, user interview, wireframe & flow design as well as visual design for the project.
1. Partner Interview
Interviews were conducted during onsite visits with partners (Starbucks Employees) to uncover pain points, workflows, and workarounds.
We discovered that Store Managers has the most issues with the paper-based process. We created a persona to look through the user's eyes.
3. Flow & Wireframe
We collaborated with Starbucks to identify the key flow. We iterated wireframes to show how the App can solve user's pain points.
4. Visual Design
I created high-fidelity designs to present data in a user friendly way and to visualize how their actions can affect the data and the business.
We interviewed 11 partners including Store Manager, Shift Supervisors and Barista to uncover their daily workflows, pain points and expectations. Below are the key insights:
- Disparate Information - Critical information is spread across systems (RegisterSystem, IMS, Decision Center, Daily Records Book, etc). Store Managers spend a lot of time switching between tools in order to get a full picture of their store and strategize accordingly.
- Manually Compiled Trends - Store Managers rely on data trends to make decisions about how to run their store. They’re currently generating their own tools and methods in order to view trends.
- PDF & Paper-Based - The paper-based system results in a manual process, is hard for partners and the business to track, easily lost or forgotten, and provides no day-to-day visibility to the business. PDF and paper tools are hard to keep up to date.
Flow & Wireframe
5. Notification View - Michelle decides to add a partner to mobile order to increase customer occasion. She sends an notification to the group.
This is the second iteration of the flow. In iteration 1, we explored a system that allows partners to find out solutions to each symptom with just 1 step. However, based on the client's feedback, the primary goal is not to display HOW to solve a symptom to partners. Instead, this system is to educate them WHY a symptom happens. So we updated the flow to reflect the step by step education. We continued to refine the flow in Visual Design phase.
This system is very data heavy. So I designed a visual language to make the data display consistent and easy to digest.
- Dark Grey is used to show data in the past years.
- Green is for expected data or expected actions.
- Coffee is used to show current data (this year/this week).
- Orange is to highlight educational information, the WHY.
- Red is to indicate the problematic areas.
1. Dashboard - It’s Monday morning and Michelle is planning for her week. She logs into “My Store”. Right away she sees that her store’s total sales have declined in recent weeks. She sees her store’s peak transactions in particular are down. Concerned, she taps into that card to understand the details of the problem.
2. Identify Gaps - “My Store” analyzes her store’s trends from the past few weeks. Michelle sees a personalized assessment. There are a few potential standard gaps to explore in relation to the decline in her store’s peak transactions.
3. Suggest Solutions - She decides to explore the Staffing card. “My Store” suggests solutions based on her current staffing situation, to help her solve the standard gap. She likes the idea “Hire more partners that have peak availability” and taps to see the details.
4. Predict Changes - “My Store” suggests that she hires one partner with peak availability. Here, she can toggle the numbers to model what would happen if she were to adjust the number of partners during peak, and how it is projected to affect her sales.
5. Predict Changes Interactive - “My Store” helps her easily visualize the impact one more partner could have on her store. Michelle decides she will go ahead and hire a partner with peak availability, since the tool predicts it will increase customer occasions and total sales.
6. Notification - After a few interviews, Michelle finds the right person for the job, who can work during peak. She hires a new barista, and sends a message to her team through the app’s digital messaging center to notify them of the change.