Category: interaction design

Electronic Yellow Sticky Routing Slips: Tweets As Pointers

Published August 1, 2010 by cgerrish

After all this time, it’s still difficult to say what a tweet is. The generic form of the word has been expressed as microblogging, but this is the wrong metaphor. Blogging and RSS advocates see Twitter as a short-form quick publishing platform. What blogging tools made easy, Twitter, and other similar systems, make even easier. Given this definition, the 140 character limit on tweets seems to be an unnecessary constraint— microblogging could simply be expanded to miniblogging and a 500 character limit for individual posts. Blog posts can be any length, they are as small or large as they need to be.

“All my plays are full length, some are just longer than others.”
– Samuel Beckett

But Twitter didn’t start with blogging or blogging tools as its central metaphor, it began with the message streams that flow through dispatching systems. The tweet isn’t a small blog post, it’s a message in a communications and logistics system. There’s a tendency to say that the tweet is a “micro” something— a very small version of some normally larger thing. But tweets are full sized, complete and lack nothing. Their size allows them to flourish in multiple communications environments, particularly the SMS system and the form factor of the mobile network device (iPhone).

The best metaphor I’ve found for a tweet is the yellow sticky. The optimal post-it note is 3 inches square and canary yellow in color. It’s not a small version of something else, its size is perfect for its purpose. There are no limitations on what can be written on a yellow sticky, but its size places constraints on the form of communication. Generally, one expects a single thought per yellow sticky. And much like Twitter, explaining what a yellow sticky is to someone who’s never used one is a difficult task. Initial market tests for the post-it note showed mixed reactions. However after extensive sampling, 90% of consumers who tried the product wanted to buy it. Like the tweet, the post-it note doesn’t have a specific purpose. Arthur Fry, one of the inventors of the post-it note, wanted a bookmark with a light adhesive to keep his place in his hymnal during church choir. The rapid acceptance of the yellow sticky, in part, had to do with not defining what it should be used for. It’s hard to imagine someone saying that you’re not using a post-it note correctly, although people say that about Twitter all the time.

One thing people use yellow stickies for is as a transmittal. I find a magazine article that I like and I pass it on to you with a short message on a yellow sticky that marks the page. I might send this package to you through the mail, use inter-office mail at work, or I might just leave it on your desk. More formal routing slips might request specific actions be taken on the attached item. Fax cover sheets are another example of this kind of communication. And Twitter is often used in a similar way. The hyperlink is the adhesive that binds the message to article I’d like to pass on to you. With Twitter, and other directed social graph services, the you I pass things on to includes followers, potentially followers of followers and users who track keywords contained in my message. At any given time, the who of the you will describe a different group. The message is passed on without obligation, the listeners may simply let it pass through, or they may take up the citation and peruse its contents.

Just as the special low-tack adhesive on the back of a yellow sticky allows you to attach it to anything without leaving marks or residue, the hyperlink allows the user of Twitter to easily point at something. Hey, look at this! Rather than a long explanation or justification, it’s just my finger pointing at something of interest. That’s interesting to me. It’s the way we talk to each other when the words aren’t the most important part of the communication.

This model of passing along items of interest is fundamentally different from web syndication. Syndication extends the distribution of published content to additional authorized contexts. Some may argue that the mostly defunct form of the ‘link blog‘, or an aggregation of link blogs, offers exactly the same value. The difference is that the tweet, as electronic routing slip, exists in a real-time social media communications system. It operates like the messages in a dispatching system. There’s an item at 3rd and Webster about cute kittens, here’s the hyperlink for interested parties. Syndication implies that I think what I’ve published is valuable, I’ve extended my distribution area and you should have a look at it. With a tweeted electronic routing slip, the value is assigned by the reader who decides to pass something along and the readers who choose to take it up within a real-time (instant) messaging system. Value is external to the thing being evaluated.

