Category Archives: drawing

Sketchnote reflection: conference intensity

Still a little tired from two intense days of sketchnoting: 62 2-minute pitches from Sunday’s AngelHack Toronto, and then a 12-hour sprint involving 33 talks and 11 startup demos for Monday’s Lean Startup Day. Focused listening is tough – squeezing through hundreds of people to find a seat at AngelHackTO, straining to hear pitches despite the back-of-room chatter competing with weak sound; dealing with a quick succession of topics with a livestream that shows only brief glimpses of slides; tweeting with one hand while drawing with the other.

Although I had to shift writing positions a few times, my hands didn’t cramp up once. The breaks were just enough time for me to shake out any tiredness, drink some water, dash to the facilities, munch my way through three energy bars and a sandwich, and answer questions from curious onlookers. After the conference and a short time at Quantified Self Toronto’s pub night, I gratefully slid into the quiet of solitude, and I slept for eleven hours once I got home.

It was intense work, but worth it. Visually summarizing the pitches and talks during the event itself meant that the sketchnotes could be part of the conversation instead of an afterthought, and people appreciated it both here and elsewhere.



Every time I sketch an event, I learn something. Here’s what worked well:

  • I set up custom templates before the event. MaRS wanted partner logos on the template, so I created that PNG beforehand, and I added a light grid from my own drawing templates. This meant that the sketchnotes were consistently branded.
  • I saved my sketchnotes using Autodesk’s automatic numbering feature and a shared Dropbox folder. This came in really handy during the Lean Startup Day conference, as the talks were quick with very few breaks in between. Automatic numbering meant that I didn’t have to spend time changing the filename, while using Dropbox meant that my files were synchronized with my phone and easy to publish on the web.
  • I switched devices instead of switching screens. One of the advantages of using an all-digital workflow is that I can publish my sketchnotes during the event itself. My tablet PC is great for drawing, but switching windows and sharing notes on Twitter is hard when it’s in tablet mode. By saving the files in Dropbox and synchronizing with my phone, I could avoid switching applications – my tablet PC was dedicated for drawing, while the phone was great for posting links to Twitter.
  • Dropbox also made it easy to update files. If I wanted to correct an image, I could simply save a new version. The old links would continue to work seamlessly. This was much better than my previous workflow of using Twitpic or WordPress – replacing old images is so much easier now.
  • I kept the clutter off my blog. When covering single talks, I’ll often publish the sketchnotes directly to my blog. I didn’t want to post twenty separate entries for a conference, though! Using Dropbox+Twitter allowed me to publish sketchnotes immediately without cluttering up my blog. At the end of the event, I created a blog post recap with all the sketchnotes for easy access.
  • I stocked up on supplies. I tucked a few Clif bars and two water bottles into my backpack, and they came in really handy during the conference. Concentration makes me hungry!
  • I added some light shading. Using Autodesk Sketchbook Pro 6.0.1’s new Color Puck, I picked a shade that was related to the logo colours. Whenever I had time, I added subtle shading on a different layer. (Ex: panel) It was fun, and I’m looking forward to revisiting past sketchnotes and using that technique.
  • I set aside a day for recovery. Introvert overload – energy management required! =)

Here’s how I’m thinking of making things even better next time:

  • I might be able to automate the Dropbox > Twitter publishing process with WappWolf, if I can figure out how to add some information without needing to type it in using my laptop.
  • Alternatively, I can use an external keyboard (or even dust off my Twiddler!) in order to speed up data entry while I’m in tablet mode.
  • I can see if there’s a way to use Microsoft Powerpoint’s Photo Album feature to insert high-resolution images instead of having them downsampled. Inserting them one by one and changing the “Compress Pictures” setting to use the document resolution seems to work, though. You can see or download the results on Slideshare.
  • I can identify frequently-used nouns and build a visual thesaurus so that I’m not drawing boxes all over the place.

Next on my sketchnoting calendar: today’s talk by Dan Roam on “Blah Blah Blah”, the Wednesday lectures on Entrepreneurship 101, and next week’s book club on “Best Practices are Stupid”. People tell me these sketchnotes are valuable. I’m getting better and better at making them!

Sketchnotes: Visual Problem-solving–Dan Roam (DAN ROAM!)

Dan Roam (Back of the Napkin; Blah, Blah, Blah) was in Toronto yesterday to give a talk on visual problem-solving at the Rotman School of Management. I like to think that I was cool and composed during the post-talk book-signing, but really, the only reason I didn’t get a picture with him was because I was too busy trying to not hyperventilate about the fact that he recognized me from Twitter and said he liked my work. =)

