Rethink Film Festivals, LMFF

Project for an association preparing a music movie festival with a limited budget. The website will help the user to discover, organize their visit and get practical information during the festival.

My role
User Research
User Experience Design
Interaction Design
Visual Design
Brand Design
Supervisor
Sara Tung
Timeline
3 month
February - May 2022
Tools
Adobe XD
Photoshop
Illustrator
Miro
Figma
My role
User Research
User Experience Design
Interaction Design
Visual Design
Supervisor
Sara Tung
Timeline
3 month
December- February 2022
Tools
Photoshop
Illustrator
Miro
Maze
Figma
My role
User Research
User Experience Design
Interaction Design
Visual Design
Supervisors
Sara Tung and Elina Zhang
Timeline
3 month
May - July 2022
Tools
After Effects
Adobe Aero
Rhinoceros
Unity
Photoshop
Illustrator
Miro
Figma

Overview

Brief
This case study was made as part of the Google UX design certificate. I designed this project to be possibly used by the association of a friend which are planning a movie festival about music with a limited budget.
Approach
My work process followed mainly the design thinking methodology. I started by a competition audit to learn directly about the possibilities of a responsive website and also to be more familiar with the subject. Then the other research helped me to understand the topic and define the design problem. After narrowing down my findings, I determined design objectives. Thus it allowed me to design through sketching, iterating, and user testing.
Outcome
I designed the website for the Lausanne music film festival, which helps the users prepare for their visit and buy tickets on my research and ideation. I also created original illustrations and developed a possible branding. Primary users were thrilled by the website's color and interactions, encouraging them to discover more about the festival and the site itself. They also felt the interface was intuitive.

Competitive audit

I learned why competitors are successful and how they could improve through competitive audit, which also inspires my designs. Check out the complete competitive audit report:

User Research

In order to gain useful data, I conducted secondary research based on existing online resources such as open data given by the federal statistical office and competitor research. Next, I carried out primary research, including an email survey and interviews with users.

Research synthesis

The user research information, including both surveys and interviews, is compiled in an empathy map container. (Amazing sticky note pictures are available on request.)
Following that, the same group of stickers is classified into groups in a mapping activity.
Using this method helps me prepare feedback and material for ideation such as personas and a user journey map.

No items found.

Define-ideation

Problem statement

Sketching

Sketching is essential to my thought process as it helps me conceptualize my abstract ideas quickly in crazy eight sessions, for instance.
I also love to create storyboards to visualize the use of my designs if the context of use is essential.

Information architecture and user-flow

To generate a sitemap based on user needs, I prepared cards based on the competition website's content and the interviews' comments. Then, I organized them depending on what felt useful for the personas and discarded what felt not for them.

No items found.

Wireframes

I started by sketching as it was quicker to iterate on tracing paper. For the home screen, I decided to address the user's core pain points and needs by starting with a hero image that gives them a direct interest in the event and its essential information. Then, quickly summarise what they can expect as services of the websites (ex. Program, ticketing, adaptation to 2 user types) and carefully placed CTA.

Prototypes-Tests

Mid-fi prototype

Guidance Sequence

Navigation

Usability study

I conducted three rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining. The last study used a high-fidelity prototype and a video to define clearly the last changes needed for a good AR experience. The research plan and the KPIs are available on request.

Prototypes-Tests

Mid-fi prototype

Usability study

I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining. The research plan and the KPIs are available on request.

Prototypes-Tests

Mid-fi prototype

Complete a booking.

Use the filter section.

Navigate through the different pages

Usability study

I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining. The research plan and the KPIs are available on request.

Style Guide

Moodboard

Through the interview, different themes were frequent and on that basis, I chose colors, illustration styles and fonts to develop the high fidelity prototype. The images were also chosen based on the experience users will have on the site with the view on the lake and the nature around.

High-fidelity prototype

Log in

Find the filter option

Find the list option

Navigate through the different pages

Follow the guidance sequence

Navigate through the Homepage to select a program

Watch the trailer through the Homepage

Complete easily a transaction

Find information efficiently

Check my prototypes!

High-fidelity prototype in the context

Explore the ruins

High-fidelity prototype

Navigate through the homepage
and select a program.

Watch the trailers.

Complete a transaction

Use the search option

Navigate through the Homepage to select a program

Watch the trailer through the Homepage

Complete easily a transaction

Find information efficiently

Check my prototypes!

High-fidelity prototype

Complete a booking with the map.

Complete a booking with the list.

Use the filters.

Navigate through the different pages.

Check my prototype!

Check my prototype!

Takeaways

Think through all sizes

I learned a lot about adopting a design to different device sizes, which also need thinking about the developer's work later. I also observed that even a slight design change could significantly impact the user experience, such as deleting an unnecessary step or the color of a button.

It was also challenging to learn and design on Adobe XD on an entirely new project. However, it additionally helped to think through alternative approaches when prototyping on Figma.

Don't forget about space and time

I learned how to design an AR app as it implies safety and spatial awareness of the context. It also meant learning different prototype technics such as Wizard of prototyping and videos to test the AR experience.
Finally, to create a great AR user experience, planning and thinking of the experience as a movie with precise timings is essential.

What is the true problem?

The obvious question was at first sight: "how to make art galleries more interesting?" after a few interviews, it became clear that the actual problem was: " how can we find art galleries?".

While designing the Lausart app, I learned a lot about art galleries and the general biases we can have about art.

Interested in working together?
Get in touch.