As we start to look at new applications like Flipboard, an app that collects routing slips from your social network and lays them out into a magazine format, it’s important to understand the basic unit from which the experience is built. We’re used to a newspaper filled with a combination of syndicated wire stories and proprietary ones. We know about magazines where all the stories are proprietary. A few of us are familiar with web syndication aggregators that allow us to pull in, organize and read feeds from thousands of publication sources. Building an electronic publication from sets of real-time routing slips is a fundamentally different editorial process than we’ve seen before. Of course, it could be that you don’t find the stories that your friends pass on to be very interesting. In the end, this method of assembling a real-time publication will be judged based on the value it provides. A magazine with a thousand stories isn’t really very useful, just as a Google search result with a million answers doesn’t help you find something. Can you imagine a real-time magazine that captures the ten stories that are worth reading right now? Can you imagine a time when such a thing didn’t exist?

63 Comments

Stories Without Words: Silence. Pause. More Silence. A Change In Posture.

Published July 25, 2010 by cgerrish

A film is described as cinematic when the story is told primarily through the visuals. The dialogue only fills in where it needs to, where the visuals can’t convey the message. It was watching Jean-Pierre Melville’s Le Samourai that brought these thoughts into the foreground. Much of the film unfolds in silence. All of the important narrative information is disclosed outside of the dialogue.

While there’s some controversy about what percentage of human-to-human communication is non-verbal, there is general agreement that it’s more than half. The numbers are as low as 60% and as high as 93%. What happens to our non-verbal communication when a human-to-human communication is routed through a medium? A written communique, a telephone call, the internet: each of these media have a different capacity to carry the non-verbal from one end to the other.

The study of human-computer interaction examines the relationship between humans and systems. More and more, our human-computer interaction is an example of computer-mediated communications between humans; or human-computer network-human interaction. When we design human-computer interactions we try to specify everything to the nth degree. We want the interaction to be clear and simple. The user should understand what’s happening and what’s not happening. The interaction is a contract purged of ambiguity and overtones. A change in the contract is generally disconcerting to users because it introduces ambiguity into the interaction. It’s not the same anymore; it’s different now.

In human-computer network-human interactions, it’s not the clarity that matters, it’s the fullness. If we chart the direction of network technologies, we can see a rapid movement toward capturing and transmitting the non-verbal. Real-time provides the context to transmit tone of voice, facial expression, hand gestures and body language. Even the most common forms of text on the Network are forms of speech— the letters describe sounds rather than words.

While the non-verbal can be as easily misinterpreted as the verbal, the more pieces of the picture that are transmitted, the more likely the communication will be understood. But not in the narrow sense of a contract, or machine understanding. But rather in the full sense of human understanding. While some think the deeper levels of human thought can only be accessed through long strings of text assembled into the form of a codex, humans will always gravitate toward communications media that broadcast on all channels.

One Comment

Vanilla Flavored: The Corporate Web Presence

Published June 22, 2010 by cgerrish

The corporate web site used to have a brilliant excuse for its plain and simple execution. It needed the broadest possible distribution across browsers and operating systems. All customers, regardless of the technical specs of their rig, needed to be served. Some basic HTML, a few images, a conservative dollop of CSS and javascript. Transactions and data are all handled on the back end with a round trip to the server for each and every update of the display. And the display? Order up a screen resolution that serves 90%+ of the installed base as reported by server logs. Make that 800 x 600, just to be sure. This down level, conservative approach has been baked into enterprise content management systems and a boundary has been drawn around what’s possible with a corporate web presence. Mobile web was even simpler, a down level version of a down level experience. Rich internet applications (RIAs) were put into the same category as custom desktop apps, generally not worth the effort.

Back in 1998, Jakob Nielsen reported on the general conservatism of web users:

The usability tests we have conducted during the last year have shown an increasing reluctance among users to accept innovations in Web design. The prevailing attitude is to request designs that are similar to everything else people see on the Web.

When we tested advanced home page concepts we got our fingers slapped hard by the users: I don’t have time to learn special conventions for your site as one user said. Other users said, Just give it to us plain and simple, using interaction techniques we already know from other sites.

The Web is establishing expectations for narrative flow and user options and users want pages to fit within these expectations. A major reason for this evolving genre is that users frequently move back and forth between pages on different sites and that the entire corpus of the Web constitutes a single interwoven user experience rather than a set of separate publications that are accessed one at a time the way traditional books and newspapers are. The Web as a whole is the foundation of the user interface and any individual site is nothing but a speck in the Web universe.

