Information Encounters Part 4: Web and Interaction Design

In the fourth and final part of this Information Encounters series I look at design for web and interaction. I first wrote this article in 2004 with a first year undergraduate audience in mind. Much has changed in the intervening years: the growth of social media such as Facebook; and the ease of use of online communication such as blogging; has meant that these modes of information transfer have been integrated into our daily experiences.

The image below is a blog theme designed by Khoi Vinh designed for WordPress

Website and interaction design

Website and interaction design are often linked as related activities, however interaction design is emerging as an overarching discipline in its own right. Interactivity is an umbrella term for many situations where there is a two-way flow of information between users or users and things. The term interactive implies that there is an element of something or someone responding to a user’s input and that there is a reciprocal relationship. Information is the base currency of most communication and is central to interactive design.

The image below is of a simple website design for Hyperkit.

Putting users first

When designing for interactivity the designer has to afford particular attention to the potential user of the experience. This means putting the user first and understanding their perspective. Many websites fail to reach their target audience through a lack of user awareness, and misunderstanding the psychology of the medium and its linguistic conventions.

Sensorial interaction

We interact with the world through our five senses of sight, hearing, touch, taste and smell. They influence our intellectual and emotional understanding of all we encounter. The smell of baking bread in a supermarket or the interior of a new car can influence our purchasing decisions.

The image below is of the Famous Grouse Visitor Centre by Land Design. Digital water reacts to the pressure exerted by visitors. The technology involves seismic floor sensors which trigger data projectors.


Typography on the net

Information is the backbone of the web and typography is the interface by which we gain access to knowledge. The web designer attempts to make information navigable, interactive and where possible customised to the end user. Designers require an understanding of the ways in which typography functions differently within screen and print environments. Legibility and readability are important concerns for both situations – text on screen is not as readable as in print and. Typefaces designed for print will not always translate well onto the screen and specially designed fonts for screen use are prevalent. Text that extends across the width of a browser window is difficult to track and tires the eye, however multi-column setting that requires vertical and horizontal scrolling probably won’t get read. A type size of 9 point in print is acceptable but would have people squinting if used on screen. There are a number of ways to display type on the net such as html text and graphic text. Graphic text is a low-resolution image of type. It won’t print out cleanly, can’t be copied or edited, won’t re-flow and can’t be indexed by search engines. A good site designer will check their site on various machines, in different browsers and on different platforms because factors such as colour and html type can display differently between screens.

Writing for the net

There is more to writing for the Internet than simply transferring print documents to screen via a pdf. People don’t browse the net in the same way as they do a magazine. The text has to be written shorter in length with additional headings; broken down into smaller paragraphs; links added; and sequenced over a number of pages. A clear and consistent style of writing should be adopted throughout with consideration given to: tone of voice; language; and cultural context, particularly when information is intended for a global audience. It was reported that some early internet users, unfamiliar with the language of the web, left websites when confronted by a button saying go. The intention was that they should go to the next link not leave.

A diagnostic activity

Website design can be viewed as a diagnostic process analysing the purpose and function of a site and removing extraneous elements. The website often acts as a catalyst for evaluating the structure of an organisation and all aspects of its presentation through other media such as print. It is a sobering thought for organisations to realise that someone viewing a page on their website is one click away from leaving. User consideration is a compelling argument for businesses that want to stay in business.

Aesthetics versus usability

There is much debate over the relative importance of the appearance of design and usability. The early dot com crash was in some part due to a misunderstanding of the web. The fashion for Flash-based sites is highly seductive as they look and sound cutting-edge. Appearance is a powerful marketing tool and companies feel obliged to invest in trend-setting animated sites to remain competitive. Many designers previously concentrated on the front-end graphics believing this sufficient to attract attention to a site. What became neglected was the job of guiding people through the rest of the content. Attractive and entertaining introductory pages that were winning awards weren’t helping to sell company’s products and services. People now know the difference between Flash and html sites. If people are searching for information or want to buy something and they get a Flash intro screen they may just stop there.

Information or entertainment or both?

A visitor to a music-based website might expect to have an experience equivalent to a pop video. The site may be an infotainment site and catering for a particular audience who may have leisure time to casually surf and engage with the fun elements of the site. An information-orientated site might not work in this instance. Clear access to information might lead to a limited experience, it might not lead to chance encounters with other content.

The curse of information design

In ‘The Curse of Information Design’, Scott Jason Cohen makes a plea to remember imagination, intuition and chance when all the talk is off usability. Information architects, user experience consultants and usability experts provide useful guidelines on well-structured sites. He warns us that ‘Jackson Pollock and John Cage would run screaming from the web for one reason: there is no room for the happy accident’. Creativity can be seen as a dangerous thing on the web, it’s a business gamble. A novel presentation or pioneering interface might engage the potential visitor or simply confuse them. You might lose a customer so convention persists and a site that might have introduced new ways of conveying information is abandoned. Cohen suggests an alternative vision. ‘The Internet is the single greatest collaborative effort ever in the history of mankind. It is a funhouse mirror of our collective imagination’. Usability is an important issue but it should not be used as an argument against innovation within a growing discipline.

Database sites

One of the advantages of this medium is the ability to summon and reconfigure information according to individual choice. Searching for information can equally be highly frustrating. Database sites need some parameters so as not to overwhelm users with data.

Design for intuition

