Overview

When I first started at Raccoopack Media in July 2021, this project was already in progress. I began working on it right away and took over the UX responsibilities which included design revisions and improvements, testing, research, and development handoff.

Duration:
Role:
Tools:
Jul - Sep 2021
UX Designer
Figma, Adobe Illustrator

Project Goal

The goal of this project was to provide KBC with a more efficient method of tracking their parts and inventory. Their original process consisted of filling out forms and doing everything manually, however, they wanted something faster, easier, and more organized.

First Steps

It can sometimes be difficult to jump into a project mid-way through and hit the ground running. This is why for my first steps, I made sure to take the time to fully understand the project, its functions, the problem space, and the goal. I familiarized myself with the already existing design by using the prototype repeatedly and exploring every page, button, and function.

How it works

The app works by allowing users add and track parts and products from their store. To add a part you can scan a barcode or manually input the part ID. It is then stored in the database and can be viewed on the dashboard. Users can also filter and search through their dashboard and view and edit the information related to their parts.

Set a location
Before adding a part, you can set your location by manually typing it in or scanning a barcode with a location. This will be connected to the parts that you will scan in the following step.
Add a part
Once you have set your location, you can start adding parts. In the warehouse, QR codes will be attached to parts. Using your phone or tablet, you can scan the QR codes to import parts into your inventory.
Add a part
Once you have set your location, you can start adding parts. In the warehouse, QR codes will be attached to parts. Using your phone or tablet, you can scan the QR codes to import parts into your inventory.
Search and Edit Info
If you want to search for a part, simply type in the part tag number, or toggle the "View My Last Drop-Offs" switch. Once you find the part you are looking for, you can edit the information of that part.

Mobile Test

For the mobile test I wrote out a series of tasks for the employees to complete. During the test I took notes and recorded if the participants successfully completed the task or if they had trouble.

Testing Notes

Pain Points

After reviewing all of the notes from the mobile test, I gathered a list of pain points that were mentioned by our participants. Some issues were recurring and ranged from minor to severe. To demonstrate the range of all these issues, I put together a chart which includes all of the pain points, and the number of times that they occurred throughout the tests.

The y-axis displays the severity of the issue, and the x-axis displays the feasibility. The number represents how many times the issue came up during the user tests. This chart is helpful because it allows our team to see which problems we should tackle first and which ones will take the most time and resources.

Design Solutions

Now that our team had a better understanding of the issues in the app, it was time for me to come up with some solutions to these pain points. Below I have a list of all the pain points in order of severity and the solutions that I proposed.

Pain Point
Solution

Some kind of tip or help button that lets the user know they should be in a brightly lit spot, or to move the camera view closer. Test the QR codes to see the best way of scanning to ensure the most successful results.

Adding some kind of confirmation pop up before the user can proceed to the next step. "Are you sure you want to complete to drop off".

Explore different sizes of the text and placement of the buttons.

This is a backend issue so the best course of action would be to let the development team know exactly where and when this bug is happening.

Option A: Add a new page to the bottom nav bar.
Option B: Make the change location button clearer by adding text
Option C: Add a separate button for changing location
Option D: If we’re adding a “Confirmation Drop-off Modal”, we can have a change location option on there.

Revisions

After creating some solutions to the major pain points that occurred throughout the user tests, I applied these solutions to the design of the app. Some of these were minor changes but they made all the difference in clearing up confusion and ensuring a smoother flow for our users while completing tasks and navigating through the app.

Results

By conducting multiple rounds of user testing and revising our designs based on the feedback from those tests, we were able to deliver an effective and easy-to-use product that sped up the company's entire process saving them time, money, and resources.


After the first 3 months of the app being used at Kekuli Bay Cabinetry, we were able to calculate the expected benefits and value that our app will provide the company within the first year of use.

1000+

Management hours saved

$25,000+

Saved by reducing lost parts

92%

User testers rated very easy to use

Let's connect!
Send me a message, I'd love to chat.