April 13, 2006

Under The Loupe #5: Visual Thinking

After a brief hiatus, Under The Loupe is back. This week we will be flexing that lump of worms between your ears. One of the biggest things that can separate a good design from a great design is a strong concept. Strong concepts don’t always just come to us; sometimes they take work. Perhaps not real physical labor, but a process of bypassing the obvious ideas to get to the hidden ones. Some people call this “Creative Thinking”, but when I was first introduced to this concept, it was presented to me as “Visual Thinking”. I tend to prefer “Visual” as opposed to “Creative” as it helps to shift the focus back to design specifically. Let’s define “Visual Thinking” as: A process of idea-finding and formulation, typically with simple tools like a pencil and paper, where the cumulation of ideas influences the whole.

This might sound very familiar to you, because yes, Visual Thinking is a close cousin to Brainstorming. And for the purposes of this discussion, we will be talking about how this generally applies as an extension of keeping a sketchbook, all part of a healthy breakfast… er… design process.

I was first properly introduced to Visual Thinking during, interestingly enough, my Visual Thinking class in college. One of the most intriguing projects we did for the term was an exercise my professor called “100 boxes”. It went something like this: each student picks a simple topic; things like “car”, “love”, or “cat”. For no particular reason, I picked “telephone”. Next, we took a big piece of paper and drew out 100 1” x 1” boxes on it. Over the course of a semester we were to re-imagine our topic in as many different ways as possible, the only rule being to not repeat any of the ideas. We would draw on our paper for about 10 minutes at the beginning of each class, though the gravity of the project didn’t immediately strike any of us. We all started out with some of the first, and usually most obvious, ideas that popped into our heads. After about the third class, everyone seemed to suddenly become less productive. It was at that point in the semester where we actually had to start thinking, really thinking about something different. The first few sessions had been the equivalent of a warm up. It was also at that point where everyone starting coming up with truly inspired ideas.

It very quickly became apparent how powerful this process could be. If I were to sit down and try to come up with five visual representations of a telephone, they would probably be very similar to any one else’s. But, the more time I spend progressing those ideas and building off of past concepts, my brain has no other course to take but to look for something less obvious. When I was doing the 100 boxes experiment, I would have to challenge myself not to repeat any ideas. One of the best ways I found to do this was to start asking questions of myself. How would Picasso draw a telephone? How would a deaf person use a telephone? What could power a telephone besides electricity? These random thoughts may not seem applicable, but this is how the creative mind functions. Generally, you will only expend enough effort to solve the problem at hand. So, it stands to reason that the more difficult the problem gets, the more creatively your mind will have to work to solve it.

It’s fairly common to see this approach taken in specialties like logo design, where there is a great need for companies to distinguish themselves. When paired with things like metaphors, irony and juxtaposition (very powerful tools, and potentially good topics for later), symbols and iconic representations become substantially more memorable because you are adding a level of meaning and depth. This can create intrigue and garner attention from viewers… which often translates into brand recognition and awareness.

Design is not always about technical prowess or skills with laying out a page. A lot of thought needs to go into the message behind the design. This is precisely why design is not merely decoration, but a guide to aid users to understand a message. In these early stages, there really are no wrong answers. Visual Thinking always begins with understanding your problem. The thinking basically becomes the game plan to visually solve the problem. In the instance of my class, the problem was simply to find unique ways to depict a telephone. The drawings that we were coming up with didn’t need to be polished renderings, because we were just working through a fast iterative process of idea gathering. Some people have trouble breaking themselves of the need to thoroughly render an idea before moving forward. Many times, this is effort that can be saved. If this is a problem for you, introduce some lighter constraints such as only working in ink (think big Sharpies), or strictly limiting yourself to 30 seconds per drawing. The most important part at this point is just capturing the idea. Finished designs have their place in the process, and it isn’t here.

I realize it’s not always possible to eliminate requirements and limitations when designing; these are the cold facts, as design isn’t always a blue sky endeavor. Someone else is paying the bills and they probably came to you with particular needs. This is just another way I find helpful in stimulating ideas. One thing needs to be emphasized here, all of the techniques I write about are merely possible options. There is no one-true-process. We all work and think differently than one another, so it should be plain to see that different types of techniques suit us best. The key is finding the arrangement that works best for you.

