- Similar posts for 'design':
- Design by faking
- Similar posts for 'writing':
- What is a tech reader?
- Katie writes: Kids Code!
- What I learned from NaNoWriMo 2013
- Writing and Mental Health
- 2/17/15 - Young Coders: Why twelve and up?
- 12/31/14 - Looking back and looking forward: 2014
- 12/18/14 - Katie's Year of Audio Books
- 11/18/14 - Katie learns Angular.js
- 11/17/14 - Teaching Python in your PJ's
- 11/10/14 - Why not self-publish?
- 8/22/14 - My return to Pokemon
- 8/18/14 - What is a tech reader?
- 7/14/14 - Flask + git: Easiest workshop ever
- 7/8/14 - Katie writes: Kids Code!
12 November 2012
You would think that someone who loves drawing would love doing diagrams. I do not. I hate diagrams. I thought I would love them, but they ended up being the thing I hated most about writing Accessibility Handbook.
I mean, diagrams are nice for reinforcing information or getting across a more subtle point to a reader (they also don't hurt your page count). They break up your chapter and add visual interest. But oh my god, does making them suck.
Mistakes I made
With my first book, I didn't take the time to do the diagrams as I went. I just inserted a placeholder image with a vague description about what the diagram was supposed to be.
This was a bad idea.
When I dove into doing diagrams, I couldn't fathom why half of them seemed like a good idea. I'd stare at my note ("Something about embiggening") and curse my previous self for not just doing the diagram right then and there. I removed more than a few, then had to make up the missing space in a frenzied weekend of writing.
The reason I'd moved to doing the notes and placeholders, though, was that stopping to make a diagram can take you out of your writing groove. I'd sit down to write, then spend a half-hour either struggling with Gimp or sketching something, scanning it, then trying to refine it. Pictures are not worth a thousand words. I measured. They only take up the space of about 150 words. They were making me fall behind.
What I'm doing now
With my current book, I decided that I was going to find something that worked with my flow. I needed to make diagrams as I needed them, but I didn't want them to take up precious writing time. After all, you get lots of waiting time during editing that can be used for making the diagrams nicer.
I hit upon it by accident, really. I'd been taking pictures of sketches I'd been doing throughout the day with my smartphone, then posting them to Twitter. While these weren't archival-quality shots, they worked well enough for their intended purpose: amuse the masses. Why couldn't I do this for my book diagrams?
I started using a new workflow:
- Write write write
- Come across a section where I was going to need a diagram
- Stop, sketch it in a cheap sketch-pad
- Take a picture of it
- Crop it on my phone
- Wait for it to upload to my machine
- Move it to where I needed it to be, and name it something sensible
- Insert it
That looks like quite a few steps, but trust me, it only takes me about five minutes. Sketching is much faster than trying to start in a graphics program. My paper is already right here (I always have the sketchbook at hand), as is my phone, and Dropbox is always doing its thing in the background.
Eventually, though, I need to make nicer images. What do I use then?
Tools I use
I do not own Photoshop. I know, I know, that's crazy. The last time I checked, though, Photoshop was over five hundred bucks, and that's way over my impulse range. I have to truly believe with my heart and soul that I need something that costs over $200.
And no, before you ask, my work has not purchased me Photoshop. I'm a Python developer. That would be silly. I only got it at my last job because we'd randomly run out of designers, and sometimes you just have to fix some transparency on your own.
For screenshots and annotations, I love Skitch. It takes great screenshots that I can mark up immediately, and I love how nice it makes my lines look.
If I need to actually draw something while I'm on my Mac, I fire up Acorn. It does everything I really need it to do: layers, brushes, exporting, selecting, and cropping. I know it only does about 10% of what Photoshop does, but apparently that's the 10% I really needed.
If I happen to be working on my Mint box, I use Gimp. Then I cry a whole bunch.
If, for some reason, I'm on my Windows box (which I use almost exclusively for gaming), I break out Paint.net. I cry slightly less than I do with Gimp, but this is only because I'm distracted by the Steam icon in my toolbar.
When I have to mock up a site for a screenshot, I grab Twitter's Bootstrap. It saved me huge amounts of time, using their styling and templates.
Tip: Know your tools
If you need pull-down menus and icons to access different tools, you're doing it wrong. Learn what the keyboard shortcuts are for every tool you'll need, from creating layers to switching from paintbrush to pencil, to changing how you're selecting areas. Learning the keys made making diagrams a ton faster.
Also, it will not kill you to watch some tutorials on how to use your tools. You may not be planning on a career in the visual arts, but knowing all of the things your tools can do will only make your diagrams look nicer. There's a ton of hidden tricks that get pushed off of the main toolbar to save space.
Ask about colors
When I did diagrams for Accessibility Handbook, they were in color. I found out, while the book was in production, that the diagrams would be in black and white. Hell. Lesson learned: With the new book, I've asked in advance, and I know that my diagrams in this case will be in color.
Another lesson I learned was to save everything, in every format. More than once, I had to grab the original file and change a color or a typo, or change some copy. This includes not only the image files, but the HTML files for my screen-shots. For a few of those, I just modified another file, and I was in a world of hurt when someone needed me to make a change.