When a user arrives at a web page they scan for words and images and expect to be able to click selections. These are normally links to other items on the page or different pages. The onscreen arrow may remain in the same position. The designer can choose to exploit this by ensuring another related link is at this location on screen. An unrelated link might seem counter-intuitive. The convention of clicking is now an intuitive action and we expect a response to result. Clicking a thumbnail enlarges an image. Click again and it disappears. Virtual environments use analogies of the physical world. Home is where we start most of our journeys. A link back to a home page is a reminder of a starting point. We enter or exit buildings through doors.

Search engines

Search engines help people find things on the web. They are like vast libraries and allow us access to limitless information. Search engines locate and index sites through html. There are now strict protocols governing the way sites are indexed. Google assesses websites through: site name; page titles; html text; images with alt tags; meta tags; and key words. The site is scored and rated on these criteria and placed in a hierarchical index. Ratings are subject to constant change and have led to bidding wars for keywords and sponsored links. Websites can also be registered with search engines so that they are indexed in advance. Linking to a site that is already indexed by a search engine will also ensure that your site will be found through your link. Popularity or contextual ratings increase the chances of appearing higher in search results, the more people viewing and linking to your site the more popular your rating. Websites are not only to be judged on their appearance and content but also how well they have complied with search engine indexing systems. A good website designer will not overlook the ‘under the bonnet’ engineering that will ensure the information gets seen.

Who hasn’t Googled themselves? How many times do you come in the top ten?

Interaction design

Interaction design is still in its infancy. As with any new discipline there is a period of experimentation and testing the technology. The outcomes may have no specific commercial or utilitarian application. These are attempts to understand the implications of the medium for the wider world. Public acceptance of interaction design will be reliant on knowledge of potential users’ and their reactions to new concepts. How will they know how to interact? Will they be curious or phobic?

The image below is the L’Oréal Poetry Harp by the Small Design Firm. Pluck a string and a digital stream of type is released extolling the virtues of women.

A new model of information communication

Interaction design allows users to experience communication in far more fluid terms, and invites people to immerse themselves in an experience where they are central to the construction and interpretation of meaning.

Immersion

Immersion refers to intense experiences that engage us at the deepest levels and draw us into an alternative world. Immersive experiences can equally be as simple as reading a book, listening to music or watching a film or play.

Embracing multi-disciplinary thinking

Interactive experiences exist within real time and real space. Andy Cameron of Fabrica describes this as ‘real space overlaid with another, virtual layer of responsiveness’. Interaction design is where related disciplines such as product design, fine art, graphic design, architecture and interior design converge.

Everyday interactions

We encounter interactions daily. A good interaction allows us to perform a function and move on. These are ones that, although we may not consciously notice, have been carefully designed to ease our transactions. Stand next to some lifts and watch bewildered people wonder what floor they are on. Stand next to a machine and watch someone frustratingly repeat stages over and over again not comprehending what’s going wrong.

Travel cards

The cost of implementing travel card schemes is very high. They are used by significant numbers of people and are responsible for generating the network operator’s income. Ticket machines use data transfer systems and often accommodate alternative methods of reading information. One type of travel card maybe fed through the machine whilst another read on top. Some systems inadvertently cancel out the other and prevent the correct information being recorded.

Fire extinguishers

The design of the fire extinguisher is an example where the architect, product designer and information designer have not communicated together. The architect builds the building, the product designer designs the extinguisher, and then the information designer designs the graphics and labels. The ability to operate this device in an emergency is vital, yet our concern for clear communication of information and its relation to the product and its environment remains wanting.

Lifts

Lifts are often designed at great cost specifically for the building they are being installed in. Some lifts have poorly designed information feedback such as the position of the floor announcements. We expect to hear a bell as we arrive at out floor. When we leave the lift we expect to see the number of the floor as we exit. Signs and directories offer additional help as we navigate to where we want to be.

Mobile phones

We interact with mobile phones via a series of messages displayed on the information panel. If one wants to send a text message there is a clear sequence of operations we expect to follow. The number of stages and the logical sequence to execute an action should facilitate ease of use.

Hi-fi systems

The fascias of hi-fi systems are often overloaded with knobs, features and lights. The quantity of features can compromise sound quality. Knobs can be confusing particularly if they are in a row and are identical. It is useful to create a hierarchy of knobs for example the on/off and sound knobs being most important.

Life caching

Camera phones and digital recorders have enabled people to record all aspects of their life. The ability to digitise all forms of media allows for a uniform method of storage. The memory required to store digital information is no longer such an issue. With broadband technology this information can be uploaded to the Internet and shared with a global audience.

Interactive is the future

Television is becoming more interactive; soon traditional services will become a smaller sub-division of the interactive umbrella. Radio and TV are on demand; if we miss a programme we can play it again at our convenience. Networking between communication devices such as mobile phones and computers are prevalent and enable responsive customisation of information. It should however be remembered, for all this technological focus, that there are still places in the world that haven’t heard a dial tone. What does all this mean for them?

Below is an image from Body Movies by Rafael Lozano-Hemmer. Note how readily participants interact with each other’s shadows in ways they wouldn’t in other social encounters. This piece is a reminder of the street theatre of previous generations.

References

The Art of Experimental Interaction Design, Andy Cameron

Digital Information Graphics, Matt Woolman

Hypergraphics, Roy McKelvey

Typography on the Net, Keith Martin

Interview with Biggles, Senior Lecturer in Interaction Design, London College of Communication

Web Design is 95% Typography, Oliver Reichenstein

The Curse of Information Design, Scott Jason Cohen

How to Save Your Life, Jack Schofield

Botez Co

Small Design Firm

Advertisements