Complex Diagrams

June 1, 2008

Pixel rulers in Visio

Filed under: diagrams, mine, how to, user experience, interface, visio — Noah @ 11:05 pm

Should you be required to work in Visio, you may well find yourself, as I did, wishing to measure your drawing in pixels. I couldn’t figure out how do do it, though Visio does support such diverse measurements as Ciceros and Didots.

I finally found the definitive answer from Microsoft: For some types of drawings, you may want to change the measurement units to pixels. However, a pixel isn’t a unit of measurement. A pixel is just a dot on a screen and the size of the dot varies for different screens. To simulate pixels, set the measurement units to points.

Needless to say, this is not satisfying. It’s true a pixel is only an on-screen measure, and is clearly only useful for a few, obscure situations, such as when creating interface mockups, wireframes, or prototypes for software, the web, or any other sort of images meant to be viewed on a screen.

Luckily, Visio provides a set of features that allow a fairly simple, two step work-around. Warning: doing this on existing Visio documents may severely distort your existing drawings. I suggest working on duplicate files, not originals.

Step One Open the File > Page Setup menu and select the Page Properties tab. In the Measurement units field select Picas.
page_properties

Step Two In the same dialog box, select the Drawing Scale tab. Select the Custom Scale radio button and set the ratio to 1 p = 16 p.
drawing_scale

That’s it. Click OK and you’re all set to go.

Why it works Picas are 6 to the inch. By setting the ratio at 1:16, Visio presents a diagram at 96 picas per inch, the same as the Windows standard of 96 pixels per inch. You could set an appropriate ratio with any of the available units, but it works well with picas, and I find it useful that all units are labeled as p.

Here is a Visio file template with the units set properly.

January 28, 2008

Multi-touch: Why the iPhone Matters

Filed under: interface, theory — Noah @ 5:10 pm

The introduction of the iPhone heralded the mainstreaming of a new interface paradigm. Features and form factor aside, the multi-touch interface represents the first major interface change since the introduction of the Macintosh GUI in 1984, and a notable shift in the right direction.

Twenty years ago, Donald Norman described the relationship between a control and its effect as mapping. “Natural mapping, by which I mean taking advantage of physical analogies and cultural standards, leads to immediate understanding.” (Norman, D. 1990. The Design of Everyday Things. Doubleday/Currency. P23.) Unfortunately, when there is not a “natural mapping,” understanding is anything but immediate.

Technology interfaces are difficult to design and learn because interfaces have moved further and further away from natural mappings. When the tool in question is an axe or a spoon, the relationship between the control and its effect is clear and direct. Similarly, for simple mechanical tools such as food grinders, adjustable wrenches, latches, and the like, it’s not too difficult to divine the function with no documentation. The interface is inseparable from the tool or device, and the mapping is strong.

Electrical devices are a little trickier. The function of simple electric tools with very few controls, such as power drills, can get be figured out, even with no labels. Anything more complex, say, a multi-speed blender, benefits from having a clear label on each button. The reason is that when the interface for a device reaches that level of removal from the function, there is no longer a truly natural mapping between the control and effect.

When we move from electrical devices to electronic, labels and documentation are necessary to make the interface understandable. A microwave or VCR with no labels on the buttons would be totally unusable. There are simply no “natural” mapping conventions for users to draw on, and it becomes more important than ever for the interface designer to do a good job at creating and conveying the interface metaphor.

Finally, at the level of virtual or information-based interfaces, the interface is completely removed from any effect it may have. This is most evident in text-based interfaces; contemporary GUIs are a fancier presentation layer but retain the same underlying problems. Playing a game, shopping, and everything else onscreen is accomplished with the same clicks. It is only by virtue of the provided context that we are able to understand what we’re doing. Consequently, when interaction designers don’t do a good job of creating metaphor, the provided context is insufficient and users get confused.

The Windows-Mouse-Pointer-based GUI, first commercialized by the Macintosh in 1984, gave us a very limited physical metaphor. The mouse allowed us to indicate the noun we wanted to do something to, and then do a verb to it. Most verbs were menu based, and a few (selecting, dragging, clicking) could be executed directly. That amounted to poking our simplistic virtual worlds with a stick through a narrow window. This limited ability to affect the virtual environment is often frustrating.

The iPhone is special and noteworthy because it takes us a step back down the path back towards the physical. Steve Jobs notes “there are no ‘verbs’” in the iPhone interface. Instead of selecting nouns and then indicating a verb, we can simply do the physical action to the virtual thing as though it were a physical thing. Gestures for scrolling, dragging, and pinch-resizing work as we’d expect. The result is an interface that toddlers learn in seconds, and experienced users are delighted by.

It’s not perfect, there are still many places where buttons and lists of options must be used, but it’s the most interesting, different, relevant change to interfaces in decades. It’s also just the first drop in a big, big bucket, evidenced by the recent introduction of the MacBook Air, which supports multi-touch and gestures on its trackpad. Gesture based interface will spread to more devices, and devices that don’t support gestures will eventually seem antiquated.

Apple made a great choice by commercially introducing a radical new interface paradigm on a finite, portable, accessible platform, and building on it from there. As a herald of the next wave of interface technology, the iPhone represents much more than the sum of its pretty parts.

Powered by WordPress