Case study

Website for searching cinemas & movies

Time range
Jul 2024 — Sep 2024

Time for reading
~ 8 min

Tags
new product, desktop, UI/UX

The development of a movie search website that allows customers to find movies playing in cinemas in their area. The release version of this project was significantly altered due to business constraints; however, the original project was designed on a larger scale, making it worth sharing.

Context

Behind the project

The goal of this project was simple — we wanted to leverage our extensive movie database and attract more customers to our booking platform, ultimately increasing the company's revenue.

Why the final version was cut?

This project was originally intended as a way for Cinetixx to generate profit beyond its standard B2B business model. However, the company owner decided not to pursue this additional revenue stream and instead limited the project to enhancing Cinetixx’s SEO.

The goal

The objective was to design a B2C platform that allows users to search for movies playing in nearby cinemas while providing all relevant information, such as cast, crew, and details of cinetixx movie database.

All materials, designs, and insights presented in this case study are the property of createctrl/cinetixx. This work is shared for portfolio purposes only, with the sole intent of demonstrating my role and contributions to the project. No unauthorized use, reproduction, or distribution is permitted.

I created all the necessary wireframes and the initial design system for the new platform, movies.cinetixxx.de, along with its mobile version. The design was primarily created in dark mode; however, it was not included in the final implementation, as well as several options, features and other subpages.

The outcome

Design process

~

Design process ~

Competitive Analysis

I had the COO’s overall vision of this website, and I needed to specify the details. To do so, I check the streaming platforms and movie databases online, to found what functionalities are worth adding.

The analysis focused on aspects such as visual design, functionality, content, user feedback, accessibility, and inclusiveness. While I reviewed numerous of website, the most of inspiration and good practises I saw on Filmweb, Netflix, HBO, PrimeVideo and justwatch.

I analyzed & took note about them, to define the features and functionalities we could implement in our website.

After the research, we created a user persona and combined all of the ideas for our website and ranked them based on their usability and priority. We noted also “how do we see it now” to display the idea we had to the COO.

Ideation

Wireframes

Due to the tight deadline, we moved directly from paper sketches to something between Lo-Fi & HiFi wireframes. We mapped out all the data to be presented and designed both mobile and web versions simultaneously, implementing the color from the cinetixx design system.

Design system

The foundation was derived from the Cinetixx App design system, as it needed to maintain a consistent style. We chose dark mode as the primary color scheme to evoke the ambiance of cinema halls and create a connection to the theatrical experience.

As mentioned earlier, this design didn’t make it to the final version, so a proper design system for dark mode wasn’t developed, nor were handoff or detailed documentation created. Instead, I’ll showcase some of the components designed before the decision was finalized.

Prototype

~

Prototype ~

The final prototype of this version contains most of the subpages, both for desktop and mobile. Although it wasn’t implemented this way, I think it was a good project, showing the possibilities of dark mode in our company, as well as the other paths we can take in future.