THE ICEBERG AND UI DESIGN – BEST FRIENDS?

maaliskuu 11, 2013 // Ville Pohjola

For some reason the iceberg analogy has been very popular in user interface design and usability. You know the small tip and then massive body somewhere in the deeps. Sounds actually quite furious, is the usability like the iceberg where the Titanic of the product development crashes?

Well, I don’t know whether some experts actually want to continue the strategy of intimidation to make companies understand the importance of user interface design? Anyway, the iceberg as a metaphor works still very well in different areas of user interface design.

For example IBM describes the user experience with iceberg model. Dick Berry has written a great article about the iceberg analogy of usability for web development. He uses it to describe aspects contributing to usability of web page and also how a UI toolkit (Style guides etc.) affects only for the tip of the iceberg. The lowest layers, meaning the user model need to be understood with different methods. The link to the article below:

http://www.ibm.com/developerworks/library/w-berry/

Another version of the UI design ICEBERG is the model where different disciplines under UI design are split to own layers. These layers are then ordered to the hierarchy based on iceberg model. Hanns Tappen has blogged about this model. His point of view is actually very important because he is targeting this model to whole product management or a crew in new startup company:

http://tappen.posterous.com/the-ui-design-iceberg-elements-and-sections-o

Interesting is that in both models the visual design is the tip of the iceberg. Isn’t that even too obvious?

Well, if you start to think the whole software product and how user should use it the visual layer is of course the first one the user sees. But there is nowadays even more important point of view: The information and feature hierarchy.

Modern system starts to be massive, especially in the area of professional software. Either there is huge amount of features and tools for manipulation, or then there is enormous system or database full of information packed behind the top layer. The software product need to manage all of this, or let’s say the USER MUST SURVIVE with all of this.

Thousands of lines of data in table, task to find correct pile of information within 30 seconds. Hundreds of sensors measuring the data within the process, 15 seconds time to find the root cause for a fault and take corrective actions. How the user can survive in this kind of swamp? How in earth a normal human learn to swim there?

Well, let’s drop the iceberg to the swamp. It makes everything calmer.

The most important thing for designer is to make such a hierarchy for information and data manipulation tools that user has the feeling of control all the time.

First layer should be the thing user should see all the time. User does not need to act a lot, but view the data. User does not need to concentrate too much to understand the information system gives. Designer: Ask what is so crucial information that user must see it all the time? Different kind of aggregators helps here; a Key Performance Indicator can summarize the big pile of data.

Second layer is still used daily. Here user access when there are some interactions needed, some quick visits below the surface are done. Change filtering of viewed data, change some basic settings, clear some alarms etc. Designer: Ask what is the level in system when user must learn to swim? Let the user practice in the shallow water, so that the nose is still in the surface when feet hit the ground.

Third layer is the deep diving layer. Here user is capable of deep-sea diving, and has also all the pressure the big pile of information gives. In this level the secrets of abyss hits the diver. This is something where user has time and possibility to concentrate to the task. Designer: Give your user sufficient enough tools to survive here. Enough time to adopt and a good torch to see clearly. Here the whole set is available.

The iceberg can be user’s friend.

iceberg