Here are some more resources on Visual Thinking:

Commentary (26):

1. Natalie Jost says… apr 13, 2006 | 12:45 pm

That’s beautiful. I now feel free to go back to my usual wackiness. Seriously, friends joke about me being the only one in the room who would tell you 10 different uses for an ashtray without ever mentioning a cigarette. ;) But 100? That’s an entirely new realm, and one I’m definitely going to work on!

2. Dave says… apr 13, 2006 | 1:35 pm

Thanks! I’m going to have to try some of this stuff.
I think for people like myself, who are doing design, production and coding, the hardest part of the design process is coming up with ideas without constantly thiking about how I’m going to pull it off. It’s difficult to suspend the left brain activity while the right brain is doing it’s thing.
Any advice for that?

3. Ian Adams says… apr 13, 2006 | 1:37 pm

I can attest that this method actually works really well. When I decided that I wanted to do a re-design for my site, I just started carrying my sketchbook with me and did some “visual thinking” — within a couple days I’d done enough that I’d figured out what the design would be.

Of course, I’m still working out the CSS, but getting down what I wanted for the design came really quickly when I just started splattering ideas all over the paper.

4. Jeff Croft says… apr 13, 2006 | 1:56 pm

Glad to see this series return, and with a terrific post, no less. Love these ideas. Keep up the great work, Jason.

5. Jeff Croft says… apr 13, 2006 | 1:59 pm

I should also note this: there are a lot of people in our field (including me) that weren’t classicly trained in graphic design. Many of us got to web design through a computer hobby, through computer science school, through psychology (think human/computer interaction), through journalisim, etc. These kind of posts really, really help me hone my visual design skills. So thanks. :)

6. Jason Santa Maria says… apr 13, 2006 | 2:06 pm

Dave: The best advice I can give you is to just break down your problems into smaller pieces. For me, in order to not start thinking about fonts and colors and things, I had to resort to doing things in basic grey scale. In order to stop thinking about what was possible to do on a web page, I had to move back to paper. It’s not always easy to just remove the constraints, but you can always focus more on the problem and the message than you do on the solution.

7. Ian Adams says… apr 13, 2006 | 2:54 pm

Exactly. You can always narrow down your font and colour choices later, but the key is to just get ideas out as fast as possible before they disappear into the ether.

8. macubu says… apr 13, 2006 | 6:54 pm

A constrained mind is always inventive in finding solutions. Writing isn’t different from designing, in this. Look at what the Oulipo did, in france, with writers such as Perec, Queneau, etc… Maybe their techniques could be an inspiration for designers too!
Ciao ciao.

9. Cash$ says… apr 13, 2006 | 7:14 pm

Really good article, Stan-o-man. I passed it on to all my designers this morning as mandatory reading. It is easy to get lazy in the creative process. Under the Loop #5 can expose those bad habits and correct them with fantastic results!

10. Kevin Tamura says… apr 13, 2006 | 8:03 pm

Great post Jason. In school we would do sheets and sheets of logos and page designs before ever settling on one to focus on. It was like peeling an onion: the first few layers are easy, but it gets really hard to get to the core.

11. Jeanne Pickering says… apr 13, 2006 | 9:42 pm

For those of us who come to the web from the programming/development side, I also recommend this posthumous collection of course materials from Rob Roy Kelly’s teaching. Some excellent exercises there for working on the creative side of your brain.

12. Ian Muir says… apr 13, 2006 | 9:47 pm

The 100 designs thing is very similar to a project I did in college. In one of my first classes for my New Media Class, the professor came in the first day and wrote about 10 words on the board. Then told us we had to pick one word and create 101 designs in one week. He also stipulated that we had to use Illustrator, which none of us knew.

The result was that most of us realized that it was the design that was important, not the tools. It also made me never want to draw an ant again.

13. Keith says… apr 14, 2006 | 11:24 am

I’m with Jeff. These posts are extremely helpful and give us non-trained designers a whole lot to think about.

