Redesigning The Melbourne International Film Festival (MIFF) app
A quick User Experience (UX) and visual design overhaul of the 2017 MIFF app (Android).
Disclaimer: We love MIFF, this is not meant to tread on any toes or big-note, this is purely an exercise to try and make their digital experience a bit better.
Disclaimer II: We have no idea of the scope restraints of the current app which might have been a factor for the current state.
It’s MIFF (Melbourne International Film Festival) time again in Melbourne so I downloaded the app to check out some of the films that would be playing. When I opened the app for the first time, I was a bit lost, I felt the functionality and structure was a little jumbled and the design could be better, especially when you have all the assets of movies at your disposal like film stills and posters. In this post I've outlined some of the problems I found using the current app and designed solutions to help address them.
Sheda uses Design, Artificial Intelligence and technology to solve complex problems with an emphasis on delivering solutions that make and accelerate impact and bring about social change.
As mentioned up top, we have no idea of the budget and constraints it took to create the app but we feel a few design tweaks could really help with the experience.
User onboarding is a pretty common practice for a user visiting the app for the first time. Having an onboarding process helps a
No user onboarding...
User onboarding is a pretty common practice to help a new user visiting the app for the first time. By creating an onboarding process for a first time user, you give the user an overview of some of the main features of your app and guide them into signing up/logging in. Giving them the option to set up their account at the start eliminates a pain point once a user goes to purchase a ticket as they can simply click a button to buy a ticket.
There is no option for logging in/sign up for first time users (onboarding).
Waaaaaaay too many details and fields required.
Create an option to login/sign up in onboarding (mentioned above).
Group, condense or reduce the amount of sign up requirements and fields. For
Categorising and grouping
The app seems to be a bit muddled in terms of
Search option is not visible enough, has too many options, hard to get to and clunky
Hard to find want you
To build a great experience you have to work out what the user wants to do in your app. This is usually done through various UX exercises like user testing and research, however, for this article, we’ll work with assumptions. Some of the high-level categorization include:
Users want to see what’s on today.
Users want to search films or browse by various metrics.
Users want to purchase tickets.
Users want to be able to navigate the app with ease.
Let’s assume when a user first comes to the app (home) they'd be interested in seeing what’s on today, I'd also assume that users would want to view/find films using a faceted search with specific and relevant options like:
What’s on today.
Browse by country and by venue have been excluded just reduce the possibility of the user being overwhelmed by options. This could be added into the redesigned format if user testing suggested that those options were popular.
By adding a secondary sliding navigation we reduce clutter and improve the UX.
Although we mentioned search functionality above, it’s important to highlight the improvements that could be made.
There is no general purpose search bar.
Users have to filter first to search for a film.
Search results are not great, if you don't enter the exact information.
Move to a general high level search bar so users can access at anytime in their journey.
Remove filter and replace with a Typeahead style search. This intuitively gives the user options as they are typing.
From a technology perspective that's something our Engineering team could implement using Elastic Search.
I found a lot of the issues with the app navigation have to do with categorising and grouping. A few items in here link to the website which is fine, however some links display 2 hamburger navigation menus and a filter, that's where it becomes confusing as the experience is not consistent...
With the main items on screen (account, search etc) items down the hierarchy chain can be placed in a side nav. This still has some main items like ‘Plan your night’ which again has the same format (slider nav for venues and dining) as the Home/Films screens.
Ticketing and payment usability -
After selecting a film and choosing to buys a ticket, you then have to manually click the main slide out menu > navigate back to your account > choose checkout and pay for you tickets.
Oooff… That's way too many steps for a mobile app, also if you are not logged in or signed up, you are required to. This is a pretty standard practice for booking tickets, however some frustration could be removed again, by placing a login/sign up option within the onboarding process.
Give the user the ability to purchase tickets on the one screen.
Doesn’t make use of dynamic assets like film stills, actor images or posters.
Incorporate these visuals.
Inconsistency in design.
Once there is structure and order, a design language is much easier to implement.
It's not the prettiest app.
Make it pop, bedazzle, makeover - and other buzzwords.
A great user experience comes from putting the user first which is something we do at Sheda, in this article we've made assumptions on how movie goers would best be served and used this to inform the structure of the MIFF app which feeds into the visual designs.
I hope you enjoyed this as much as we did! If you are a part of MIFF and would like to chat about bringing these designs to life, contact us!
Matt is our Design Lead overseeing the entire process of UX, visual, interaction design and branding. Trained in graphic design, Matt has over 9 years experience designing clean UI, mobile and web applications for various platforms.