Carlin Eloff's profile

Redesigning a user-experience

The Virgin Active South Africa app claims to help members manage their fitness activities and group activity bookings, set fitness goals and participate in nationwide challenges. 

I identified problematic screens along with some arduous user flows. It has to be noted that the user flows are based on my own individual relationship with the product, I am a daily user myself. I also read through reviews on App Store and Google Play - the app has a 2.2/5 rating from 142 ratings on App Store and a 2.8/5 rating from 1,106 ratings on Google Play. Along with that I had some informal discussions amongst my peers. 

Please note, this is a conceptual exploration of Virgin Active South Africa app. This case study is based on my own assumptions and speculations. I was not employed by Virgin Active. 

I approached this project as if I was briefed to improve the overall  experience, whilst keeping the underlying structure of the app to accommodate time and budget constraints.
Brand Disconnect

There is a disconnect between the app’s creative direction and other Virgin Active brand touch-points such as marketing websites, social media, brand collateral and the in-gym interiors. These often employ minimalist design elements evident in the use of white space, shorter, bold headlines and limited but impactful use of photographs.

Conversely, the app showcases an overuse of dark overlays, clunky icons  with no real contribution to fluid navigation. Besides being an ineffective choice of layout, the grid used on the landing page is not evident elsewhere in the core brand 
The app is an unsuccessful representation of the Virgin Active brand. I believe my approach aligns more clearly with the global brand identity.

First impressions

The landing page is where user expectations for the entire in-app experience is set. The landing page’s content lacks hierarchy and clarity. The page structure does not lend itself well to aiding in presumably important tasks or presenting users with useful features. 
Also, the landing lacks in useful information. For instance, a user who wants to join a new class would have to visit Virgin Active’s marketing site to explore class offerings. There seems to be limited value proposition for existing members. The app is presumably the main digital touch point for members (besides social media perhaps) and an important tool in maintaining existing customers.

The landing page

➔ I created a solid page structure by consolidating appropriate content into logical, digestible sections.

➔ Using bold titled sections, a familiar design pattern, reinforces hierarchy and enables a user to skim through and find relevant information quicker.

➔ Making use of contextual words and phrases like ’Today’ as a page title creates a relationship with the real world, making system information appear more natural and familiar. 

➔ Users can swipe through different class offerings with accompanying imagery - I pulled this from the marketing site.

➔ Displaying goal progression on the landing page makes it more likely that the user will actualise their goal and find use in this feature - in turn making data capturing more likely.

➔ Pressing on a class takes the user to a detailed page. (which does not exist in the current system). The page presents information that would be especially useful to a new user. The objective of this page to market the value in attending different classes and familiarising the user with an otherwise intimidating concept (I am presuming that people may feel intimidated by group activity).​​​​​​​
Scrolling further down...

➔ I treated the landing page as a dashboard, populating it with an incoming flow of regularly updated information. Showing users relevant, actionable information increases the likelihood of them returning.

➔ A USP is the ability for users to take part in monthly challenges. This feature is referenced in marketing material and across Virgin Active South Africa’s social media accounts. I still have not found a way to access this feature. I added this feature as a section on the landing page

➔ In addition, there are ‘hidden’ features with the potential to increase app engagement. An example of this is the activity feed. I redesigned this feature and displayed the most recents activities on the landing page.
This redesign is an attempt to improve on execution of an existing system, not a major audit by any means. To keep this case study at an appropriate length, I have isolated two tasks I deem to be high level.

Booking a class

➔ The booking process is not particularly difficult, however the experience is lack lustre and presents a few frustrations. 

➔ The UI is cluttered with filter options, which can only be applied one at a time.

➔ I removed the filter by date, seeing as the classes can be booked a max of 7 days in advance - 7 days can be scrolled through with comfort. 

➔ I also removed ‘filter by instructor’ since on average, one type of class is allocated to one instructor. A worthwhile trade off for an improved UI.

➔ Another annoyance is that the UI does not inform users which classes have reached its booking limit right off the bat. 

➔ Clicking on ‘Book Now’ takes the user to an ‘Event Details’ screen. I would rather make the class name clickable for an event details overlay and have the booking action take place instantly on the same screen.

➔ I intend for the calendar component to have a fixed positioning and when scrolling down the page, the picker automatically jumps to the correct date.

Setting and viewing your goals

The goal setting feature is fine in concept however the process can be greatly simplified and the data can be delivered in a clearer way.

➔ I consolidated the 4 screen goal setting process into a single screen. 

➔ I removed the stepper - the use of a stepper in my opinion is best used when their are multiple data inputs per step. In this case there are only 3 inputs that can easily be displayed on one page.

➔ I enabled the creation of additional goals. At the moment only one goal can be displayed at any given time. I can imagine that a user might want to set more than one goal with different parameters, for instance.

➔ Lastly, the goal should be easy to digest seeing as the metrics used to create the goal are few and straightforward. But there is no immediate context for most of the content. The goal completion pace is a number within a bar - which make little sense. I kept the users goal progression bar with a percentage metric instead.
​​​​​​​
👋
Thank you for reading!
Redesigning a user-experience
Published:

Redesigning a user-experience

This is a case study to my approach in improving an app with a number of pain points (and a significant user-base).

Published:

Tools