Project Overview
Product: There are several tennis courts in Los Angeles’ parks that are open to the public to book for a nominal hourly fee. While there is an existing umbrella government website and app, this dedicated LA Parks Tennis mobile app is a streamlined product designated solely to booking public courts.
My role: Visual Designer, Interaction Designer, Researcher
Responsibilities: Chief everything on this project, I conducted research and interviews, iterated on low- and high-fidelity wireframes and prototypes, as well as interaction concepts, which on the whole, made for a seamless user experience.
Project duration: February—April 2023
The problem: Reserving a tennis court should be a simple process that takes only a matter of minutes. The current means of reserving a court on the city’s website and app is a confusing process rife with pain points that frustrate users and cause them to drop-off.
The Goal: To create a dedicated mobile app that is intuitive, smooth, simple, and fast, that will provide enjoyable experiences for the tennis public and generate more revenue for the city.
Understanding the User
To understand the users I was to design for, I surveyed local public pay tennis courts in LA. I found primary users to be active and health-conscious 20-45 year-olds who preferred to book courts using their phones.
Some iterations
Lo-fi Ideation
I created p&p wireframes to kick off design ideation process. Using a less-is-more approach, especially regarding text, I was set on using large font and buttons in place of exposition, and implementing text only where it was imperative.
Preliminary Wireframes
Beyond large font, buttons that created a clear direction, and little exposition, I also wanted to keep scrolling to a minimum, to keep users engaged and onward with their journey. I opted for separate screens for things like Time and Location as well as the exact Court at each location. Many of the paper wireframes held over into digital wireframes, so that digitizing them chiefly meant refining them, which gave me confidence that the structure of the underlying UX was sound.
Before
After
Wireflow
Because the existing city website and umbrella app are littered with pain points and are navigationally Bynzantine, I wanted the LA Parks Tennis app to be a breeze to use. An app that users wouldn’t need to spend more than a few minutes on, as the linear wireflow evinces.
Design System
With accessibility considerations at the fore, to create a simple, inclusive design, I used contrasting light and dark colors, and large buttons, icons, and images. The main typeface I used is the sans-serif typeface Poppins, which is clean, sophisticated, and easy to read.
The Final Product
See how everything came together and play around with the high-fidelity prototype of the app.
Takeaways
A great deal of work went into this project and I can’t overstate how much knowledge I attained from it, especially designing for accessibility.
I have much experience writing about food and beverages for publications, as well as experience in the restaurant industry (and I love to cook) and I was grateful for the knowledge I gleaned from those pursuits so that the lion’s share of attention on this project could be devoted to design and the overall user experience. I was pleased to learn that users felt that the products were intuitive, the flow fluid, and the overall process efficient.