To the front pageThe Interaction Designer's Coffee Break - Weekly postings and quarterly articles about interaction design  
  To the front pageSign outTo the frontpageSearch in GUUUI postingsAbout GUUUI  

ISSUE 04 - October 2002

InfoRomanticism on the Internet
Romantic sensibility in the design of online content

By Nate Burgos

To state the painfully obvious: The internet is becoming more data-intensive. This is both an inevitable and perpetual reality. This amplifies the call of interface and interaction designers. However, the skills to transform raw and visceral data into usable information are useless without a core set of positive principles that imbue work with a formal and functional resonance. These values may be deemed basic, but this reaction only rests on the surface. The "basics" must never be overlooked. And being mindful of these fundamental actions in the design of online experiences leads to profound results:

  • Conceptualize, conceptualize, conceptualize
  • Collaborate or evaporate
  • Consistently consult past and current examples

Conceptualize, conceptualize, conceptualize

Interface and interaction design is an iterative process. The iterations stem from asking as many questions as possible no matter how moot or pertinent: What is the nature of the data? What is trying to be said with the data? What is trying to be done with the data? What data is necessary? How much data is being dealt with?

To stimulate the visualization of potential answers, apply the art of drawing. This takes the form of hard sketches. Other synonyms include models, diagrams, renderings, thumbnails, storyboards, flat prototypes, studies, and "wireframes" (a term that I recently picked up). The benefit of drawing is to quickly provide a relative map of elements, text and graphics, in a playful format to expedite exploration of ideas. Drawing promotes an organic growth of concepts. Toggling between risk-taking and discovery-making is inherent here. Such a conceptual evolution provides an engaging platform to determine distinction and relevance of a variety of approaches. This, in turn, streamlines a concept's approval and translation into code.

Where to begin in conceptualizing an interface and its interaction may be the first question, if not the most common. With drawing, beginning anywhere is the liberating stroke.

Collaborate or evaporate

Interface and interaction design thrives on conversation. The interface is a social construct that requires multiple perspectives, those of information architects, specification producers, usability experts, technologists and strategists. The body of knowledge that constitutes interface and interaction design must complement those of other project participants. The benefit of a multi-disciplinary approach is the rich conceptual coverage of what is possible and how it can be realized.

In addition to the value of drawing as a communal activity in conceptualization, another source to provoke dynamic collaboration is what I peg as shared thought-logging. An intranet is ideal in this case to quickly and easily post any issue or idea for open discussion and decision-making. The search-engine company Google utilizes their internal web in fostering and gathering thoughts about enhancements and innovations by their employees:

"Google's idea search starts with an internal Web page that takes minutes to set up. Using a program called Sparrow, even Google employees without Internet savvy (there are a few) can create a page of ideas. That enables the company to cast its net across its 300-plus employees." [1]

Channeling web technology for internal ideation provides a means to create and capture conversations percolating in peoples' heads at any given moment. The result is a true "community of inquiry."

Consistently consult past and current examples

Within the laboratory known as the Visible Language Workshop (VLW), at the Massachusetts Institute of Technology (MIT), which she founded in 1973 and directed for 20 years, Muriel Cooper's "information landscapes" is a benchmark example of envisioning information. Data is imbued with the spatial properties of land represented by undulations, embankments, openness and escalations. Geography is evident in Cooper's imaginative take on how data can be experienced. Typography has become interactive cinematography. Data has taken on an animated dimensional character to evoke a sense of place.

Before the VLW, new ways of experiencing data were created at the Office of Charles and Ray Eames. The Eameses' filmic sense in describing a broad range of subjects from history to biology was prolific and testifies to their imaginary fusion of art and technology to educate people about the complex and subtle phenomenons of the world. The enormous data found in the material and the immaterial was their passion:

"As the Eameses were commissioned to convey larger and more complex amounts of information in short periods of time, they developed new media techniques. Their multiscreen presentations and slide shows fulfilled their belief that learning should be a sensory and pleasurable experience and that ordinary objects could convey lessons about major social and cultural issues." [2]

Muriel Cooper's VLW and the Office of Charles and Ray Eames, among other examples, are imaginary and passionate precursors to current and future internet communications:

Inxight Software's "Hyperbolic Tree" views information as growing-and-expanding branches of cells. The entrant interacts with an extensive body of data consisting of interconnected units that can be pushed-and-pulled to reveal or hide other connections to other sibling units of data.



Morningstar's handling of quantitative data demonstrates sensitivity in making complex investment data friendly and portable in a very small space to non-investment savvy users. Thoughtful handling of typography and color is used to show numerical definition and illicit comparative relationships amongst diverse groups of data.



SmartMoney's "Map of the Market" initially appears as a Cubist painting, but the pattern of colored rectilinear fields is a quantitatively-generated representation of the market's sectors in real time. The allure of its abstraction invites interaction, for each sector leads to an array of links pertaining to the stocks contained within its boundaries. The size of the stock field is determined by its share of the sector.



Plumb Design's "Thinkmap" shows content-relationships as animated macro-groups leading to related data. The motion-agitation evokes a sense of vitality, for the data appears to be breathing, enticing the user to interact with the data.



What the examples demonstrate is the value found in the fundamental actions of conceptualization, collaboration and building upon the standards of pioneers of visual communications. The examples also demonstrate fusion of imagination and passion in actualizing a vivid experience of information. The drivers of this romantic goal can be described by the following challenges:

Pushing the Poetics of Data

  • Being mindful of the internet as a pliable medium for enhancing the voice of data
  • Encouraging participation for self-discovery with the data
  • Facilitating wayfinding through dense and dynamic bodies of data

Celebrating the Creature of Data

  • Celebrating data as living information
  • Treating data as a body, organic and evolutionary and as an entity bigger than ourselves

The presentation of data fueled by technological advancement and societal shifts continually inject excitement into the Web. In as much as the Gutenberg Galaxy, the printed medium, stirred a mass exploration of its communicative power. The Web, a digital medium, has a character that also beckons exploration moreover. It is a brave new canvas for the interface and interaction designer, whose endogenous qualities of imagination and passion are needed to make data accessible on both an aesthetic and pragmatic level. This is Romanticism with transforming data into usable Information. Such Romanticism is vital in contributing to the meliorism of the internet age and the information ages to come!

[1] "How Google Searches Itself" by Fara Warner, Fast Company magazine, July 2002.
[2] James H. Billington 1997. The Work of Charles and Ray Eames: A Legacy of Invention. New York, New York: Harry N. Abrams, Inc.; pp. 15-26.

"It is a brave new canvas for the interface and interaction designer, whose endogenous qualities of imagination and passion are needed to make data accessible on both an aesthetic and pragmatic level."


"Discovering Design: Explorations in Design Studies" Edited by Richard Buchanan and Victor Margolin

"inform" design journal of the American Institute of Graphic Arts (AIGA) Chicago chapter

"Information Ecologies: Using Technology with Heart" by Bonnie A. Nardi and Vicki L. O'Day

"Interface Culture: How New Technology Transforms the Way We Create and Communicate" by Steven Johnson

"Internet Dreams: Archetypes, Myths, and Metaphors" by Mark J. Stefik

"Work, Life, Tools" Edited by Milton Glaser, Photographed by Matthew Klein, a growing webliography dedicated to filtering the WWW for potentially usable content on the family of design disciplines: architecture, fashion, graphic, industrial, interactive and interior design.

  To the front pageSign outTo the frontpageSearch in GUUUI postingsAbout GUUUI