Vimeo Video Player

Interaction design, visual design and prototyping, 2012/2013

I started working on the new version of the video player about three months after I started at Vimeo. I was the only designer on the project, working on everything from iconography, to UI animation, to writing the media queries that allow the player to adapt to whatever size in which it finds itself. The team itself was quite small given the size of the project: a project manager, three developers, our VP of Product that oversaw my design work, and myself.

The amount of nuance involved in an embedded video player is staggering: there are an infinite number of sizes at which it can appear, users can remove entire sets of controls, the color of most of the UI can change, and of course, the content is utterly unpredictable. There were never any guarantees about what might or might not happen.

From the outset, it was clear that redesigning Vimeo’s video player was one of the most challenging things I’d ever work on. I spent months iterating on iconography, animation, visual design, interaction design, and front-end development. We launched this January and received high praise from sites like Techcrunch, Gizmodo, and more. All in all, the project was a huge success and an important milestone in my career.

It may not look much different from the player that you remember, but great pains were taken to subtly improve the original design. Corner radii, spacing, iconography, and animation were tweaked endlessly to create a more polished product.
This redesign of the player included one of the most requested features of all time: support for closed captioning and subtitles.
An idea that was ultimately abandoned in the interest of security concerns: inline log-in, right from the embedded player.
Share and Embed screens aren’t anything new, but keeping them feeling like they fit within the Vimeo ecosystem was part of the challenge.