I did ask him to sign this sketchnote, though. 20121204 Visual Problem-solving - Dan Roam

“Whoever best describes the problem is the most likely to fix it.” That reminds me of SPI 046: Building a Lucrative Business with No Ideas, No Expertise & No Money with Dane Maxwell, a Smart Passive Income podcast that dove deeper into defining problems and building businesses around them. Nugget from that one: “If you can define the problem better than your target customer, then they will assume you have the solution.”

Check out my other sketchnotes for one-page summaries of business and technology talks. Look at Rotman’s upcoming events calendar for other cool speakers!

Text from the sketchnote, to simplify searching:

Whoever best describes the problem is the most likely to fix it.

Say more with less: ideas -> pictures (easy to share, easy to act on)

Stories:

  • Best – Boeing: built in 17 countries; challenge: languages; solution: all communication is visual
  • Worst – Politics: challenges: intentional obfuscation, outcome is so many words
  • 1974 Dr. Arthur Laffer – taxes; If you reduce taxes, you might increase revenue. Napkin sketch.

We can solve our problems with pictures. Simple drawing is okay. 75% of brain = vision. We are highly visual people. But we teach linear, verbal thinking in school!

detail + big picture. We think detail is intelligence. Power on your visual operating system. You can recognize ~100% after delay. You can figure out time from simple images. Our memory uses images and then we translate

The six ways we see:

  • who/what: portrait
  • how much: chart
  • where: map (how things fit, what’s missing)
  • when: timeline; also, motion
  • how: flowchart
  • why: equation (now + change = new)

Maybe it’s enough to draw 6 simple pictures

Drawing – you don’t have to remember anything!

Why visual thinking? Run away from death by Powerpoint.

Tools: Tablet PC (can use mouse as well), PowerPoint – pen tool

Wong-Baker pain scale; maps: spatial relationships; time: we recognize the when through the change in the where in the what.

Decision review: Art class (includes sketches)

As part of my resolution to spend more on learning, I went for one-on-one art classes in a nearby studio (Pamela Dodds’).

My first exercise was to draw shoes with lots of soft lines. The teacher said to focus on drawing each line in relation to each other instead of thinking about the whole shape. That makes it easier to defamiliarize yourself and draw what you see, instead of this preconceived notion of a shoe. I ended up making this shoe a little shorter than it actually was, but it was recognizably a shoe, hooray!

image

My homework was to draw more shoes.

imageimage

Since I’m curious about translating abstract concepts to concrete images and vice versa, my teacher also suggested that I draw different kinds of shoes and the ideas associated with them.

image

The second class focused on negative space and chairs. On the left, you can see the chair I drew in class. On the right, here’s a chair that Leia (one of our cats) often likes sleeping in.

Image(4)Image(3)[7]

The third class was about lines, angles, and proportions. I started by drawing the scissors, then drawing the detergent bottle, and then finally by drawing the overlapping shapes of the coffee mugs.

152810

image

Image

At home, I practised by drawing the salt-and-pepper shakers, and by drawing the mouse.

Image(1)Image(2)

My last session was one about faces and proportions (see above). Both of these were drawn from (rather odd-looking) mannequins. I like the profile likeness, although it was a little difficult getting the hang of the chin.

I’ve read many art education books such as Drawing on the Right Side of the Brain and Drawing by Seeing, so that sped up the teaching and gave us a shorthand for discussions. For me, the art classes were more of a meditative space where I could deliberately practise techniques, with feedback from a teacher who could warn me when I was getting too close to the paper (and thus shifting my viewpoint) or who could figure out where I was a little bit off in terms of proportions.

It’s a very different style of drawing compared to sketchnotes. I’m usually just focused on getting the gist of an idea across in a very simple, iconic form. In terms of getting better at sketchnoting, I’ll focus on broading my visual vocabulary by sketching different terms of concepts instead of focusing on drawing more realistic images. Still, it was fun discovering that even though I hadn’t been practising much “proper” drawing, I was getting better at seeing things!

Decision review: Good decision to experiment with art class, although I’ll keep looking around for other classes and I’ll keep practising on my own.

Tips for growing as a sketchnoter

New to sketchnoting? Aside from reading Mike Rohde’s The Sketchnote Handbook (see my sketchnote of it!) and Dan Roam’s Back of the Napkin, how else can you grow your skills? Here are some ideas from how I keep working on improving my sketchnoting. Hope you find them useful!

Click on the image for a larger version of the sketchnote.

20121216 Growing as a sketchnoter

Feel free to share this! You can credit it as (c) 2012 Sacha Chua under the Creative Commons Attribution 2.5 Canada licence.

