The Reel

A Video Resume of Sorts

Can we just skip the interview?

The primary idea behind this project was to encompass my paper resume into a short motion graphics video. In other words, I wanted to show each of my skills on screen without setting up a camera behind my back. I know, Mograph reels are nothing new. This project was created to show all of my skill sets, rather than just motion graphics. I have seen many inspiring reels in my time, but none that really illustrated the beauty and complexity of code in my eyes. I set out to do just that.

  • Wireframing

    I’m a huge proponent of wireframing and thinking before doing. It’s very important that I draw out a framework of the website/app before I start designing or building. After all, would a film be green-lit without a script? It’s the same thing. I believe people like to see the process of how wireframes take shape and eventually form a website.

  • Code Is Beautiful

    I’ve always wondered why TV shows and movies dramatize coding or hacking in some way. They usually do this by giving it some sort of cheesy user interface. To me, code is beautiful! I take pride in my process and IDE (I use Coda by the way – say what you will). With this project, I wanted to reveal my style, inspiration, and interests (ergo, the David Fincher-style close-up sweeping shots).

  • Giving It Life

    After showing the building and wireframing, I thought it’d be appropriate to showcase my motion graphics techniques. What better way to show this then to screen-record myself and fast-forward the magic?

The Road Was a Long and Arduous One

I'll die before I have to do another screen recording again

This project took over a year to complete; it was the most time-consuming project I’ve worked on by far. Countless hours were spent, many coffees were drank, numerous lives were lost. Just kidding about the last one. Besides all that, the first obstacle was figuring how this thing was going to look.

The look I was searching for was inspired by Edison’s many patent drawings from 1882, hence, the light bulb that appears in the beginning of the animation sequence. I’ve always liked the look of old blueprints and figures pertaining to primitive technology. It has always fascinated me due to my dedication for planning out ideas. It was only natural to use these antiquated drawings as inspiration for the wireframing sequences.

See video at 0:05

From there, it only felt right to transition into my development environment. All those shapes have to turn into code sometime, right? It was important to me that I show the whole nitty gritty process from the beginning. Code is beautiful in my eyes, so it’s only appropriate that the viewer gets intimate with it in the video. The extreme close-up shots of the command line and my text editor are exact recreations of my real environment. To show you this, I couldn’t solely film my computer screen. The shots of the code you see in the video were also mographs.

See video at 0:25

With this unique style, I was able to juxtapose my motion graphics skills with my web development knowledge. However, I also wanted to highlight my motion editing capabilities. Again, the aim here was to give the viewer a first person view of my actual process. From finding a good song on Rdio (RIP Rdio), to designing something in Photoshop, then manipulating the layers in Motion, each step of my process is revealed in this project.

See video at 0:39

If I Could Do It All Over Again

There's always room for criticism

My vision for the rest of the video was easy enough: show all of my previous motion graphics work. In retrospect, the part that lacks the most substance in my eyes is the amateur film work I included at the end. I’ve always dreamed of being in the film industry. As time went on, however, the dream diminished further into limbo to make room for my software development passion. Hey, things change. After all, my independent filmmaking career was not going to pay the bills. Despite that, it’s still a big part of who I am.