Videotheque
.svg)
UX Designer
Miro, Optimal Workshop, Sketch, InVision
In a world of instant gratification, Videotheque, a movie rental store that specializes in rare, niche, and hard to find DVDs and Blu-Rays, has become a last bastion of the in-store rental experience. As L.A. County’s premier independent cinema stop, they boast an eclectic movie catalog filled with rare movies, foreign cinema, and even new releases. As a business that exclusively operates through their brick and mortar shop, their web presence had been steadily growing stale and dated. In its current state, Videotheque's online database was a mess and jumble of mismatched tags and broken links.
I had the task of designing the information architecture
This was a speculative redesign made for General Assembly’s UX Design Immersive course. My goal was to provide users a balance of the classic in-store browsing experience and the convenience of modern platforms through the Videotheque website.
Understanding The Challenge
In order to provide a solution, we must first understand the problem. The first step was to speak with movie-lovers and find out what they wanted. After conducting user interviews, I was able to extroplate key insights:
- Customers browse visually first
- Customers value simplicity and convenience
- Customers desire making informed decisions
Taking everything I learned from my user interviews, I created a proto-persona to serve as an anchor point for all design decisions moving forward. It includes user needs, goals, pain points, and behaviors.
Designing The Right Things
To dig a little deeper, I took Elaine through the experience of browsing for movies on Videotheque’s current website. The navigation bar was for information only and did not actually aid users in navigating the current site. When browsing for movies, Elaine immediately encountered a wall of 1800+ categories names like “0” and “Needs Replace”. I immediately identified this as an opportunity to improve Elaine’s experience. I began to ask myself: how might I make the browsing experience simpler and more convenient for Elaine?
Another opportunity revealed itself in the individual movie pages. While the page may have provided the business with cataloguing information, there was nothing here that would directly help Elaine decide on whether she wanted the movie or not. Referring back to the persona, I knew that this page needed more information and more visuals.
The biggest opportunity for improvement was the lack of an online reservation process. Even though the prices for membership were listed online, there was no way for Elaine to reserve her movies without going into the physical store!
Conducting a card sort revealed some insights about how users categorize movies. Working with an inventory of 50 movies, users naturally categorized movies into one of 3 main categories: Genre, Eras, and Regions. This provided crucial guidance on how to design a better browsing experience.
Website design and development for Prisma
Through my org research, I found that Videotheque prides itself on being passionate about their eclectic movie selection. To match their energy, I chose an exciting and passionate red color as the main accent color. The vibrance and boldness meets both Elaine’s and Business identity.
I chose a font called JeanLuc, which is named after the famed French New Wave director. This choice aims to pay homage to the Videotheque catalog.
The new homepage also includes a movie poster wall with hover-states that show the film titles. This is a quick and easy way for visitors to immediately start browsing using a system familiar to anyone who uses a major streaming platform.
Through the card sorts that I conducted, I found that users think of movies in 3 main categories: genres, eras, and regions. Since every film should have these categories in their individual descriptions, it should be easy to provide Elaine with different ways to browse. The dropdown navigation menu reflects these insights.
Through the card sorts that I conducted, I found that users think of movies in 3 main categories: genres, eras, and regions. Since every film should have these categories in their individual descriptions, it should be easy to provide Elaine with different ways to browse. The dropdown navigation menu reflects these insights.
Restoring the information pages, as well as including additional information such as synopsis, MPAA rating, and starring actors. An “Add To Bag” button was added to initiate the online reservation process.
The physical store is still open for business. However, there are restrictions on the number of people allowed in the store at a time, which also means a set time limit for each customer's browsing time. Scroll down to the gallery to check out a contactless reservation and payment option that meets both business and customer needs.
This project was an great exercise in Information Architecture.
Project Gallery
projects