Check out my other sketchnotes and visual book notes. Want me to sketchnote your event? Know of any interesting tech / business talks coming up? I’d love to hear from you!

Thanks to Tamara Paton for the nudge to share this. =)

Sketchnote and got tips to share? Curious and have questions to ask? Comment below!

Decision: No Illustrator CS6 for now

I wanted to like Adobe Illustrator CS6. I really did. I’ve been looking for a vector drawing tool that could fit into my sketchnoting workflow. Illustrator CS6 handled my tablet PC’s pen input more smoothly than Inkscape did, creating neat curves while still letting me work with the tight circles I use for lettering. Vector-based drawing meant that I could resize and move things around easily. I liked using the Navigator to keep a bird’s eye view of the image while zooming in on details. I was excited by the possibilities of building my own symbol libraries so that I could drop in visual elements quickly.

But it keeps crashing on me, which is frustrating. Even though I’ve rigged up some AutoHotkey macros to make it easier to save (triggered by a foot pedal, no less!), I don’t want to deal with that kind of mental friction and re-work. So, no Illustrator CS6 yet, and by extension, probably no Creative Cloud subscription. It’s like the way I ended up ditching Autodesk Sketchbook Pro on my Android tablet – it mostly works, except for when it doesn’t. When it doesn’t, it frustrates me.

I tried CorelDraw, too, but the eraser tool there doesn’t work the way I want it to. Artrage Studio Pro has a sticker library that might give me the ability to clip frequently-used images, but it’s not as responsive as Autodesk Sketchbook Pro is, so it’s a little frustrating too. Oh, well. I guess I’ll stick with Autodesk Sketchbook Pro for another year, and maybe use Inkscape to trace my drawings if I need to resize them.

I trust things a little more if I have backup plans. For example, I’ve messed up with Autodesk Sketchbook Pro on my tablet PC. One time, I accidentally moved my layer instead of zooming it. Fortunately, I’ve gotten into the habit of using Camtasia Studio to record my screen during the drawing process, so it was easy to go back in time and reconstruct the missing parts. Still annoying, but at least that was more my fault than the program’s.

It’s a little frustrating investing time into learning something that didn’t pan out, but knowing that these tools aren’t a good fit for what I want to do is valuable information as well. I’ll keep an eye out for other things!

Imagining an index of sketchnotes

With sketchnotes gaining in popularity, I’m often curious about how other people drew a talk. TED talks are popular for sketchnoting practice, and sketchnoters are beginning to bump into each other at conferences as well.

There are many avenues to share or discover sketchnotes, such as The Sketchnote Handbook Flickr Pool and the wonderful graphic recordings at Ogilvy Notes. Sketchnote Army is a blog that features lots of sketchnotes, and Twitter searches turn up even more. But there isn’t really something that’ll help you bump into other sketchnotes of the same talk, or even sketchnotes of the same conference.

Are we at the point yet where multiple people might be sketchnoting something? For popular TED talks, yes, and many conferences might have sketchnoters in the crowd. I think it would be interesting to make it easier for people to find each other and compare notes.

So I registered sketchnoteindex.com and created a quick spreadsheet to get a feel for the data that would be good to capture and how we might want to organize it. (Prototype with the lowest-effort thing first!) In addition to indexing topics, I’d like to eventually build an image and visual metaphor index too, so we can see how different people have represented time. Text search would rock someday. In the meantime, I put together a quick text prototype as an excuse to learn more about the Ember.js framework, although I’m thiiiis close to chucking it all and using Emacs or a Ruby script to generate static HTML.

Some things to consider:

  • We want to avoid spam and build good data for navigation. I can start off manually indexing sketchnotes, and then open it up for submission (possibly with an assistant).
  • Many sketchnotes don’t indicate their licensing, so technically, they’d be all rights reserved. We can link to things, and include thumbnails if we have permission.
  • I can coordinate with Sketchnote Army (Mike / Binaebi) for submissions, and I can set up notifications for other sources.
  • Revenue model: Advertising? Flesh this out into a system where conferences can pay a small fee to have branding on their page? Do this as a volunteer because I want to learn more about sketchnotes along the way? Hmm…

Right now, Ember.js pulls the data off the CSV I exported from my Google Docs spreadsheet. That way, I don’t have to create an admin interface or anything else. I’m not actually using Ember.js’ features (aside from a little templating and a few models), so I may swap it for something else.

So this was about eight hours including data entry (300+ sketchnotes; I did it myself instead of delegating because I wanted to sketch the idea out quickly), going through the Ember.js tutorials, and fighting with Javascript.