Step 2) Create the information architecture – PART 3

Let’s move away a bit, from the digital world.

What comes to your mind when you come across some daily displays of information, like these?

Nutrition Facts

Nutrition Facts

Nutrition Facts

Nutrition Facts

Pure data treatment, right? What can one do with this type of data presentation – is the nutritional information indicative enough to tell you what’s good for your health?

We need to dig more to make of sense of the data. How about these pictures?



Food Menu

Food Menu

Well, the data in these pictures are easy to read. Why? Because there are some “heads” that hold specific data. i.e. categories that classify the data into different buckets. The information that you deduce from the menu card is what type of restaurant it is (the variety of food it offers, the price range, whether it suits your next date :), etc.). Only when you step in the restaurant, eat the food and get out, you have ‘experienced’ the restaurant and you are knowledgeable to praise or rant the restaurant.

Every day you are exposed to vast amount of information. Crucial are also the circumstances / contexts in which you consume the information. And at that time, the entire onus of delivering the information rests on the designer :).

Imagine you are driving your car and you have a flat tire. Never in your life you have had flat tire (there is always the first time for everything :D) and never have you ever serviced your car before. So, human tendency is to pick up the phone and call service center. Self-starters will pick up the ‘car manual’ and put up the spare tire and drive back home. I am narrating a true story, not an inspired one :). One of my friends encountered the flat tire situation in US, he could not deduce how to change the tire from the car manual. He found out that the spare tire was smaller than the regular tire, he felt he was duped by the car seller :). Anyways, he got back to the car manual and could not change the tire. Here is what the car manual looked like:

Car Manual

Car Manual

If you are curious about what happened to the car, here it is what happened: I changed the spare tire of my friend’s car and we reached home safely. If the book was designed intuitively, my friend could have done the job on his own and won himself some credibility :).

The point is that every printed word that you come across may be uniquely represented – it conveys some meaning (in isolation or together with other words), is part of a big ‘category’ – a common bucket of words / data combined together to make some sense.

Information architecture is a structure that holds the data together.  It is a set of data elements that define the hierarchy of data (what data sits on the top, what at the next level and so on, image a tree structure). It is a structure that defines the relationships between the data – e.g. in an electronic store catalogue there will be list of individual items available for sale. The store may also display products that can be sold as “combo” with other products. Or products that were bought by customers after purchasing a product (“Customers who bought this also bought….”).

It is up to the designer to establish the relationships between the data. The designer visualizes the ecosystem, gets the user and stakeholder data – now he/she has to construct a ‘structure’ which will become the IA (that will translate user ‘needs’ to user journeys). This structure will help the end user to consume the content, ‘see’ what is available, and help him/her to reach specific information using controls offered by the design – e.g. on an e-commerce site, the user will use category-wise listing or search utility to find the desired product.

Information architecture alone does not solve the issue of non-intuitive interfaces. It is ONE of the elements that define the interface. The content, the visual treatment also play an important part in the overall design.

At this point, it will be good if you read the  ‘Elements of user experience’ created by Jesse James Garret. He explains the ‘elements’ in a better way – the different stages that make up the entire user experience aspect of any digital product. In this representation, you will find information architecture placed at the center of the system, a third step from surface to strategy.

So all said and done, how does one actually create information architecture?

Let’s do that in our next and final post on IA.

Step 2) Create the information architecture – PART 1

It is the human tendency to slot things we like & dislike. We often say someone telling “he is not in my good books anymore!” Sometimes this categorization happens unconsciously; sometimes it happens because we want them to be.

How many people organize their desk, their room and their house? Aren’t there any incentives for cleanliness :)?

Some people marvel at the ‘grey area’, while some always look at the extreme whites and blacks.

Great digital designs always have great information architectures. Information architecture (IA) is the soul of the design. On the surface one cannot actually ‘see’ the IA, one can only experience it by the tangible things the product presents – through the clicks, by moving from one section of the application to other.

Before we get into the specifics on what is IA and all, lets look at the some of the examples:

  1. A photo blog curated by Curated by Austin Radcliffe – brilliant compilations on – This blog gives great visual pleasure in seeing things neatly organized various visual forms – to achieve a symmetry & categorization effect. Importantly, it presents the granular view / exploded view of things that make up an ecosystem.
  2. Check out India’s answer to – Look at the way products are displayed, the product search option and the filters to narrow down the product catalogue.
  3. How can one forget the gigantic Wikipedia content :)? Check out this URL too:
  4. Locate your home using Google Maps, – dive from country level to the state level to the granularity of the streets next to your home.
  5. Go through the flight ticket-booking journey on Southwest ( Look at the way information is presented to you, the flexible controls that make ticket booking a cakewalk.

When you are done with these websites, take a piece of paper and write down things that make these websites appear great.

There are many other examples, which we can refer to. But let’s focus now on these examples.

Through these examples we will understand the “behind the camera” / the making of these websites. This will lead us to understanding the IA – the structure or the blueprint of these websites.