I noticed as I was drawing this week's Mount Saint Awesome comic that I draw myself sitting at a desk, in front of a computer quite a bit. This is probably because I am sitting at a desk, in front of a computer quite a bit. It's an occupational hazard.
As I've drawn this scene several times over the history of the comic, I thought it would be interesting to put them all together in chronological order and watch my art progress (even if I'm still in the same place).
Without further ado, I present... Me Sitting In Front of a Computer!
Huh... I spent a lot of time goofing off on the computer...
On Saturday night (2pm - 2am) I went to a Hackjam put on by Hackers@Berkeley. I hadn't done any large scale tech build thing like this since college (probably almost 6 years ago) so I just wanted to show up, meet some people, and learn some stuff. The last time I was really learning/hacking with new stuff PHP was the default web language, Ruby on Rails was the new hotness, and Google was a privately held company who's only commonly used product was a search engine, so I felt a little out of touch with what people were working with today. I learned that there were a lot of things that I didn't know much about and it really gave me some good technologies to look at.
Node.js (+ NowJS)
I've heard people talking quite a bit about Node.js for a while, but I didn't really understand what it was. I was encouraged by some people I was working with to look at it and learn a bit more. A few hours later I had installed it, and built my first client and server. Basically Node.js allows you to use JavaScript as both a client scripting language and a server side language (it powers everything on Goggle's V8 JavaScript engine, so everything runs nice and fast). What was really cool was building an asynchronous chat client using the NowJS plugin (written by some people from Berkeley!). This tool lets the node.js client(s) and server share the same application in real time. I started writing a small chatbot and got something sort of working by the time the Hackjam was over.
Bootstrap (by Twitter)
Wow. How have I not been using layout tool kits all this time? Bootstrap basically makes building website layouts and designs simple with some CSS and HTML to building page grids, form styles, validation, pagination, and a whole bunch of other stuff that I'm sick of writing from scratch all the time. This will be used for A LOT of my projects in the future.
Git (and GitHub)
I'm sort of embarrassed to say that I'd never used Git until Saturday night. I've used svn for some version control in the past and even used Google Code to setup repositories for projects, but GitHub seems to have a HUGE community of developers. It really seems worth using. I think I get the basics of Git now and I'll be using it for versioning in some of my upcoming projects.
I suppose it's better late than never for these things. I'm glad I went to the Hackjam and now I have a bunch of new stuff that I want to play with!
[note: This was originally written for my just as a note to myself about what I learned for my own "Input Coffee" productivity blog but I thought other people might be interested in this stuff, so this is a bit of a cross-post]
I am probably more pleased with the title of this post than I should be. Douglas Hofstadter, if you're reading this please consider using it as a title to your autobiography.
Anyways! The real point of this post is to talk about what I've been doing to help myself get things done. I've tried to make the focus of this blog about my work with CS, art, and music. I try to post things that I think other people might actually be interested in, but in order to produce those things I need to do a lot of everyday work that's probably not as engaging. BUT! I've found that it really helps me to write about the work I'm doing, even if it's not that interesting to read about. If I'm learning something new, it helps to write what I've learned so that I can be sure I really understood it. Zach Weiner (of SMBC fame) is doing this with physics and math on his blog. I also find it helpful to keep a log of things I do when I practice music. I can track my progress and make notes of things to focus on over time.
I wanted a central place where I could write about stuff, mainly for myself, but I was open to other people seeing most of my notes (in case people have valuable insight that could help me) so I did what any self-respecting nerd would do... I set up yet another blog on this server! I now have a "getting things done" blog called Input Coffee. It's not written for an audience and the posts are probably full of typos. In fact most of the posts just have sentence fragments and notes about whatever I'm working on, but I feel like just knowing that most of the posts are potentially public keeps me motivated to write regularly.
While people are welcome to check out Input Coffee if they're really interested in mundane day to day work, I don't expect it to be very engaging. Some of the posts there will get polished and turned into posts to this blog, which I would like to see people read! So far I've felt like this type of blog has been really helpful for some of the skills I've been working on and I hope I can keep it up.
So I spent a bit of time tonight messing around with Manga Studio and my little Wacom tablet. I've never been very good at drawing digitally, so it was fun to play around with this tool for a bit. While it didn't make me a better artist, it was a nicer environment for sketching and inking than Photoshop. Here's the output of some quick drawing. I guess the cat has a jet pack? And he used it to go to the moon? I don't know...

When I was in 4th grade I started playing saxophone in the school band. To get an "A" for practicing we needed to practice 125 minutes per week. I never let myself practice less than 130 minutes per week, just so I would always have done better than the maximum time required required.
What does this mean? Probably that I was kind of an over achieving little kid, but more importantly it's a habit that seems kind of dorky when I look back on it, but it really was a good good for me. At the time I was a pretty good sax player (for a 4th grader). As I got older I lost that discipline and ended up being somewhat mediocre at a lot of things that I really cared about.
Recently Eileen and I have been keeping a "Good Habits List", basically a chart of things we should be doing regularly to be better people. I've been using mine to make sure I do things like practice piano and guitar, work out, read difficult, but interesting books, draw, and study. The practicing music has been especially rewarding.
It's not that I haven't been playing guitar (or piano) in the past, but it's been a while since I've regularly PRACTICED either. I spent a lot of time either playing with the band, which was awesome or just noodling around while my brain was often thinking about something else. I've really been working on taking at least 30 minutes several times a week to really focus all my attention on what I'm playing. This means working on technique by running scales with a metronome, making sure I can play chords in any key cleanly, and slowing my playing down so that I don't just brush over sloppiness, but go back and fix it. This also means playing music by other people. I bought some Ben Folds Five sheet music and I've been working through song in that, breaking down hard parts into small chunks and working them out, playing single measure over and over until I can play them in the context of the full song, and then playing along with the song to work on dynamics and feel in my performance. I've been doing the same with guitar; conscious technical work and then learning songs and playing along with records.
These are things I should have been doing for a long time, but somehow I just got out of the habit and my playing has suffered because of it. I'm not putting in 8 hour practice sessions like a concert pianist, but reasonable sized chunks where I'm just focusing on playing better. Since I don't have a band any more and I my schedule is a lot more flexible this is a great time to really get myself into a good practice routine and build up my guitar and piano chops.
It feels like it's already paying off a bit. I've been able to see big progress in my piano playing and I'm remembering how fun it is to play along with songs on guitar. My fingers just feel more at home on the instruments. I've spent a lot of time in the past wishing that I was a better musician because I enjoy playing so much, it feels really good to be doing something about it.
So, a little over a year ago I wrote a post about the making of Mount Saint Awesome comics. Things have changed a bit since that time and I wanted to do an updated (and more visual) walk through of my current comic making process. This post will walk through the making of last week's comic, from scripting to final details.
1) Writing The Script
I write all my scripts in Google Docs because I tend to come up with them in random places, so I like having a central, synced location for all of them. At this point I try to layout what will be said in each panel so I can get an idea of the layout.
2) Drawing A Thumbnail
I don't do this for every comic, but whenever I want to get a feel for how the scene will be set up I start the drawing process by doing a quick, small thumbnail. This just gives me an idea of where to put everything so there's enough room for the art and speech bubbles.
3) The Layout Lines
Now I pencil my layout boxes for the comic. This one was pretty simple, but some end up being more complicated than this. Everything about the layout stays in pencil until the inking stage in case I want to break one of the borders or something.
4) Sketching The Comic
Now I sketch the comic into the frames I've drawn. Basically I try to reproduce the thumbnail, but with proper proportions and positions. This gives me a skeleton to actually draw over.
5) Penciling
At this point I actually draw the comic. I start to put in all the details of the subjects, use a ruler for straight lines, and basically get things looking how I want them to look. I probably spend more time on this step than I should, but I don't trust myself to get things right in the inking stage without first doing it in pencil.
6) Inking
Now the comic gets set in stone, so to speak. I use a couple different sized pens (Prismacolor pens with a brush tip, an 03 tip, and an 08 tip) to ink the pencils from the previous stage. Once that's done I erase all the extra pencil lines. Sometimes I do make mistakes in the inking (you might be able to see one in the 3rd panel), these can be corrected in the next step...
7) Scan Into Photoshop
At this point the inked comic is scanned at 300 dpi into Photoshop where I adjust the layers to bring out the black and make sure the whites are white. I can also erase any mis-inked sections. When I'm done here I save it as a big (3268 x 1572 px in this case) .jpg.
8) Illustrator Magic
Now I create a new Illustrator file with the dimensions I want the final comic (780 x 364 px in this case). I place the .jpg from Photoshop into the file and resize it to scale. Then I use the Live Trace tool (ignoring white) to smooth out the lines of the inked comic. This also separates the ink from the white background so I can color "under" the ink. I add a white layer underneath the ink layer to sever as the background of the image.
9) Coloring
Using the Pen Tool I color the comic by creating shapes of color under the ink layer. The coloring is done over a bunch of different layers. I still need to be better about setting up a standard color pallet for skin tones, hair color, desk wood, walls, etc. because now I just go back to previous comics to color pick what I want.
10) Adding Shading
This is something that I need to learn A LOT better. Once the coloring is finished I put layers of various transparency levels over the coloring (but under the ink). Then I draw my shading/shadows in black (which comes out in various translucence of black) the same was I draw shapes with the Pen Tool when I color.
11) Adding Text
Once the comic looks finished I use the text tool in Illustrator to add all the dialog and the text at the bottom. I've been doing most of my text with the font Blambot Casual. I'm still not every good at estimating the size of speech bubble that I will need, but I'm getting better. Doing the text this way is nice because if I catch a typo after I post, it's very easy to fix it and resave the comic.
12) It's A Comic!
Once the text is added I save it as an 8bit .png and upload it to the site! You can see the final product of all this work here. The whole process takes several hours from start to finish and can vary greatly depending on the details needed for the comic.
I know that once you have to explain a joke it really detracts from the humor. Still, I like making really nerdy jokes and it sometimes makes me sad when they don't land with a larger audience. I really liked the joke from last week's Mount Saint Awesome (also pictured below), but I think I might have over estimated the general public's recognition/understanding of genetic algorithms when I made this comic.
Inspired by the site explain xkcd and my love of genetic algorithms/comedy, I've decided to write an "Explain Mount Saint Awesome" for this comic.
Transcript:
[In 2057 scientists create the first truly self aware artificial intelligence by using genetic algorithms]
AI: "Hello World."
AI: "My grandfather wasn't no random bit string!"
[...Though some argue that it can't really be considered "intelligent".]
Ok, so to understand this joke, you need a basic understanding of genetic algorithms and how they work. Genetic algorithms are a search method used in machine learning based of off the process of biological evolution. A genetic algorithm will generally start with a population of random "solutions" (sometimes in the form of a random bit string representing the solution). These random (and very bad) solutions evolve by crossover (combining 2 or more solutions, like breeding in living organisms) and mutation (random changes in the genotype of the solution). The best (most fit) solutions are most likely to pass on their traits to the next generation of solutions. This keeps happening for many generations until an acceptable solution is found. (This is a VERY basic overview of how GAs work. They can be much more complicated than this, but they're useful for things like music generation and stock prediction).
The comic in question is implying that the software for this artificial intelligence was found by starting with a population of random bit strings and using a genetic algorithms to "evolve" these "programs" until they produced a self aware artificial intelligence. Realistically this isn't a very good way to find such a complex solution and another evolutionary computing technique called genetic programming, might be slightly better suited (though still not very realistic at this time), but that's not really the point. It's a comic, not a text book.
The line "My grandfather wasn't no random bit string!" is a parody of a stereotypical creationist objection to biological evolution, "My grandfather wasn't no monkey!" (best embodied by the accompanying picture). Here I'm implying that this miracle of modern science, a self aware artificial intelligence, is saying things that a creationist would say. These are not things that an intelligent entity would say.
So, was the joke worth this long winded explanation? Probably not, but some people might actually be interested in genetic algorithms (or making fun of creationists). If you're interested in either of these things please let me know and I'd love to chat about them in more detail!
A few months ago I wrote a post about my new office/studio set up in our new apartment. I had everything set up to make writing and recording music easier! But I haven't posted any new music in a long time... Until now!
Eileen and I (still under the name Packets and Waves) just finished recording a cover of Tegan and Sara's Call It Off. This is a really awesome song off of their record The Con! If you didn't already click on the link to the video do it! The video is just so simple and perfect for the song. I've been thinking for a while that this would be a good song for us to try. It's really simple and short and there's a good division of lead and backing vocals. Recording this was a bit of an exercise in moderation for the orchestration. I wanted it to be rich, but not busy.
One aspect I was pretty excited about was the replacement of the finger picked guitar with simple piano. I also added some strings to the synth part in the 2nd verse. For the most part, we didn't stray too far from the original song, but I think we still gave it our own touch.
Here's the full instrumenation for the song:
Eileen:
I feel a little guilty about the Star Trek movie joke in the title because I don't think I've ever seen a Star Trek movie all the way through, but no matter, that's not what this post is about. This post is about the Khan Academy.
For those who don't know, the Khan Academy started as a collection of You Tube videos of short (about 10 minutes long) lessons in math and science subjects. It has recently been reviving a lot of attention and is now supported by the Gate's Foundation and Google. I had heard of it a while ago, but never thought to use it in my own education because the vast majority of the "courses" were aimed at high school students and below.
More recently, I've found that I really need a solid understanding of probability theory in order to start learning some more advanced concepts that will be useful for work I'm doing in my lab. I found out that the Khan Academy has probability courses that cover concepts up to a basic college level course, so I decided that I would just sit down and do almost all of the lessons and exercises in that section. Two days and about 4 1/2 hours of video later, I really feel like I have a solid refresher of probability theory and I've become semi-obsessed with Khan Academy.
I mentioned in a previous post that I was interested in relearning any math that I feel I had missed in my undergrad. The Khan Academy is going to be a great tool for that. I am a sucker for any type of "game" with a "progress system" and Khan Academy totally exploits that. You get "points" for all the time you spend watching video and for getting exercises correct. They really do a great job of showing you metrics for your progress, which I have a tendency to get obsessed with and want to keep earning more and more. Of course such a system could be gamed, but I honestly want to learn the concepts so I think I'll be able to keep myself honest.
I manged to get through the whole probability section this weekend and I think that I'll tackle Linear Algebra and maybe Differential Equations soon. I might also go through some of the more advanced Statistics lessons because I think think they could be useful for working with quantitative data in research. Most of this stuff I have seen before, but I either didn't really get it the first time around or I haven't used it for a LONG time and I've forgotten most of it.
I really hope they add more sections and more advanced concepts because I really like this style of self paced learning with easy progress tracking. If you ever have any concept that need to learn or brush up on (especially math or science) check out the Khan Academy, it's actually a really fun, valuable resource.
As some of you may or may not know, I just moved to Berkeley, CA. Eileen is starting a masters program at UC and I'm working in a research lab at the university. It really sucked to leave all our friends in Chicago and it was especially hard for me to leave the people I've been making music with over the years.
While packing up all our stuff into a truck, driving it 2000 miles, and unpacking it someplace new was a big pain in the ass, it did provide me the opportunity to set up my office in a way that should be more conducive to writing and recording music. While I also do most of my coding and drawing in my office, the activity that takes the most setup and space is music. I wanted to be able to quickly plug in and be able to lay an idea down before I forgot it. I also really like having instruments within reach at all times so I wanted to just surround myself with gear to pick up at any time.
The end result turned out really well (especially considering how small the room is and that I have to share the office space with Eileen). I wanted to show off a few key points:
I do all my recording on Garageband on my MacBook Pro, so I need some extra desktop space to work. By putting my monitors up on a riser I can push my desktop keyboard out of the way, giving me more space to work.
My keyboard is always to my right and always on so I can just fiddle around with piano parts all the time. My rack of guitars is right behind the keyboard. I really like the whole "L shaped" setup of it.
My little M-Audio interface is sitting on the subwoofer, so it's out of the way when I'm doing non-music work, but easy to plug a guitar, keyboard, or mic into without moving it around.
I have a guitar cable with tuner setup and ready to plug into the recording interface under the keyboard.
This really doesn't have anything to do with my new office/studio set up, but I found an awesome free metronome app for my iPhone that has really come in handy, Steinway Metronome.
I have my bass amp (a 150 Watt Ampeg B3) with with me for the first time since I bought it (which was 2003, I think). It's AWESOME to be able to record out of a decent amp again. I never liked DIing my bass with the M-Audio and the shitty Crate practice amp I've been using in the past is, well, shitty.
One of the biggest problems I had with my home recordings in the past was listening to the mix. I don't plan on doing anything super professional (I'll leave that to the professionals) but I feel like I can lay down something that's not painful to listen to. Because I'm recording on my laptop I either have to use headphones or the shitty laptops speakers, so I was always mis-mixing my low end. I solved this by splitting the input to my desktop computer's speakers so that I can plug my laptop into those speakers (without unplugging my desktop) whenever I'm recording.
There are LOTS of whiteboards around. I can't stress the importance of whiteboards enough.
So, I have lots of cool toys all set up to be played with, now what? Well, without The American Autumn in my life I have a big musical hole to fill. I've been talking with Josh and Chris about a really exciting project between the 3 of us and that's just starting to take shape. I'd like to do more Packets and Waves songs with Eileen. And if I have some stuff that just doesn't fit into any of those projects I wouldn't mind doing a few songs just on my own. I've already done some small recordings and I'm really looking forward to sinking my teeth into bigger projects in this new space!
Pretty cool dude. Makes me want to start drawing... but I have too many things I should "start" doing.
Cool post. I love behind the scenes stuff!