Kevin Cheng  

The Making of OK/Cancel

January 27th, 2004 by Kevin Cheng :: see related comic

KC: Some readers have expressed interest (or confusion) about OK/Cancel and its creators. Who draws the comic? Who writes it? Is it like Penny Arcade wherein one person writes while the other handles the art chores? Even Don Norman had trouble identifying the right person to credit and where said person resided. To clear up the confusion once and for all, I present to you The Making of OK/Cancel…Tom: OK/Cancel: A week in the Life!

KC: Firstly, there are some facts we must establish. Tom lives in Seattle, WA, USA and I live in London, UK. For those that are time zone challenged, that means we are 8 hours apart. To say such a collaboration comes with its own brand of unique hurdles would be understating the nature of our collaboration.

KC: When we create a new strip, we typically begin by recognizing a need. Like, “Well we’ve just released this week’s comic, what’s next?” or “Oh $#!+ it’s Thursday!”. Once that’s been established, we begin brainstorming for ideas. Because of the time difference, this typically happens in the evening for me which is often before Tom has gone to the office. (Tom: It also happens in the evening in Seattle when KC is up at some ridiculous hour.) We communicate primarily via instant messenger (whichever one isn’t crashing that day) and start the discussion.

IM Script Discussion

KC: We begin by looking at what’s happened recently in the industry. Timely comic strips on recent events are done whenever possible — Weird Science and Keeping it Real are examples of this. In addition to this approach, we have a number of previously discussed ideas which we store for rainy days. Ultimately, one of us will become inspired and propose a script. Then the two of us iterate back and forth tweaking details until we think it’s the funniest it can be.

Tom: Or at least as funny as we can make it.

Pencil sketchKC: Once we’ve agreed on a script to a certain point, I begin to draw. I use Photoshop and a Wacom Intuos2 tablet to do my work. The first pass is always quite rough. Mostly skeletal drawings to show position, scale and camera angles. Just as paper prototypes are the least functional but most adaptable, this stage is my way of creating something visible enough for me to change radically with minimal investment. Occasionally, Tom and I trade thumbnails via e-mail to illustrate our ideas better.

Thumbnail composition

Inked sketchKC: Once I feel the layout is satisfactory, I start to put in more detail into the sketch. Finally, I finish up with the equivalent of “inking” on a separate layer. The sketching is placed on 50% transparency for reference. Sometimes, I will also draw the background on a separate layer.

KC: The draft Photoshop file is then handed to Tom for feedback and colouring. Tom will often supply feedback (again over IM) on areas to change before he begins colouring. I also generally provide some direction on aspects I had a specific vision for in terms of lighting or colour but mostly, I leave it to his discretion.

Completed Inks

Coloured sketchTom: I always begin by tackling the easy part: cell-shading the main characters. Skin tones stay the same, so I do these first. Now unlike most other comics, our characters change their clothes (especially iVan). Thus, every week I need to pick colors for them. I aim for a result that is both bright and balanced. Generally I select colors freehand, but for guest characters (Jonathan Ive, Rob Glaser, etc), and for complex subjects (Big Ben, a bouquet of orchids, etc) I will use a photo as a color reference. I cell-shade using the Photoshop paintbrush tool with my mouse. Since the cell-shaded colors are flat, everything is pretty straightforward except for the accursed “73” on Tomo’s shirt. When there are 3 shirts to color it is called a “219” week.

Special effects colouringTom: After finishing the characters and foreground, I move on to the background. From week to week the complexity of the setting can vary quite a bit, and this has allowed me to try all sorts of fun things with shadows and lighting. Usually I try to do at least one interesting effect per comic — ranging from glass to smoke, lightning bolts, multi-source shadows, shimmering water, projector glow, and translucent materials.

Tom: I then add the text (using fonts from Blambot) and make any changes which seem necessary based on how the art interacts with the words. If the strip is *still* not funny, then it’s back to IM to discuss how to maximize funniness. Once we agree on a script, we roll the changes into the final version, ready for publication.

KC: I’ve made some interesting observations from this process we’ve adopted. First off, there are aspects of the collaboration that we’ve discovered absolutely require synchronous communication. We attempted scripts and idea generation over e-mail before and found the output to be of much lower quality.

Tom: On the plus side, we can pull an “all-nighter” without losing any sleep. If KC completes his drawing by evening, I can pick it up to color immediately afterwards as my evening has just started.

KC: Perhaps most interesting of all is the fact that Tom and I haven’t seen each other in person, or even spoken on the phone since we both resided in Austin back in early 2001. The idea for this site and strip, the site’s creation and continuing development have all been organised through instant messaging. One has to wonder, would our quality improve or decline if we were physically in the same city?

Tom: I actually don’t wonder about this. We used to live in the same city and we didn’t get anything done.

7 Responses to “The Making of OK/Cancel”
Roger Belveal wrote:

Nicely done.

Have you tried or considered using Alias SketchBook for the artwork. If so, I’d be interested in your view of how it stacks up against Photoshop for this type of work.

KC wrote:

I tried the demo version when it first came out but I didn’t have my Tablet PC at the time (in fact I didn’t even have the Tablet PC at the time the article was written so perhaps it warrants an update). I intent do try it in the near future actually so I’ll let you know. I also recently found a great painting tool that Tom’s been a huge fan of called ArtRage. Very similar to Alias Sketchbook.

JayAllen - The Daily Journey wrote:

The truly virtual office

When I first discovered the web in 1994, I dreamed of the possibilities of making money from a boat somewhere…

Dom wrote:

Who in reality is Ivan? I bet he’s based on a real character.

Kevin Cheng wrote:

Sort of. I was looking for a character who would practise by blindly following the advice of columnists, gurus, etc. Extending on that, I decided he’s be a slave to fashion trends in a more literal sense as well. Finally, I used to frequent an overpriced “budget” noodle chain called Wagamama and at the particular branch I frequented, every waiter/waitress (yes even waitress) had short, blonde dyed hair gelled up with the roots showing. Combined with the fashion last year of wearing big glasses/sunglasses indoors and out, I had iVan.

Except for the name, and there I just wanted something that could use a small “i”.

Tom Chi wrote:

Man… what are you doing at Wagamama in the first place? :p

Anyhow, in terms of doing art… Sketchbook has got the best pencil, Artrage has the best brush, and photoshop has templates, scripts, and text layers. It’s all those things that make it our choice — even though there are plenty of goofy interaction problems.

On a separate note, if you want to do things in color, most tablets (and generally most LCDs) do not do so well. CRT 4eva!

Rajendra wrote:

Hi there,

I’m planning to have blog that will feature daily comic (created by my brother).

I have seen that you guys are using WORDPRESS for this. Do you mind in sharing the template for comic strip so that I can use it in building the blog on my website ?

thanks a lot in advance,

Leave a Reply

OK/Cancel is a comic strip collaboration co-written and co-illustrated by Kevin Cheng and Tom Chi. Our subject matter focuses on interfaces, good and bad and the people behind the industry of building interfaces - usability specialists, interaction designers, human-computer interaction (HCI) experts, industrial designers, etc. (Who Links Here) ?