14. Jason Santa Maria says… apr 14, 2006 | 11:27 am

Jeff and Keith: Well I’m glad you enjoy them. I have a running list of topics I plan to write about, but if there is anything in particular you want to see, drop me a line, or just comment here.

15. Kitty says… apr 14, 2006 | 3:50 pm

Thank you for posting this - inspirational stuff! I’ve been trying to get into the habit of doing at least a sketch a day to keep the art/design skills fresh - the 100 boxes concept is a great way to give it focus.

16. Olav says… apr 14, 2006 | 9:28 pm

Great stuff! You should write a book for web designers. No technical clutter, just inspirational pieces like this one.

Now, how about another article on freelancing. Lessons learned, tools of the trade and so forth. That would be pure gold! :)

17. ..ak says… apr 14, 2006 | 9:46 pm

Dave: I have the same problem. I get around it by focusing on what I know works. I can do part of the design with colors and form, another with HTML/CSS.

Jason: this isn’t about potential topics, but a way of supporting your posts. Can we have example images? I would love to peek into your sketchbook.

18. Andy Havens says… apr 14, 2006 | 11:09 pm

Neat game. Reminds me of “My Team, Your Team,” a game I play with my 6.5 year old son. Described here.

I’m more apt to get into writing games being… er… a writer by trade, but I’ll definitely be passing the “loupe” series onto the designers on my team. Thanks for the neat ideas, well written and well presented.

19. Shane Guymon says… apr 15, 2006 | 12:57 pm

I really enjoyed your thoughts on “visual thinking” That is the first process I always undergo when attacking a project.

20. Jason Santa Maria says… apr 16, 2006 | 10:45 am

Olav: Have you seen the other ones I wrote a little while back? Have a peek: Independent Workflow, Independent Contractor, and Maintaining Motivation.

…ak: Well, I gotta say, examples from my sketchbook aren’t entirely relevant since technique isn’t really the important part. But I know I like to look at others people’s sketchbooks too :D

I may post with some stuff form my sketchbook at some point soon, but until then you can see some pages from my sketchbook from the Holistic Web Design panel I was on at SXSW this year. Just go through the presentation slides until you get to the logo design section.

21. Angie says… apr 16, 2006 | 7:22 pm

Even for someone like me who did have formal training in graphic design, this series is a great reminder of great techniques. I also did something similar in college… I think my professor capped it at 25 though. :)

22. Frans says… apr 17, 2006 | 4:37 pm

Amazing that a story about “Visual” Thinking can generate such a grey page! Where are the pics?

23. Jason Santa Maria says… apr 18, 2006 | 4:45 am

Frans: Right there at the end of the article :D

24. reese says… apr 23, 2006 | 3:00 am

These suggestions are absolutely what I needed. Thank you!

You mentioned you’re open to suggestions on other articles. I would love to read about gathering reference material (visual, not technical). I find as a web designer that I’m often “stuck” in the web world as my source of reference, but when I’m asked to execute something specific (e.g. a Polynesian-inspired design that isn’t too kitschy) I’m lost in finding solid visual references. Some advice on finding references in the “real” world (books and otherwise) would be great—it’s daunting to know where to start sometimes.

25. Neil says… may 11, 2006 | 2:10 pm

Ah, the 100 boxes exercise - that’s a great one. A book I highly recommend for helping to improve one’s visual thinking abilities is Visual Literacy, by Judith and Richard Wilde.

I’ve used it in the classroom many times, and at least in my experience it’s proven to be a killer resource for training brains to think creatively. There are dozens of exercises just like the 100 boxes example mentioned here.

26. Carolyn says… sep 15, 2006 | 12:08 pm

I am new to your web site and articles but have really enjoyed them, especially the one about the sketch book. This one about visual thinking is especially pertinent for my teaching Graphic Design 1 and 2 students. So many Jr. college programs (and students) seemed to be focused on just learning the software and not the basics of creative visual thinking. Your article reinforces again my conviction that ideas need to be worked out on paper before going to the computer. thanks!
Are there other instructors out there that find this to be true?