UX Design
Queen's Sport
The Brief
Conduct a Heuristic Evaluation and include the following:
​
-
Introduction - describe what you are going to evaluate
-
Expert heuristic usability and UX analysis - create a table listing issues, principles violated and a severity rating
-
Initial audit thoughts - the things that need to be changed to make a better product
-
Recommendations - create a wireframe, solving one of the issues described
The Product
Queen’s Sport app helps users connect to the Queen’s University Belfast (QUB) Physical Education Centre (PEC) located in the Botanic quarter of the city. In order to make use of PEC facilities, users must purchase a membership online and visit the PEC Admission & Bookings desk on-site to receive their membership number to allow them to log into the Queen’s Sport app.
Once the user has logged into the app, they can make their selection based on the type of activity, date, time, and facility. Users can review bookings they have made by clicking the “Bookings” button on the landing page. To prevent overcrowding the product only allows a certain number of bookings per time slot.
Introduction
This report will look at the usability of the Queen’s Sport app, using the 10 Usability Heuristics for User Interface Design developed by Jakob Nielsen. The severity of each violation is determined by David Travis' "How to prioritise usability problems" decision tree. Based on the findings, this report also offers the author’s recommendations for improving the usability of the product.
Key of Existing App for User Interface Breakdown
Usability Issues Identified During Audit
Design Recommendations
I recommend changing the loading page of the app to give users a sense of control over how long the app will take to load. This is solved by replacing the spinning circle with animated buttons that fill with colour as the page loads. The animation should be paired with text that corresponds to how many circles are filled with colour (e.g., Launching...Just a few seconds… Almost there…). We’ve also helped our users learn the language of the app - throughout the app there are references to “PEC” but no explanation that this acronym means “Physical Education Centre.” The loading page spells this out for the user.
I recommend reorganizing the landing page according to Apple’s principles of Discoverable Design: only show the most important features, and build discoverability into the design. For instance, use words and symbols people are familiar with, use gestures for fluid navigation, group content to fit the user’s behaviour, and convey a sense of control over personalized content. The most important features of this app are 1) Booking activities and 2) Reviewing your bookings. By placing these two most important features at the bottom of the screen “Activities” and “My Bookings” the user will always have easy access to these features. By making the landing page also the Activities page, users waste no time booking activities. The Activities page is designed so that users can easily browse by swiping activities in the top part of the screen. A big frustration in using the app to book activities is there is a limited number of spots for each activity. The Activities page makes it easier for users to quickly and easily rebook recent activities that they have tried.
The icon for the “booked” button corresponds to the icon in “My Bookings.” This page has been simplified by taking out repeating words, and making the times consistent (not switching between the 12 hour and 24 hour clock). The start time and end time for each potential booking are limited to make it clear to the user how long each booking lasts (and removing the need for using extra words like “60 mins” or “1 hr,” etc.) Each potential booking is clearly outlined, and each booking contains a chevron to prompt viewers interested in making a booking to click on it. Note that in the app redesign, the colour red has been used differently. In the redesigned app, red (the hero colour) is only for important functions, in contrast to the current app where the colour red is used to signify when a potential booking is full. This draws unneeded attention to what users cannot book rather than what they can book.
Conclusions
The Queen’s Sport app acts as an activity booking service for the Physical Education Centre (PEC). To make this digital product a satisfying and seamless experience for users, the Queen’s Sport app would benefit greatly from applying Neilsen’s 10 Usability Heuristics for User Interface Design, Travis' decision tree for prioritising usability problems, and Apple’s principles of discoverable design to create a simpler, more consistent, and more engaging platform tailored to the user’s preferences. The current product has a lot of potential to give its users a sense of enjoyment and, in turn, prompt users to build habits that will demonstrate their loyalty to the Queen’s Sport experience.
References
Apple. Transcript: Discoverable Design. Videos. Available from: developer.apple.com/videos/play/wwdc2021/10126/ [Accessed 29 November 2021].
​
Nielsen, J. (2020) 10 Usability Heuristics for User Interface Design. Nielsen Norman Group. Available from: www.nngroup.com/articles/ten-usability-heuristics/ [Accessed 24 November 2021].
​
Travis, D. (2009) How to prioritise usability problems. Userfocus. 5 October 2009. Available from: www.userfocus.co.uk/articles/prioritise.html [Accessed 25 May 2022].