Context

The client is an art-house cinema owner who was looking for a rebranding of their website. They wanted something fresh and modern, but still in phase with their audience. The initial intention was to give it a bit of a refresh. However, I took it one step further as to propose a new feature they hadn’t thought of.

Outcomes

I had a week to redesign Cinemax’s website and present the new layout and features. At the end of the five working days, I had:

  1. Validated the moodboard with the client (four versions proposed);
  2. Created the style guide that would be used on the entire website;
  3. Proposed a feature that wasn’t on the original wireframes.

My role

I was the main UI designer on this project, communicating directly with the client.

Skills and tools used

  • Mood board
  • Style Guide
  • Information Architecture
  • Wireframes
  • UI Design
  • Figma

Duration

One week

three phone screens showing off the mobile version of cinemax, with movie posters displayed

The process

1. Research

I studied the websites of at least five competitors to get a sense of what I should be aiming at, then created four mood boards (images, typographies and colour palettes). I presented the mood boards to the client, who picked one, and quickly sketched a style tile so he would have a sense of what their website could look like.

2. Define

As we agreed on the style, I redesigned their homepage and created a guide after they validated it. With that style guide, everyone who worked on the site knew how to implement the typographies and colours throughout the website. I also added a set of icons, buttons and more.

3. Design

Walking through the wireframes, I had another vision for their booking system and proposed a “like” feature. I learned to manage my expectations, as well as my client’s. In the end, I presented them with a newly redesigned homepage, booking system, movie page and subscription page, which I had iterated multiple times according to feedback.

style guide of the cinemax project with typography titles viewports and colors
focus on one main screen of the cinemax project, which is the specific movie page

What I’d do differently if I had more time

UI Design isn’t simply about having a good-looking interface. Even though the client’s feedback is very important to the design process, here’s what I would do if I had more time:

  • Include the user in the design process by conducting interviews each step of the way. It could have been a nice way to engage with the client’s audience to make them choose their favourite mood board, for example;
  • Conduct user testing on the new booking system and “like” feature, as the feedback received was of the client;
  • Review the navigation of the website more in depth to provide more value to the client.

Do you want to see more examples of great work?

Discover how I designed an app for self-published authors.