Movie file browser and player for Mac OS

Watchbox is a simple, all-in-one movie application for Mac OS. An ongoing passion project, the product is intended to make watching and browsing movies on a computer a user-friendly experience.

Recognizing the Problem

There were two main issues I'd constantly have when browsing and watching movies. The first was that all my digitally downloaded movies weren't accessible or viewable from a single location, and multiple apps, websites, and players were needed just to own them. The second, was that information, ratings, and reviews were separate from the movies. I didn't understand why browsing and watching movies needed to be so arbitrary, so I tasked myself with creating a solution through an all-in-one movie application.

Multiple services with convoluted interfaces needed to experience a single movie.
App and Website Research

The research for this project was realtively straightforward and more fun than I care to admit. I browsed, studied, and watched many movies on various websites and apps, and took note of the experience and interface of each product. After all, I am a target user so I used these apps and websites in a true sense to gain more knowledge of what works, and what doesn't.

I also conducted interviews, and surveys to learn about what other users like and don't like about their own movie watching experiences. All of the research and feedback came to be extremely valuable in determining the true use of this product.

Goals and Requirements

The big takeaway from my research was that in addition to wanting a simple, all-in-one experience, users want movie watching to be tailored directly to them. For instance, when browsing titles, they would only like to see the types of movies they know they would enjoy. This product was already on the right track as it solely contains movies the user already owns. However, that doesn't entirely solve the issue. I own plenty of movies I don't like. It was this that made me realize the product should give the user complete control over categorization.

After establishing what users want and what the goal of this app should be, the three main product requirements were:

User Flow and Wireframes

The user flow for this product follows the traditional movie browsing narrative. Once a user signs into their account, they are brought to a grid layout of recently added movies. They can then explore there, or toggle the page by navigating to a different browse page. The default browse pages are "Recently added", and "All titles". The custom, user-created browse pages are called 'boxes'. The user will have the ability to create their own box, and add titles specific to their custom category. For instance, a user may create a box called "Space Movies" where they can organize all their movies that take place in outer space. From a browse screen the user will have the option to sort and filter titles using various values.

The next stage in the flow is the creation of a new box, or the player itself. The Watchbox player adds more user value than a traditional movie player because the Rotten Tomatoes ratings are displayed, along with a synopsis, the cast and crew, and other useful information when the movie is paused.

The user flowchart for the entire experience.
Final Design

The user interface features a dark theme and a single accent color to keep things simple. Purple was the color of choice as red and gold are played out for movie apps and websites, and other colors didn't really speak to cinema culture. I wanted the product to feel like an all-in-one movie experience, as well as function like one.

The "Recently added" screen and template for all box pages.
The "Recently added" screen with title hover state.
The active playing screen when the cursor is moved.
The pause screen with informational content.
Establishing the Identity

It took me some time to brainstorm a name suitable for the product, but I knew I wanted it to be one word encapsulating exactly what the product was. I used the all-in-one concept (box), along with the main user-action in the app (watch) and landed on Watchbox.

To match the overall product experience, I wanted to create a simple logo using the same purple used in the interface design. I also wanted it to double as the dock icon. I designed both a primary and alternate for different use cases.

The logo and Mac OS dock icon for Watchbox.
Back to portfolio