Adoption of modern browsers was thought to be a very slow process. In 1999, Jakob Nielsen insists that we would be stuck with old browsers for a minimum of three years. Here was another reason to keep things plain and simple.

The slow uptake speeds and the bugs and inconsistencies in advanced browser features constitute a cloud with a distinct silver lining: Recognizing that we are stuck with old technology for some time frees sites from being consumed by technology considerations and focuses them on content, customer service, and usability. Back to basics indeed: that’s what sells since that’s what users want.

Over time, a couple things changed. The web standards movement gained traction with the people who build web sites. That meant figuring out what CSS could really do and working through the transition from table-based layouts to div-based layouts. Libraries like Jquery erased the differences between browser implementations of javascript. XMLhttpRequest, originally created for the web version of Microsoft’s Outlook, emerged as AJAX and turned into a defacto browser standard. The page reload could be eliminated as a requirement for a data refresh. The Webkit HTML engine was open sourced by Apple, and Google, along with a number of other mobile device makers, began to release Webkit-based browsers. With Apple, Google, Microsoft and Mozilla all jumping on the HTML5 band wagon, there’s a real motivation to move users off of pre-standards era browsers. Even Microsoft has joined the Kill IE6 movement.

The computing power of the cloud combined with the transition from a web of documents to a web of applications has changed the equation. Throw in the rise of real-time and the emergence of social media: and you’ve got an entirely different ballgame. With the massive user embrace of the iPhone, and an iPad being sold every three seconds, we might want to re-ask the question: what do users want?

Jakob Nielsen, jumps back to 1993 in an effort to preserve his business model of plain and simple:

The first crop of iPad apps revived memories of Web designs from 1993, when Mosaic first introduced the image map that made it possible for any part of any picture to become a UI element. As a result, graphic designers went wild: anything they could draw could be a UI, whether it made sense or not.

It’s the same with iPad apps: anything you can show and touch can be a UI on this device. There are no standards and no expectations.

Worse, there are often no perceived affordances for how various screen elements respond when touched. The prevailing aesthetic is very much that of flat images that fill the screen as if they were etched. There’s no lighting model or pseudo-dimensionality to indicate raised or lowered visual elements that call out to be activated.

Don Norman throws cold water on gestures and natural user interfaces by saying they aren’t new and they aren’t natural:

More important, gestures lack critical clues deemed essential for successful human-computer interaction. Because gestures are ephemeral, they do not leave behind any record of their path, which means that if one makes a gesture and either gets no response or the wrong response, there is little information available to help understand why. The requisite feedback is lacking. Moreover, a pure gestural system makes it difficult to discover the set of possibilities and the precise dynamics of execution. These problems can be overcome, of course, but only by adding conventional interface elements, such as menus, help systems, traces, tutorials, undo operations, and other forms of feedback and guides.

Touch-based interfaces built around natural interaction metaphors have only made a life for themselves outside of the research laboratory for a few years now. However I tend to think that if these interfaces were as baffling for users as Norman and Nielsen make them out to be the iPhone and iPad would have crashed and burned. Instead they can barely make them fast enough to keep up with the orders.

The classic vanilla flavored corporate web site assumes that users have old browsers and don’t want anything that doesn’t look like everything else. All new flavors are inconceivable without years and years of work by standards bodies, research labs, and the odd de facto behavior blessed by extensive usability testing. There’s a big transition ahead for the corporate web presence. Users are way ahead and already enjoying all kinds of exotic flavors.

Comments closed

The Base and the Overlay: Maps, MirrorWorlds, Action Cards

Published March 28, 2010 by cgerrish

There are natural and abstract surfaces onto which we overlay our stories. The sphere that we paint water and land masses on represents the natural shape of our small planet. For other endeavors we designate abstract work surfaces. One early example of this idea is the organizational scheme of Diderot’s encyclopedia. While subjects were laid out in alphabetical order, the book also contained conceptual maps and cross-linking to super-impose the natural shape of the history of ideas on to the abstract system of organization. This blending of the abstract and natural (GUI and NUI) that informed Diderot’s project is a theme that has returned as we build out the mobile interaction points of the Network.

