UX Design

CheckPoint App

The product:

CheckPoint is an gaming supplies app meant to help in purchasing gaming equipment. The typical user can range from 18 to early 50s, usually early career professionals for themselves, and mid/late career professionals with families. CheckPoint’s goal is to make an easy, accessible app for gamers to shop.

Project duration:

Jan 2025 to Feb 2025

Project overview

The problem:

Design the CheckPoint app for users to have the ability to purchase all their gaming needs from a simple hub, and make refunding a product uncomplicated as humanly possible.

The goal:

Ecommerce gaming apps aren’t really encouraging lately, because the sites tend to be difficult to navigate, and they have licensing and refund issues.

My role:

UX designer leading the CheckPoint’s web and app design, as well as the research

Responsibilities:

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs and responsive design.

Understanding the user

User research: summary

My research began with me looking at game retailer apps, and seeing how the apps were designed and what they usually sold. Then I looked at what products users would generally need and purchase. I then conducted user interviews, which I turned into empathy maps to better understand the purchasing, licensing, and refund practices of gaming retail apps. I discovered that most apps didn’t have solid licensing and return policies, and most users preferred actual face-to-face purchasing.

User research: pain points

Persona: Wes

Problem statement: Wes is a History Teacher who is looking for a good online gaming retailer to supply his needs for himself and his 2 children, because he is looking to expand his gaming to desktop, and for better deals.

User journey map

Creating  a user journey map of the user Wes allowed me to help identify possible pain points and improvement opportunities that came from his experiences from online gaming supply searches.

Starting the design

Paper wireframes

My first factor was sketching out several paper wireframes for the home screen, in order to select parts that fit my design idea to make the games selection stand out. The final wireframe allowed users to see games and sales as the main focal point.

Sales and deals at the foremost of the layout; New game releases being easily viewed and accessible

Digital wireframes

Once the paper wireframes were developed, they established the framework for me to go digital. Having a clear and noticeable hierarchy of sales, new releases, and categories. This was in to increase comfort and accessibility for users that don’t normally like online shopping.

For my second factor, I want to make a cart page that was chalk full of all the necessary info need to make a purchase, to make the purchasing process as simple but efficient as possible.

Low-fidelity prototype

Making the framework for the user flow by creating a simple navigation and non-complex layout design is how I established my low-fidelity prototype. For the app, I knew that I couldn’t focus on returns, but I could grasps the pain point of not purchasing online by highlighting sales and easy access to pricing.

Usability study: findings

After getting the lo-fi prototype fully operational, I had a few users test out the functionality and accessibility of the initial app design.

Refining the design

Mockups

After taking notes and considerations from the usability study, I wanted to make the presentation more visually accessible, by making all images large and strikingly appealing. I also used color and fonts for visual aid and for hierarchy.

Before usability study
After usability study

Most carts are very basic is design, so I wanted to make sure users could see as much detail of their purchases as possible, as well as monitoring their type of payment and shipping info.

Before usability study
After usability study

High-fidelity prototype

Accessibility considerations

  1. I used made the text and images prominent for any visual accessibility.
  2. I used landmarks for assistive tech, such as consistent navigation.
  3. I used colors and bold typography to establish visual hierarchy.

Going forward

Takeaways

Impact:

Our target users loved the improvement within the navigation and how accessible and visible any category or game selection was. It was easy to access and easy to complete a process.

What I learned:

I learned that without detailed research, attacking the pain points established is nearly impossible. The most important takeaway for me is understanding what a user is feeling and dealing with in a design, then being open to various solutions in order to solve them.

Next steps

All Recent Work