Letterboxd — A UX Case Study

Introduction

Letterboxd is a social platform for movie lovers: It allows users to log, rate, review, and share their thoughts on films. This student project was completed within a 6 week sprint, from mid October to early December as a part of Design Interactive’s 2024 Fall Cohort. Our redesign focused on improving the social aspect of the app, intending to find a solution to HMW we improve the social features of Letterboxd in order to promote interactivity within the film community? Through our research and analysis, we decided to implement a new chatbot and watch party feature to Letterboxd to facilitate more interaction between movie lovers while also redesigning current pages to highlight user reviews and exhibit a more social media-esque platform.

Awarded: Best Visual Design & Interaction Design

Responsibilities & Timeline

Week 1: User Research assigned to Deepa
Week 2: Ideation + LowFis assigned to Adam
Week 3 + 4: MidFis + User Testing assigned to Sammy
Week 5: HiFi Prototyping assigned to Trung

Research

We decided to make our target audience movie lovers so that way we could focus on improving the app for existing users while also adding features to bring in new users. In our survey, we learned that engaging with others about films was a motivation for users to watch new movies, and these were the main reasons that each demographic would interact with each other about movies. For non Letterboxd users, it was to seek recommendations, find like-minded friends, and learn from other people’s perspectives on a film. The most common answers from Letterboxd users were seeking recommendations and staying updated with current trends. We also found that 91 percent of non-Letterboxd users watch movies with their friends, giving us more evidence that we should focus on social features.

We also conducted user interviews with letterboxd users for a deeper understanding of what to improve in the platform. We learned that funny reviews were one of the main reasons that people used letterboxd, and many of the other problems were related to the social aspect as well. Only a few concerns were expressed about the aesthetics and navigation of the app. Our competitive analysis of tv-watching platforms such as RottenTomatoes and Anilist as well as social platforms like Instagram allowed us to ideate features to include in our redesign.

Ideation

From our user research, we created affinity mapping from the data we collected and found points regarding the efficiency of the app, confusing navigation, visual aesthetic, and personalization. We also ideated to improve the social aspect where people were interested in ways to engage with those that share similar opinions. From there we brainstormed different features and design ideas to incorporate and tackle these ideas.

We also created lofi’s to first improve the visual aspect and navigation. We still were not able to narrow down our HMW to one focus at this point, and so even though we wanted to improve the social feature, we still had some change in accessibility and navigation due to our broader ideation.

Mid-Fi’s and User Testing

From our HMW’s and lo-fi’s, we began designing our mid-fidelity prototypes to better visualize user interactions and test functionality. With our mid-fi’s, we conducted our first round of usability testing to validate our designs and identify key areas of improvement. Through our user testing, we identified three main takeaways:
Inconsistent visual design
Our mid-fidelity prototypes lacked visual consistency, causing each page to feel disconnected from both the overall app and from one another. This lack of cohesion impacted the overall user experience and immersion.
Confusing Navigation
Users pointed out difficulties navigating between tabs and finding clear direction within the app. This highlighted the need for a more intuitive and streamlined navigation system.
Unappealing Visual Aesthetics in Chatbot
The chatbot feature, which was a new social feature we wanted to implement into Letterboxd, was not visually engaging. Users felt discouraged from using it, which was a significant concern as we aimed to excite Letterboxd users about new features we were implementing.

After synthesizing our findings from user testing, we focused on three key areas for improvement.
Developing a Clear User Flow
To address navigation issues, we returned to our FigJam and mapped out a clear and logical user flow throughout the app by building an informational architecture map. This ensured we knew each pathway users can take and move between sections.
Defining a Consistent Design System
We established a cohesive design system to apply consistently across all frames. This included following Letterboxd’s current architecture of spacing, typography, and coloring. This step allowed us to ensure visual harmony in creating a unified app experience.
Cleaning up Chatbot
We returned to the Chatbot ideation and thought critically about how we can incorporate fun into this feature. We played around with visual engagement within the functionality to promote excitement with users.

From these challenges, we refined our prototypes and laid a stronger groundwork for the high-fidelity designs and testing.

Hi-Fi Design

For the hi-fi prototype of Letterboxd, I focused on preserving the integrity of its existing design system by adhering to its typography, color palette, and interaction patterns. Using a fluid prototype, I introduced smooth transitions and micro-interactions to enhance usability while maintaining consistency with Letterboxd’s visual identity. This approach ensured a polished, intuitive experience that felt natural and cohesive without making major changes to the established design.

New Features

• Watch Party
• Letterbot

Redesigned Existing Pages

• Home Page
• Activity Page
• Profile Page
• Movie Page
• Search Page

Presentation Day

On presentation day, we were all a little nervous, but able to still present effectively and showcase our project. We received a lot of positive feedback from the judges, especially regarding our unique prototype and visuals. Some areas to improve would have been standardizing our design system more as there were some inconsistencies, and focusing more on the social aspect.

Challenges

The biggest challenge we faced was narrowing down our ideas and focusing on our HMW. We had so many ideas and features to incorporate that we lost focus of the social feature for some parts of our project.

Next Steps

The next steps would be to add shared list and saved list features, and improve the chatbot to include movie gifs and posters to add more personalization. We would also want to have users add a favorite actors/actresses/directors section to their profile.