As the killer in MTV’s recent Scream series or the web crawler in Spider-Man: Web of Shadows, actor Mike Vaughn is a Hollywood face that you might not necessarily recognize. But his voice is one you can’t forget.
And he’s versatile…able to play a serious character in J. Edgar or yuck it up in a comedy classic like Zombie Strippers.
During an extensive discovery session, Mike expressed how he was constantly balancing humor with his serious side. Playing different characters is Mike’s passion, whether he’s acting on-camera or performing countless commercial voiceovers.
Our goal in bringing his website to life was to reveal the many personas of Mike Vaughn.
We brainstormed and came up with the idea of using a sequence of photos of Mike as the background of the site. Taking inspiration from Fight Club and Max Headroom, we wanted the photos to blend in a glitchy sequence as they switched from one to another to show his range.
After concepting the layout of the site, we arranged and choreographed a photo shoot, with Mike changing outfits and looks. Originally the plan was to use video of Mike, but because of mobile website limitations, a series of continuous photos were edited as an image sequence instead.
We directed the shooting of hundreds photos of Mike in his different outfits. Sequences were imported into Adobe After Effects, where the coloring and banding effects were applied. Pixel-morphing and video static effects were then added to the transitions and re-exported as another image sequence.
This sequence (now 800-plus images including the in-between and morphing frames) was brought into Adobe Photoshop and saved as a GIF. We encountered a few problems with this method: GIFs become huge in file size at large dimensions and we needed this to cover an entire background on all devices, including retina displays. Another issue was an increase in GIF length and colors to accommodate all the colors of a photo, which increases file size. This would not work for load-time reasons across most devices.
The video was put in as the background for large screen sizes with autoplay and a custom script, written in jQuery and coded for mobile devices.
The script needed to use methods that modern browsers understand, and cycle through all the images and randomly grab an assortment of them. With this assortment, it would display each, as the background, for a fraction of a second and then switch to the next, mimicking a GIF sequence or video playback but only using images. Every time the page loads, this sequence changes and will always display a different set of images randomly.
The result is a completely unique look for the responsive website that makes Mike stand out in agent’s and casting director’s minds—and become a face to remember.
–Mike Vaughn, Actor
