February 2008 - Posts

Screencast: Real-World Process Documentation Example
Published 26 February 8 1:34 PM | Laurence | with no comments

In this screencast, Mark Sulzen, CIO of SmartDraw.com, walks us through documenting a typical process. His team recently implemented an update to the reseller order path and planned it out using SmartDraw.

Screencast: Fast Flowcharting Using Keyboard Shortcuts
Published 21 February 8 9:44 AM | Laurence | 1 comment(s)

In this screencast I show how easy it is to use SmartDraw to make and edit a flowchart. This is my first screencast so I'm open to any criticism about the my presentation or clarity. Enjoy!

For a more detailed rundown of flowcharting without the mouse, check out Josh's previous post on flowcharting.

Why Are You Still Using A Mouse To Make A Flowchart?
Published 12 February 8 2:26 PM | joshua | 4 comment(s)

 

 

The Stick Figure Problem

I can't draw a stick figure that does not look like it went through a blender.  I draw a line for their body, but it is never straight.  I add legs, but they are uneven.  Arms, but they start in the wrong spot, so they look like another set of legs.  The head, well, it's not pretty, it's not even a circle really.  More like a squashed egg. 

I am guessing you do not share my plight, but if you are like me and work for a company with a variety of processes and activities, you have probably made a flowchart.  Squares, circles, diamonds, trapezoids and a bunch of lines, yup, get that blender out.  Sure, you no longer have to grab your graph paper and #2 pencil as this can all be done on the computer with your mouse. 

  • But is a mouse really any better than a pencil?
  • Are you really better with a mouse than you are with pencil and paper? 

My flowcharts are a far worse massacre than my stick figures.  But I have to make flowcharts.  I use them daily to help keep my team on task, to explain to clients how a user test is going to go, and to visualize the branching of surveys before writing the HTML.  And I never write a single line of code without first creating some kind of DFD, ERD, or other specialized flowchart.  Does that sound at all familiar to you?

Escape the Mouse Trap

So what do we do?  Versions of Office prior to v2007 barely let you add shapes, and don't even try to make them look good enough for clients.  SmartArt in Office 2007 tries to let you make text list and turn it into a "flowchart", but we can only hope nothing requires us to deviate off a linear flow.  The need to a single yes/no decision renders SmartArt almost useless.  Pencil and paper still don't seem like such a bad idea eh?

 

We thought there had to be a better way.  I performed user test after user test looking for a better way.  The flowchart SmartPanel was the result of the testing.  No more dragging and dropping, just click and all the lines are added for you, and the shapes just know where to go to look good.  Major improvement.  Most users were able to document a process in less than 5 min, without having to go back and nudge things around.  As great as the new SmartPanel is, it is still not the best way to create a flowchart because you still have to use the mouse.

Hotkeys are Cool

If you're not using the arrow keys to make your flowcharts, you need to start.  Don't be scared, it is completely painless.  You do not need to know what CLI stands for to make a flowchart using your keyboard.  Do it once, and you will feel like the master of the universe, and bet you will even prefer to make flowcharts over boring outlines, just because they make you look so much cooler.  Are you ready, here it is...

7 Steps to a Flowchart:

1.       Open a flowchart template

2.       Find the "Add Below" control in the SmartPanel and click on it

3.       Hit CTRL+ right arrow key to add a shape to the right

4.       Hit CTRL+ down arrow key to add a shape to the below

5.       Hit CTRL+ left arrow key to add a shape to the left

6.       Hit CTRL+ down arrow key to add a shape to the below

7.       Hit shift+tab to move back to the previous step and start typing to add text

 

Give it a try, open SmartDraw and use the CTRL+arrow keys (up, down, left, right) to add shapes and tab or shift+tab to navigate until your flowchart is complete.  You can right click on each shape to change them as needed, and use quickstyles to give it your personal style.  Maybe it is just because I helped design this feature, maybe it is because I hate taking my hands off the keyboard, but I think Hotkeys are the best way to make a flowchart.  Don't you agree?

Delicious Products: Appealing To Emotional Buyers Through Visual Symbols
Published 1 February 8 5:34 PM | Laurence | with no comments

I was recently hurrying through the mall (horrible places, malls) and came across what must be the easiest, fastest sell in that massive hive of people, shops, and restaurants – cinnamon buns. Tell me this doesn’t make you hungry…

Dmitri after cinnabon

Even Dmitri could sell these if he hadn't tried to eat a whole one himself.

 Dmitri passed out

For a company like Cinnabon, visual communication is a no brainer. All they have to do is show a picture of the product and trigger the salivary glands of anyone within visual or olfactory range. Unfortunately, most of us don't sell cinnamon buns. 

What if you don’t have a delicious product?

Dmitri try to eat a lock

When I started to explain the benefits of visual communication to a friend of mine who works at a wholesale security company (they sells locks and other security products), he showed me the product page of their website - an attempt to show the visual nature of their site. The problem is this, unlike the cinnamon bun, the pictures of the locks don’t evoke any emotional reaction when pictured alone. Buying is an emotional decision. To help sell locks, we need a better visual strategy that triggers emotion.

visual strategy - lock

Concrete images that symbolize an abstract idea are often more effective than the abstraction itself. If I were to offer advice to the security wholesale business I referred to earlier in the article, it would be to create a set of "secure" visuals around the products and "insecure" visuals around the rest of the site. A main page that features a shady figure breaking in through a window at night (concrete visual that implies "insecure") makes a bold and bright product page feel that much safer. You might even say, delicious.

 

This article is the spiritual successor to The Two-Second Sales Pitch

Filed under: ,