Why Should I Learn to Code?

Many people, including the President, are pushing people to learn to code. I think it’s a great idea, but sometimes the reason to start is lost. It’s useful beyond just being a pathway to a full-time job.

I’m going to go through one of the many reasons and an example of why you should learn. Coding saves you time. I love to build things and this is pretty important because sometimes the decision on whether to make something is dependent on how much time you think it’ll take to create it.

A few months ago, I had an idea. Jon Stewart has spent the last 16 years on TV (and I’ve watched a solid chunk of it). It’s unusual for someone to have so much of their life recorded, so I wanted to make a time-lapse of him through every year of The Daily Show.

At first I thought, I’ll just go through each episode, take a screenshot, align his face and move on to create a movie. However, once I started doing it, I realized how long it would take. He has done over 2,500 episodes. If I spent 2 minutes a frame, it would take over 80 hours to create the video. In reality, I was spending even longer than 2 minutes lining up each frame, resizing, taking screenshots, etc.

Developers, like most people, hate inefficiency. What I was doing was incredibly inefficient. I also didn’t want to spend the next few months of free time on it.

Luckily for me, Comedy Central has every Daily Show online. Below are the steps I took to go from that to a completed video. I’m going to go through the steps I took and make them easy enough for anyone to follow and understand. If you just want to see the code, go here.

The first step for creating anything is to clearly define what you want to do. I defined this project as: I want one photo from each episode of The Daily Show. Each photo would show Jon facing the camera (so I can align them all). Usually programming emulates what you would do manually (Get the images, align them, make the video).

Get The Images

There’s always an easy way and a hard way. The hard way would be to download each video, pick a spot in the video, analyze it to see if Jon is in it, and save the image. I was dreading this. Luckily, Comedy Central did most of the work for me. They included several thumbnails of each episode online for browsing the videos. They also decided to use a very similar format for every single image URL. That’s a perfect recipe for writing some code to download them all.

An example of the URL (which I got by right clicking on the image and copying the URL) is:

http://3.images.comedycentral.com/images/shows/tds/videos/season_20/20119/ds_20_119_01.jpg?quality=0.85&width=360&height=202&crop=true

This is heaven to a developer, because it’s easy to read and easy to change. If they wanted to make things difficult, they could have made every URL have a different format or be hard to read (the reality was there were some slight variations through the seasons, but not too many). They were even nice enough to give me variables to change the size of the thumbnail and quality!

That URL is for season 20, episode 119. The 01 could also be changed for other screenshots (02, 03, 04, etc…). By just changing any of these numbers, I could get all the other episodes for a season. Try it yourself, just copy the URL and change a number and see the result.

I’m not going to dive into explaining the code, but it’s fairly easy. For each season, go through all the episode numbers, create the URL, and see if it exists. If it does, download it and if it doesn’t, alert me. Usually the alerts just meant I had to make a subtle change to the URL.

After I wrote the script, it took me about 3 hours to get all the images. So I’ve cut down the job from 80 to 3 hours. Perfect, more time to browse some of my favorite subreddits.

Align the Images

Another long and inefficient task would be to open each image in Photoshop and align it to the one before.

Remember when I said programmers don’t like inefficiency? Part of that is trying to not write everything from scratch. We leverage pieces of code (called libraries) that other (and smarter) people wrote that we can also use.

To align the images, I needed to figure out where Jon’s face was in each image and automatically align it. Face detection is a hard problem in Computer Science (Computers are awful at pattern matching, but amazing at number crunching. Humans are the reverse.). But since it’s something a lot of companies need, there’s been a lot of research and some really impressive progress in finding faces.

There’s a new library that just came out and you may have heard of it recently. Microsoft released an API that helps with all types of facial recognition tasks. They released a demo of it that tries to guess your age.

APIs usually look like URLs that are easy to read. Microsoft’s looks like this:

https://api.projectoxford.ai/face/v0/detections?analyzesFaceLandmarks=true&subscription-key=MYKEY

This just asks Microsoft, detect where the face is in the photo I’m sending you and give me back the data. As an example, when I ran it on this image, I got back a lot of data, but most importantly, this:

'faceRectangle': {'width': 167, 'top': 137, 'height': 167, 'left': 688}

This is a data format called JSON. It’s great because it’s really easy to read. It’s defining the 4 points needed to draw a rectangle right where Jon’s face is located. If you take the image and go 688 pixels to the left and 137 pixels down, then draw a rectangle that is 167 pixels wide and 167 pixels high, you will have drawn it right over Jon’s face.

That’s all the information needed. Now I can write a bit of code that takes the rectangle for the next frame and aligns it to this rectangle. I did this by using a library called PIL (Python Image Library) which allows me to programmatically resize images and save them.

Make the Video

Now I have all the data I need. I have all the images and they’re all aligned. I just need to take all the photos and turn it into a video.

Again, turning to the smarter people out there, there is a tool that does this and it’s called ffmpeg. It’s an incredibly powerful tool that can do all types of tasks with video. All I need to do is just run one command, which is:

ffmpeg -f image2 -framerate 20 -pattern_type sequence -start_number 0 -r 20 -i image_%04d.jpg -s 1280x720 -vcodec libx264 -b 5000k video.mp4

By running that, it’ll convert all the images into a video. Each part tells ffmpeg to do something specific (like defining the frame rate, the format that all the images are saved as (e.g. image_0001.jpg), the size, etc…).

You may say, I have no way of figuring out the proper incantation, but for every developer, Google is your best friend. I found that line and modified it for my own use.

So that’s it. I successfully made what I wanted to make and it took me a few hours instead of days of work. I hope you enjoy it and start coding!

You can browse the code I used to do it. Fair warning though, it’s a bit rough around the edges, but it’s all there.

Bonus

A funny thing happened when I got to season 3. Even though Comedy Central doesn’t post them online, I was able to get thumbnails of Craig Kilborn hosting The Daily Show. So coding also sometimes reveals things that you would otherwise never see.