When we think of intuitive and gripping web design, we often think of simplicity, utility and pretty pictures. Upon closer examination, an intuitive website is really just one that conveys metaphor effectively. Jason posted a neat little website on Twitter called Quake Quiz that uses graphics and text to inform San Francisco residents what to do in the event of an earthquake.
When loading Quake Quiz, you’re greeted by a dancing hipster. This character reveals information about the site’s target audience, and perhaps even the designers themselves. The user is then presented with six different locations represented as images. So, clicking on the house graphic will prompt the site to load the guidelines for safely handling an earthquake in the home.
Before we even begin to absorb the information the website wants to transmit to us, we are already subconsciously thinking of their message in terms of metaphor. For example, the home depicted in the graphic is a home as one would conceive a home in San Francisco to look like, not like a home in New Jersey. The sloped street and the thinness of the house indicate a house in a city setting, not one in a suburban setting. Just as how the scenario of “bring some chairs to our meeting” (bean bag chairs? Rocking chairs?) is raised in Metaphors We Live By, we are viewing the idea of home in the context of the situation.
When we click on the house, the house gets frontally dissected, creating the sense of putting us inside the house so we can see all its rooms. Even though we normally experience being inside a house from a different perspective (feeling the floor beneath our feet, being constrained by four walls) we understand the animation to mean that because we can see inside of the house, we must be inside of it.
Because a computer cannot actually cause an earthquake for us to experience, it simulates one by shaking the screen violently while the man in the house yells “Earthquake!” Again, the site operates on the assumption that we are constantly interpreting its meaning through their formation of language. Then, the site allows you to click on various objects in the house. Because we are viewing these metaphors as objects, we can draw conclusions about what they are meant to mean to us. Clicking the telephone, for example, doesn’t allow you to make a phone call the way an actual phone does. Instead, the phone is a metaphor for communication (as in communication is vital to surviving an emergency).
Metaphors like these continue throughout the website. The artists depict a man in a wheelchair in the “at work” section of Quake Quiz, but, before we click on him to read the information associated with him, we’re already thinking, “What do handicapped persons do when they’re caught in an earthquake at work?” These subtleties streamline the Quake Quiz experience, and, combined with its visual style, make the site and information contained within memorable.
Raiders of the Lost Architecture! 