Pickup App

Pickup is a league management app for recreational basketball pickup leagues. The app intends heavily on push notifications, and requires a clean, fun design style and ease of use for on-boarding new customers.


A bit about the UX design process…

“A person’s perceptions and responses resulting from the use and/or anticipated use of a product, system or service.” (ISO 9241-210:2010, subsection 2.15)

In the simplest terms, UX design is about making the user’s experience with the product the best it can be. The “design” aspect of UX focuses on how the utility, ease of use, and efficiency for a user’s interaction with a product or service can be improved.

1. User Research - conducting research through various methods such as interviews, surveys and personas to identify results that tell us about the users, their behavior, goals, motivations, and needs.

2. Design - explorations and defining styles, flows and interactions to make the users’ experience most effective and enjoyable.

3. Testing - performing various tests with groups in the feedback loop to better understand where pain points may exist and how to best address them to end up with the most effective product.


In this case study, we’ll streamline the UX process to focus ion Step 2: Design …


Design: Brainstorming and sketch phase

After gathering the best information from our research steps, we often gather in a room and quickly jot down early ideas for the product flows and iterate over many versions of the main areas of focus for the project. The goal here is to quickly get an understanding for how the product may best serve the user and maximize the experience. We work very quickly here, churning out variation after variation to discover the best approach for the product.

Design: Wireframing

Once we have a good understanding of the flow of the product, we then move to a series of wireframes: style-less mockups that illustrate the product in much more detail, often introducing all actionable buttons, links, swipes and reveals. We still work on a monochromatic pallet, as to not be distracted by any stylistic choices at this point. This step is all about information architecture, flow, and layout for each view.

Design: Visual styles

Finally, the pretty step. We create style guides for the project, and apply them to each and every element from the wireframes to product beautiful full-color comps of how the product will be seen once released.

Once the visual styles are defined, we go back to the Testing step, as many rounds as needed, each time adjusting and flows, layouts and visual styles until the project is ready for launch!

A look at Onboarding

See an example of screens for onboarding new users to the Pickup App, and some additional screens for use cases of existing users.

Flow diagram

Click on the flow diagram for a larger view.

sample-brands-pickup.png