Book Report: The Back of the Napkin, by Dan Roam

Dan Roam describes his visual thinking method as "... forcing ourselves to look at our idea from every point on the SQVID, a fascinating thing happens, with an equally fascinating outcome. We fullly activate both the left ("analytic") and right ("creative") sides of our brain."

He calls his thinking process toolkit, the swiss knife 3-4-5-6:

• 3 for tools: eyes, mind and hands
• 4 for process: look, see, imagine and show
• 5 for focus: SQVID (simple, quality, vision, individual, and delta -- change)
• 6 for framework: Portrait, chart, map, timeline, flowchart, and multiple-variable plots

I believe understanding 3, 4, 5, 6 is easy; but executing 3-4-5-6 is not. The visual thinking codex is a mesh, a matrix. It works best pictorialized:

This thinking matrix is based on Roam's graphics equalizer, which I find extremely useful:

 

I was also pleasantly surprised to find him writing about messaging and email (Page 122 -124) -- using a fake software vendor (SAX Inc) in his MBA crash course (Chapter 8 - 14).  It was inspiring to read about Bain & Company, whose logo derived from the earth's 2 North Poles, differentiating "how we are going to get there" from "we are going to get there". The book actually gets more interesting and inspiring as you read on.

To be honest, I had to make 3 attempts to get myself started on this book. At first, I was frustrated by it's casual monologue style of writing. Then I thought I should just scan the book by studying the pictures... but  that didn't work. Finally I realized that this book should be read "with pictures", and that the writing style is meant to have the author himself explaining his sketches as he draws, just like we would when we are presenting or sketching out your ideas.  So there... hope you enjoy your read too!

I'd like to dedicate this book report to Jon Asbury (my mentor) for introducing me the book, and Miss Yung (my English Literature teacher) for giving me the ability to appreciate.

"Look and Feel" vs. "Appearances and Behaviors"

We often hear this term "Look and Feel".  But who's look and who's feel are we talking about? "Appearances and Behaviors", does this mean the same thing? Apparently not. One can change the look and feel without changing the appearance and behavior of a design.  The former can be subjective while the latter definitely guides.

To excel in design, one needs to differentiate the above as different design goals. And the understanding of perception comes in handy.

"Perception is one of the oldest fields in psychology. The oldest quantitative law in psychology is the Weber-Fechner law, which quantifies the relationship between the intensity of physical stimuli and their perceptual effects." (full article)

The following screen may look like a coloring book exercise, but it is the initial step of blending "appearances and behaviors" with "look and feel".

Following are some iterations of the same screen over the course of the design process...

Usability testing brings invaluable insight and feedback, and is always FUN!

Creating Wireframes

Gaming mouse can have as many as 9 buttons... Well, just to give you an idea of how our hands work nowadays. Many designers have probably abandoned their sketch books and do everything with their mouse and keyboard. Some may stick with pen and paper. Similarly, when it comes to wireframing a web/UX design....

1. Some prefer using computer tools like MockFlow, Axure, Balsamiq Mockups, Pencil Project, HotGloo, Mockingbird, Cacoo, ProtoShare, iPlotz, OmniGraffle etc.as listed in this article: 10 Excellent Tools for Creating Web Design Wireframes.

2. Some would just enjoy the freedom of sketching with pen and paper. Following are some sketches, by Jon Asbury, in one of his recent social app design project that made its way into the G20 summit:

Home Screen Design

Community Screen Design

Profile Screen Design

Search Screen Design

The design workforce is evolving

 Here is a very interesting article from 2007: The Cross-Discipline Design Imperative which examines the conventional design workforce and how it will or should evolve... In essence, "those who can marry creative right-brain thinking and analytical left-brain thinking are at a premium...".

Over the last decade, website design created a big demand for cross-discipline design. Web developers and graphic designers have to understand marketing goals while marketers have to understand what is feasible and what is not. But over time, titles like webmasters have disappeared. Web developers and web designers still exist but their job requirements are no longer exclusive. In the past 5 years or so, newer job titles like Information Architect (IA), User-experience designer (UX) start to appear. This is due to yet another wave, an increasing demand for web applications. Software engineers are pulled into the game. Since most of the design workforce are not really trained in a cross-discipline curriculum, the user-centered design methodology has been widely adopted and has proven capable of holding a cross-functional team together. Personas are difficult to design but easy to understand and share.

One way to get a feel of the job market is to do a search on certain job titles or check out career pages of corporate websites. Not only will these reveal what a company is doing or where it is heading, these also provide valuable information on new tools and skill-sets required for certain jobs. A great way for someone to plan a career path!