UI Design, Design System
Redesign the TSM to be more user-friendly; increase the visibility of essential UI components.
Club Unity, a Calgary-based startup that develops tee-time booking applications for golf clubs, asked me to redesign their Tee Sheet Manager (or TSM for short). The TSM is what golf pros and staff use to manage reservations made through the Club Unity app.
The Tee Sheet Manager (TSM) had design issues that hindered users' ability to perform specific tasks well. Such tasks include batch editing multiple bookings and scanning the TSM for tee-time openings. The clients also provided usability feedback they've already gathered through their research, with one feedback mentioning an issue with scannability due to poorly placed UI components.
Creating an easier experience
It was essential to emphasize scannability when designing the TSM. The Golf Pros who use this tool look at hundreds of reservations over a week, so they need to see available times and spaces easily. I focused on simplicity by incorporating specific visual cues, hierarchies, and delightful shapes that reduce the cognitive effort of users.
The golf pros requested to display the golfers in one row so they could quickly scan for tee time availability while still seeing the different parties in each time slot. The related Cells are attached, and the ones that weren't were separated by 32px. In between the separation is a dotted line to indicate their separateness. This design solution provides apprehension of multiple elements for easier scanning.
The Tee Sheet Manager
With the redesign, the golf pros (the primary users) can efficiently scan the page for available tee times so they can make decisions quickly during a busy week of reservations.
The editing panel is relocated from the sidebar to the top for easier access when golf pros need to make adjustments to reservations.
The sidebar shows the calendar and the stats bookings of a day, giving golf pros the information they need to accomplish their tasks.
Results and Takeaway
The clients were pleased with my redesign and minimalistic approach, and they tested the new UI with their users and were equally delighted with the look and simplicity of use. During this project, I updated my skills in UI design and creating design systems using Figma.