.png)
Home cinema applications and services have come a long way these last few years. The ease that platforms like Netflix, HULU and HBO Plus have brought to the consumer have led to probably one of the biggest shifts in the entertainment business in the last decade. But as these applications have iterated and innovated, the other side of the movie business, the cinema's , seemed to have stood still in this area. In this design challenge I wanted to give myself the task of improving on the biggest cinema App out there: Pathé.
On this project i wanted to focus on the three main things that i think could be improved on in the Pathé App:
Messy categorisation of content
The current version of the App has categorised it’s features and content into three main tabs: Home, Movies, Times and Other Settings. Where the problem arises is that there seems to be a lot of overlap of content and features in the ‘Home’ and ‘Movies’ tab, which makes it unclear (especially for first time users) where they can find what content. Also; calling the ‘Times’ tab ‘Times’ seems confusing and doesn’t fully explain what it actually shows you: What movies are being played at what times in what cinema’s.
Poorly placed navigation
Today’s phones are a lot taller than they used to be a couple of years ago. It is this why Apps have shifted the placement of it’s navigation from the top of the screen to the bottom (because it’s easier to reach with your fingers). This version of the Pathé, however, seems to not have made that shift yet. This will be an easy improvement to make in the app.
Lack of overall quality and feel
The current version of the app has an outdated visual style and feel to it. The sizing and layout of certain design elements seem to be made for older devices and the visual style doesn't look very coherent.
One of the more obvious and simple things to improve was the structure of the App. The Pathé App has a vague segmentation of content and features. By making clear a distinction between the pages and laying them out in a sitemap I laid out the groundworks for an App that has more easy and sensible navigation.
To design a more coherent and visually pleasing App I started working on a design system before making the actual screens. This way of working is called ‘Atomic Design’ and it basically means that every bigger element is made out of smaller design elements. This way I can build the App and keep the visual design language always consistent which makes it easier for the user to learn.
Down here is a demo video of the final prototype. The prototype itself is made in Figma and the video is put together in After Effects.
If you want to click through to prototype yourself, you can click here.
.png)
.png){kind=small}