UX Audit:
MDLBEAST
MDLBEAST, in their own words, is a lifestyle and entertainment experience brand and a global creative platform, setting the tone for music, art and culture in Saudi Arabia and the Middle East.
September 2020
My Role
UX Reviewer
I conducted a UX Audit report on the MDLBEAST website to identify pain points in the user's experience with the site and brand. In this study I reveal problem areas in the user experience and how these lead to missed opportunities in reaching business goals. I also propose solutions to these.
Note - This analysis is based on the site as it appeared in September 2020 and is subject to change.
Who are the Users?
-
EDM fans wanting to learn more about the event / live stream sessions.
-
Interested parties looking to get involved. (DJs, Investors etc.)
Business goals
-
To increase web traffic
-
To get more subscribers
-
To get contact from interested parties/sponsors
Issue #1
Navigation Issue
The menu icons/logos can be confusing for a new user to understand as they all look very similar and therefore hinders navigation.
Suggested Fix:
Provide labels in the menu.
Issue #2
Visibility Issue
The play bar at the top of the Frequencies page is easily missed. I was trying to understand the brand and what Frequencies was about. I saw the schedule but I didn’t know where to go from here to listen to the music. Several times I bounced off the page before returning to see the play button.
Suggested Fix:
Use a different colour or create more contrast to draw attention to the play bar. Alternatively use a CTA button or some copywriting to guide users.
Issue #3
Repeated Menus
The Media House page contains a lot of content mostly grouped by menus in the header section of the page. The issue here is that there is a lot of repetition, with three different menus showing similar sections. On the top left we have a hamburger menu showing 'private content' as an option for the user to navigate to. Yet, this is also present in the main header menu and again in the Profile/Sign UP menu on the top right of the page.
Suggested Fix:
Group pages into one menu only and keep the Profile / sign up menu on the right. Another suggestion would be to use some copywriting or CTA to encourage users to sign up to be able to view private content. This would create a feeling of 'exclusivity' that will encourage more users to subscribe and thus allowing the company to meet their business goal.
Issue #4
No clear Call-To-Action (CTA)
When you enter the MDLBEAST XP page the user is presented with information about the program, however there is no direct CTA for people who want to get involved. Users need to scroll down the page, and not get distracted by the images in the gallery before being given the option to subscribe. And even then it is unclear what happens next. There should be a CTA allowing users to contact the company for more information. This is a missed opportunity in getting more interested parties involved.
Suggested Fix:
Use good copywriting and present a CTA for users to join or message before having to scroll down the page.
Issue #5
Page missing
The FAQ page, accessed by navigating to the bottom of the landing page, is missing.
Suggested Fix:
Add content or remove the page.
Issue #6
Content Clutter
The Contact Us page is too busy. The elements seem to be scattered all over the page, making it incoherent and difficult to follow. It should be simple, clear and following the goal to get users to send a message or contact the company.
Suggested Fix:
Re-design the layout following known design principles and pay attention to fonts and characters used to display hierarchy and cohesiveness.
Issue #7
Brand Inconsistencies
While interacting with the website I noticed several inconsistencies with the MDLEBEAST brand. This is a problem because it creates confusion and users may struggle to connect with the brand, which in turn can affect the number of new subscribers. Let's take a look at some of the branding issues below.
Firstly, I noticed that the way the word 'MDLBEAST' is written differs in certain context. As a logo it has a particular style, where MDL is written in thin font and BEAST is much bolder. If this is part of the logo then the word needs to appear in the same style in all context. Some may argue that this is a minor issue and not necessary to affect brand recognition. Still it may be worth reviewing.
Next, let's take a look at these logos/icons on the left. They all look very similar and it took me some time and a lot of bouncing between pages to understand that each represents a piece of the MDLBEAST brand.
To make matters even more puzzling there's FREQWAYS and MDLBEAST Frequencies, which are two different things. This and all the different logos make the brand very confusing for a new user. Research suggests that the average user spends less than a minute on a web page and will read on average 20% of its content. So it is critical that the brand is easily understood within the early stages of the user's journey.
Suggested Fix:
Develop brand guidelines to ensure the brand aligns with business goals and is communicated consistently across all channels.. Besides the visual guidelines also ensure that all employees understand the tone and language of the brand, so that it is an integral part of the company culture. Regularly check the site for inconsistencies and make the necessary adjustments. Finally, think of ways to simplify the message you want to portray and remove or re-design logos/icons that cause confusion and high bounce rates.
Conclusion
-
Provide clear navigation labels in the menu and use simple icons that are easily understood.
-
Most users will enter the site to live-stream their favourite DJ's, so it's important that they can navigate to the play bar easily. Ensure this by using effective call-to-actions, copywriting and improve the visibility of the play bar by using high contrast colours.
-
Create an 'exclusivity' club to attract users to subscribe in order to view private content.
-
Reduce content clutter by neatly grouping similar content into one menu.
-
CTAs should be simple, clear and visible before the user scrolls down the page.
-
Remove or edit any missing pages.
-
Develop brand guidelines and ensure the tone and personality of the brand is consistent across all channels to build strong brand recognition.
-
Finally, simplify the user experience. The user should not have to spend a lot of time trying to understand what your brand is about. Even if this means re-designing visual elements or re-organizing content. Always ensure that your design decisions align with your business goals and meet the user's needs.