Rumpke Mountain Boys | Get your Merch Here! Dedicated 
Mobile App
Julie Dawson | 08/2021 - 01-2022
Introduction:
Rumpke Mountain Boys Get your Merch Here! Dedicated Mobile App
Imagine you at a Rumpke Mountain Boys show, and you want to buy some merch, so you walk over to the merch booth only to find there is no one there! This was a problem most RMB fans had gotten used to. Until now, now you can purchase your merch on their new app The Rumpke Mountain Boys Get Your Merch Here! App
Introduction:

The problem: 
Rumpke Mountain Boys fans need an easy way to purchase merchandise at concerts and online when the Rumpke Mountain Boys merchandise person may be away or when the website may need updating.

The goal: 
Create an app that will serve fans at the merchandise table and online, while keeping track of available merchandise, to make ordering easier for everyone.

My Role:
Lead UX Designer

Responsibilities: 
User Research, Wireframing, Prototyping, Information Architecture, Usability Testing. 
Understanding the user
User research: pain points
Larger shirts
“Make shirts for fat guys. That’s as a former fat guy, that’s something that’s always lacking”.
Ladies styles
“Women’s sizes I don’t understand why those aren’t more available because half of the world is women.”
No one at table
“When he finally got back to the booth, I shuffled through unorganized shirts to find the size that I needed.”
More variety
“I’d love to see some Rumpke patches; the patch scene is coming back in style.”

Persona: Ashleigh

Problem statement:
Ashleigh is a busy Medical transcriber and a die-hard Rumpke fan; she needs to quickly 
find her size get her merchandise, and get back to her spot on  the rail.
Persona: Brandon

Problem statement:
Brandon is a javascript developer and longtime Rumpke fan; he needs 
a seamless online experience because, as a web developer, he 
is easily frustrated when websites fail to perform as they should.
User journey map
Goal: 
To find a new trucker hat at the merchandise booth at Birds of a Feather Festival.
User journey map
Goal:
 Find new Rumpke Mountain Boys hoodies in an XXL for himself and an XS for his wife to wear to  Snuggleween.
Starting the Design

User Task:
 Purchase merchandise in the app
Paper Wireframes:
When sketching and brainstorming for the paper wireframes, I didn’t think of the “Your Order is Complete, and Create a Login Pages, Those would come later when linking the prototype.
Digital Wireframes:
I tried adding a right scrolling feature on the Merchandise page, I would later find that the right scrolling feature on the Merchandise page was confusing to users
Low-fidelity Prototype:
Link to Prototype:
https://www.figma.com/file/vPDcLfmCX0YYqsOHLLfH1L/RMB-Wireframes?node-id=37%3A1229
User flow: Placing an order
Usability study: findings:
Round 1 findings:
1. Side to side scrolling could lead to confusing among users.
2. If we type out the categories rather than having just lines it would be less confusing for users.
3. Users want to add input data to prototype.
Round 2 findings:
1. Users were confused by adding item to the cart and a different item coming up in the cart.
2. Users took some time to get to the Merchandise Screen from the Home Screen.
3. Users were confused by the keyboard moving on and off the screen quickly.
Refining the design

Mockups:
To avoid confusion I changed the Merchandise Screen name to the Shop Screen and changed the format of all of the screens to iPhone 13 Pro, as the previous screens were short and stubby. I increased the background saturation and increased the corner radius on the items and spacing to make the items more clear.
Mockups:
Adjusted the timing of the keyboard entering and leaving the screen, and added Details screens for each item. I chose a lighter background color and created outlined buttons, giving the Add to Cart button priority
Mockups:
High-fidelity prototype:
https://www.figma.com/proto/vPDcLfmCX0YYqsOHLLfH1L/RMB-Wireframes?node-id=261%3A352&scaling=scale-down&page-id=203%3A61&starting-point-node-id=305%3A516
Accessibility considerations:
1. Low vision, the smallest type in the app is 13 point. Color Blindness, the app uses contrasting colors.
2. Changed the timing of  the Keyboard coming on and off screen to avoid  jerky movements, and  prevent seizures.
3. Included icons with the names typed below them to make them more legible.
Going Forward:
Mockups:
To avoid confusion I changed the Merchandise Screen name to the Shop Screen and changed the format of all of the screens to iPhone 13 Pro, as the previous screens were short and stubby. I increased the background saturation and increased the corner radius on the items and spacing to make the items more clear.
Takeaways:
Impact: 
“Extremely simple, very easy, self explanatory it is very nice it is very simple.” Jeffrey Spradlin
What I learned:
From this project I learned how to use Figma, how to do a usability study, how to analyze and synthesize the results and iterate on my designs.

Next Steps:
1. Add a way to integrate the tracking of merchandise on hand to ease the burden of the person working at the table and improve the ordering process.
2. Send to the Rumpke Mountain Boys for approval.
3. Send to engineering team for implementation.
Let's Connect!
Would you like to see more?
juliedawsondesign.com (859)512-2911 julie@juliedawsondesign.com https://www.linkedin.com/in/juliesearsdawson/ https://juliedawson2001.myportfolio.com https://www.behance.net/jsears20 
Thank You!

You may also like

Back to Top