top of page
hyvee secondary image.png

Product Mapper Mobile Application

Background

Our team was tasked to use new technology to create a native Android mobile application to accurately map a store's inventory. 

My Team

UX Designer

Product Manager

Software Developers

Steakholders

My Role

​Requirements Gathering

User Research

User Flow

Wireframe

Prototype

Iteration

The Problem

Design an application that uses AR to map store inventory while keeping the store employees in mind.

The Solution

We created an application using AR to map individual shelving units and fixtures to help send accurate information to current shopper applications.

Step 1:

Requirements Gathering and Research

Step 2:

User Flow & Lo-Fi Prototyping

Step 3:

Iterating & Hi-Fi  Prototyping 

Step 4:

Conclusion

Step 1: Requirements Gathering and Research

Requirements and Research

We conducted Steakholder Interviews to better understand the problem and requirements. 

​

Based on these requirements we created sketches for the main features.

Screen Shot 2023-01-24 at 3.58.46 PM.png
Untitled - Frame 1.jpg
Hy-Vee Product Location - Frame 1.jpg

Step 2: User Flow & Lo-Fi Prototyping

User Flow

Based on our problem, goal and research, I created our user flow.

​

This is an updated user flow for our final prototype.

Hyvee User flow.png

1

2

3

4

Scan Fixture Tag

1

Choose which fixture you are scanning

2

Scan for positioning or scan UPCs

3

After everything is scanned, submit

4

Lo-Fi Prototype

I started with grayscale Lo-Fi prototypes after completing the original user flow.

Hy-Vee Lofi.jpg

Step 3: Iterating & Hi-Fi Prototyping

Iterations

During this project there were multiple iterations while designing because it was new technology for both our team and the client. There are many versions of the deliverable application for testing in store.

​

This was the first version.

Hy-Vee Workflow_oiginal 2.jpg

Log-in credentials are in the application

1

No AR view for positioning

2

Location is not listed on the UPC card

3

Logo used as markers for AR review screen

4

hyvee middle workflow iteration.jpg

This is an iteration half way through the project after a few rounds of testing.

Two flows for different fixture types (Center Store vs. Other)

1

AR view for positioning

2

User is able to manually enter UPC

3

Different review screens for the different flows

4

Digital Prototype

After multiple in-store testing days and iterations on and off site, this is the final prototype for phase one of the Product Mapper Application.

hyvee workflow final.jpg

Three flows (Linear Shelving, Other Displays, Manual Shelves)

1

AR view while scanning (Green squares for markers)

2

Review screen is list view only

3

Manual Shelving added as a back up if AR view in Linear Shelving is not working

4

Step 4: Conclusion

Steps

In conclusion, the team used new technology to build an application to accurately map the store's products to more easily share information with shopper apps.

Step 1: User Flow & Lo-Fi Prototyping
Step 2: Iterating & Hi-Fi Prototyping
Step 3: Conculsion

Future Opportunities

Based on user testing, edit current features and flows

1

1

Update current application with more features

2

2

Send updated application for more user testing

3

3

2023 | Alaina Hornibrook - Graphic/UI/UX Designer

  • LinkedIn
bottom of page