blob: a116509342babde109b3cc9535333c06a5a28c1f (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
---
layout: post
title: Designing for the invisible
tags:
- Design
status: publish
type: post
published: true
meta:
_edit_last: '1'
---
There is a new technique on user interface / experience cunningly mentioned by <a href="http://superfluousbanter.com">Dan Rubin</a>, <a title="Dan Rubin at the Boagworld podcast" href="http://boagworld.com/podcast/179">a while ago</a>. It is also used brilliantly in great applications, such as <a href="http://facebook.com">Facebook</a> or Wordpress itself. I took interest over the subject because I believe it is an important aspect of the modern web experience.
<!--more-->
Dan mentioned the principle of <em>designing for the invisible</em>. What this means is a designer prepares a design — generally for a web application — in order to create a clean layout and provoke the user to explore certain data, providing confort and thus a better experience.
<h3>Where to design for the invisible?</h3>
There are lots of situations where you can apply this principle. Even though it can be freshening to use, designing for the invisible has the risk of hiding data from your user, and that can be dangerous sometimes. It really depends on the kind of experience you're trying to reach for. Situations to consider can be:
<ul>
<li>Areas in which a user is likely to hover.</li>
<li>Places with too much information that can represent a threat of not being paid due attention.</li>
<li>Resources that have a main purpose (such as reading it) and also can have other secondary actions (such as admin actions).</li>
<li>Certain content that can have tiny AJAX calls, like removing an item from a cart which only requires a little call to remove it.</li>
</ul>
Let's consider the example of Wordpress, for example:
<a href="http://jose-mota.net/wp-content/uploads/2009/08/Picture-1.png"><img class="alignnone size-full wp-image-115" title="Wordpress post management" src="http://jose-mota.net/wp-content/uploads/2009/08/Picture-1.png" alt="Wordpress post management" width="451" height="331" /></a>
This is a very basic post management page. Supposedly, such a list should have a list of repetitive actions which clutter the interface. The solution for this problem: <em>Wordpress hid those actions</em>. As it knew a user had to hover the respective item to do anything with it, the actions only appear when the user does hover the item.
<a href="http://jose-mota.net/wp-content/uploads/2009/08/Picture-2.png"><img class="alignnone size-full wp-image-116" title="Wordpress page administration with admin options" src="http://jose-mota.net/wp-content/uploads/2009/08/Picture-2.png" alt="Wordpress page administration with admin options" width="444" height="326" /></a>
This is one of many examples that can take advantage of this principle. According to your requirements, you can be as creative as you can. Just be careful not to overuse it, remember: the experience depends on both your product and your user. Study them well and you succeed.
|
