Improve Your Sketching Game
Designing a workflow from scratch is often intimidating and overwhelming. This is especially true if it’s for something complex and difficult to wrap your head around. When thinking of these workflows, it can be tricky to figure out where to start. Your head can fill with more questions than answers… or you feel stuck and think, “I can’t even!” as you stare at a blank screen in Sketch.
I’ll go over how you can tackle any workflow, even the biggest, most complicated ones, using a small, unassuming tool: index cards. Their small size allows for quick sketching, discarding, and rearranging to make continued progress on a workflow design. This article covers why and how to set up index cards to design workflows at a high-level.
The Analog Process
This process requires adopting an analog sketch process. I’m a huge fan of the “analog desk” which Austin Kleon talks about in his book Steal Like an Artist (see Chapter 4, Use Your Hands). I’m a hands-on designer, but having a dedicated analog desk has boosted my productivity.
Working in an analog mode allows me to focus on the ideas themselves, for what they are or can be. I’m not spending precious brainstorming time hemming and hawing over colors and spacing. I just focusing on the ideas and overall flow. Once those ideas are in a good state, I then leverage digital tools to refine those ideas. That’s the time I can start figuring out font sizes, button colors, spacing, etc.
Why Index Cards?
Their small sizes makes them more approachable and less intimidating. I used to sketch on printer paper and large paper rolls, but often got caught up in how much I “messed up”. This includes drawing crooked lines, scratching out bad ideas, drawing arrows everywhere to follow the “real” flow, etc.
But with index cards, things are much easier; they:
Provide focus
Because of its small real estate, I’m limited with how much I can sketch on one card. It forces me to keep things high level and prevents me from fixating on all the details.
Can shift and rearrange with ease
Sometimes I realize I forgot a step or screen in a workflow. With index cards, it’s not an issue. I draw that new screen on a new card and slide it between the other screens. If the screens would be better in another order — not a problem, I rearrange them.
Pack well
They are highly portable. I can sketch anywhere with very limited space. So instead can I leave my desk and work in a cafe or outside to change my scenery and find inspiration.
Allow flexibility
This is the best part of the using index cards. When I mess up, I throw the card out. I can pretend like my bad idea or horribly drawn screen didn’t exist!
Supplies Need
- 3x5" or 4x6" blank index cards — I like the 3x5" ones because they keep me thinking on a high level.
- A pen — I like to keep it to one color. Sometimes I use two colors, but only to highlight or show certain things. My favorite pen these days is the Pilot G-2, fine point.
Basic Process
The process is pretty simple, but I’ll go over how you can work with them.
Step 1. One thing per index card
To make this flexible, only put one “thing” (idea, screen modal, step, etc.) on a card.
Depending on what you’re sketching, you can draw the screen on the top half, then write notes below it. Or you draw on the front, then write notes on the back. You can add a title to the screen to help with organization, but avoid numbering the screens until the end.
Keep the ideas high level and focus only on what’s important on that screen for that moment. You’ll have time to refine and work on those interactions later.
Step 2. Rearrange, scrap, iterate
During the sketching process — go all out! Rearrange your cards, throw out ones you don’t need or want, or improve some sketches by iterating on them. If you get to a good point, you can number them, so you don’t lose track.
Step 3. Layer on more details (optional)
If you have questions for another teammate or need to reference something, jot it down. You can make these notes in another color or on a sticky note and come back to them later.
Step 4. Transfer into Sketch
Once you’re at a good point with your design, transfer these sketches into Sketch or another design tool. You can layout the cards, take photos, and import those photos. From there, you can use this as a guide to start refining your designs. That’s where you can focus on patterns, micro-interactions, and other details.
Resources
- Steal Like an Artist by Austin Kleon
- Pilot G-2, fine point pens
Try it out!
Index cards have been a game changer in my sketching process. Their flexibility and finite space help with iteration to ensure design progress. Who can’t be mad at that? If you give this a shot, I’d love to hear what you think!