The alphabet is ingrained at such an early age through the use of song, that we often feel it’s an artifact of the natural world. The fact that so many of us can recite a randomly ordered set of 26 symbols is a triumph of education and culture. The neutrality and static nature of the alphabetic sequence allows us to organize and find things across a community with little or no coordination. Although, the static nature of the alphabetic sequence is rather unforgiving. For instance, my book and CD collections are both alphabetically ordered. Or at least they were at one point in time. And although I understand why things get into a muddle, it doesn’t help me find the book that’s just flashed through my mind as I look at the shelves in front of me.

These maps, both natural and abstract, that we use to navigate our way through the world are becoming more and more significant. Especially as our ability to represent the physical world through the Network becomes more high definition. Just as with the alphabet, we’ll tend to forget that the map is not the territory. Borges’s story about the futility of a map scaled to exactly fit the territory has an important message for our digital age:

In that Empire, the Art of Cartography attained such Perfection that the map of a single Province occupied the entirety of a City, and the map of the Empire, the entirety of a Province. In time, those Unconscionable Maps no longer satisfied, and the Cartographers Guilds struck a Map of the Empire whose size was that of the Empire, and which coincided point for point with it. The following Generations, who were not so fond of the Study of Cartography as their Forebears had been, saw that that vast Map was Useless, and not without some Pitilessness was it, that they delivered it up to the Inclemencies of Sun and Winters. In the Deserts of the West, still today, there are Tattered Ruins of that Map, inhabited by Animals and Beggars; in all the Land there is no other Relic of the Disciplines of Geography.

Google spiders the Network for its search index and then presents algorithmically-processed search engine results pages in response to user queries. The larger map is not in plain view, just the slice that we request. It seems as though for any question we can imagine, Google will have some kind of an answer. The map appears to cover the territory point for point. Even the ragged edge of the real-time stream is framed in to the prioritized list of responses. The myth of completeness covers over the gap between the map and the territory, and the even the other maps and communications modes we might use within the territory.

If a tree falls in a forest in China, and there’s not a Google search result page linking to the event, does it make a sound?

Reading and writing to the maps of the Network has long been facilitated by Graphical User Interfaces. While the abstract metaphors of the GUI will never go away entirely, we’re seeing a new set of Natural User Interfaces emerge. Designing a better, simpler and clearer abstraction is giving way to finding the gestures that map to the natural contours of our everyday lived experience.

Natural interaction with high-definition representations via the Network has opened the door to what David Gelernter calls Mirror Worlds. Just as the fixed nature of the alphabet provided us with a set of coordinates on which to hang our collections of things, geo-coordinates will provide a similar framework for mirror worlds. Both Google and Microsoft have pasted together a complete base map of our entire planet from satellite photography and vector graphic drawings.

As with the search index, the base map provides us with a snapshot in time; we see the most recent pictures. The base is a series of photographs, not a real-time video stream. Even at this early phase of the mirror world we can see an overlay of real-time data and messages projected on to the base map. While we might expect the base map to move along a curve toward higher and higher fidelity and definition, it seems more likely that the valuable detail will find its home in the overlays.

The base map will be a canvas, or a skeleton, on which we will overlay meanings, views, opinions, transaction opportunities and conversations. While there will be a temptation to somehow ‘get it right.’ To present a compete and accurate representation of the territory— mapping each point, and each data point, with absolute fidelity and accuracy, it’s here where we wander off into Borges’s land of scientific exactitude and the library of babel. The base map only needs to be good enough to give us a reference point to hang our collections of things on. And, of course, realism is only one mode of expression.

The creation of overlays is the province of the mashup, the mixing of two distinct data sources in real time. Maps and twitter, apartment locations and craigslist, potholes and San Francisco streets, a place/time and photographs of a special event— all these implementations have demonstrated that geo-mashups are possible and happening continuously. But as this sea of real-time data washes across the surface of the map, we’d like a seat at the mixing board. A URL that pre-mixes two or more data sets has it’s use, but it’s a static implementation.

The framework of selectors and action cards may have the most promise here. Action cards are already engineered to work as overlays to base maps of any kind. When mixing and matching geo-location coordinates on the base map with streams of data, including identity-specific private data, is just a matter of throwing action cards from your selector on to a base map, you’ll have a natural user interface to a mirror world. And while the gap between the map and the territory will remain, as Baudrillard might say, the map begins to become a kind of territory of its own.

Comments closed