^{Este artículo está también disponible en español.}

User Centered Design (UCD) seems to be growing in popularity, and it's not strange. Who could be against the user being the center of the design process? But looking beyond this popularity it turns out that there is not a consensus about what UCD is.

Formal definitions like in Wikipedia or ISO 13407:1999 describe it vaguely using terms as "design philosophies", "models", "general guidelines", "recommendations", … All those are positive instructions, but they aren't really useful when you face a real project developing a real interface.

User Centered Design is something as generic as this figure, according to ISO 13407.

What do we actually have?

Actually UCD refers almost always to a set of techniques that may be applied along all the life-cycle of a software application; the only thing those techniques have in common is that users are their main roles (at least theoretically). The number of techniques included may vary from six (like in this Webcredible article) to several tens (like in this interactive table at UsabilityNet). Those techniques may be as different between them as focus groups, user testing and interface prototyping.

Oddly some UCD techniques don't include real users in their carrying out: for example, heuristic evaluations of usability.

… sigue / more +++

Heuristic evaluation is one of the most popular usability techniques; it basically consists of reviewing an interface and check if it fulfills some well-known guidelines and principles (the "heuristics").

Once you overcome the fear of performing a task with such a fancy name, the following step is obvious: choosing the heuristics (guidelines) to use. There are some popular heuristics lists, but there are some risks when using them for a usability evaluation:

• If the heuristics are too generic, they don't help you to identify real issues.
• Otherwise, if the heuristics include detailed checkpoints, you may concentrate on small or very specific issues while overlooking the important ones.

Consequently I suggest using alternative heuristics: the 'top lists'.

Which lists?

With 'top lists' I am referring to lists similar to these by Jakob Nielsen: 

• The ten very worst design mistakes of all time
• Most violated homepage guidelines
• Top homepage usability guidelines
• Good deeds in Web design
• Web design mistakes (2005) 
• Web design mistakes (2003) 
• Web design mistakes (2002) 
• Web design mistakes (1999)
• Web design mistakes (1996)
• Application design mistakes
• Information Architecture (IA) mistakes

I think this kind of guidelines might be used (or the mistakes avoided) in small projects, or even in big projects as a preliminar evaluation, or in other situations.

… sigue / more +++

Versión en español aquí.

We may consider Google as a “big eye” not only because of the images provided by Google Maps and Google Earth but also because it seems “to see” everything that is written on the web. But in fact the way Google indexing process works is more like a huge brain.

[…] keep on reading in METAeuFORiAS

Has this ever happened to you? You want to send a file to someone, so you write a nice e-mail explaining what it is; then you click the send button, and some minutes later you receive the reply: "ok, very nice, but … where's the attached file?".

Yes, you forgot to attach the file. It's a common but hard to avoid problem; a good rule is always attach the file before writing the e-mail, but aren't there any better ways to avoid this?

Some systems, like GMail or Thunderbird, have options to alert you when you try to send an e-mail which includes specific words ("file", "enclose", "photo", …) but has no attached files. It's a nice idea, but far from perfect: you will still miss files if the system doesn't detect these words, or you will get an annoying alert about an attachment you don't want to send.

A simple solution

Here's a simpler solution: the user gets notified of how many attachments the e-mail has when he/she is about to send the e-mail, not using annoying alerts but simply including that information in the send button, like this (GMail example):

So when you are going to send the e-mail, you realize that the message has no attachments. Simple and effective, don't you think so?

… sigue / more +++

So you want to show your latests Twitter updates in your web page? You can use Twitter's badge, but the look isn't great, and URLs neither @replies inside updates are not clickable.

If you want a better badge including clickable URLs and @replies (like the one at the left column of this page), just follow these steps:

… sigue / more +++

Publishing a multilingual blog is a hard task; you have to translate and maintain every single post, besides translating all the interface. But what about if you have a simple monolingual blog, and occasionally want to include a post using a different language? You can just write the title and the content in that language, but, as W3C guidelines says, additionally you should…

Clearly identify changes in the natural language of a document's text and any text equivalents (e.g., captions). [Priority 1]

So here you are an easy way to mark a single post using a different language, using custom fields in Wordpress:

1. Modify your template file(s) (tipically single.php, index.php, archive.php) where the following piece of code appears (the div block containing every single post):

<div class="post" id="post-<?php the_ID(); ?>">

Modify them by adding the highlighted code (to check if there's a custom field called lang for that single post and include it as the language of the post, if not empty):

<div class="post" id="post-<?php the_ID(); ?>"<?php $custom = get_post_custom_values('lang'); if ( $custom != '' ) echo ' lang="'. $custom[0] . '"'; ?>>

2. For every single post written in a different language than the blog main language, add a custom field called lang and assign it the post's language code ('en' for English; 'es' for Spanish, …)

3. And that's all. Now, every post may be identified with its own language. Of course, you don't need to include that field if the language of the article is the same language than the blog, as long as the main language is identified in the header of the web page.

Please, let me know it this works for you or if you find any bugs or improvements.

Here you have a nice wallpaper for your desktop:

(click to enlarge)

Can you tell where does this picture come from?

Sometimes I have looked for an usability logo or icon, without luck. Hmmm, interesting! We have icons for almost every other issue, but why not for usability?

Let me suggest these:

Ok, usability specialists know icons and logos are overused in many sites, and they're not really important for the user; it should be so natural than there's no need to say "we care for usability". Anyway, I think it would be a good idea having a logo to identify sites related to usability aspects, or maybe to identify sites that specially care about those issues.

The teapot is from Don Norman's book 'The Design of Everyday Things', and it's sometimes used (with different designs) in presentations, web sites, etc. The 'u' is supposed to be the handle of the teapot so as to make it more usable. Wait! It's not a great logo if I have to explain this

You get the idea, don't you? Now, remember I'm not a graphic designer and leave your opinions in the comments (and feel free to use them if you want to, of course).

Usually, submit buttons in web forms should be clicked just once; but many users click them twice or more. Why?

• Because they're used to launch actions by double clicking (as on Windows icons).
• Because the server doesn't replies instantantly, and they click again "just to see if something happens".

What's the result? The form data is sent twice to the server, and users usually don't realize it; they just get the response to one of the submits. Try this simulation to see what happens when submitting several times the form before the server response arrives:

This is not a big issue if it's, for instance, a search form: the query is being launched twice but the user simply gets the result. It may be annoying if someone is receiving the same mail several times just because users are submiting several times the contact form. And it's a real big problem when the user is submiting a payment (you can be pretty sure they don't want to pay twice the same object!).

The solution

There's an easy solution for that problem! Simply disable the button just after the form is submitted, and you can change the button text too. The result is something like this:

This is done using the onsubmit form event:

<form onsubmit=document.forms['formname'].submitbutton.disabled=true;
document.forms['formname'].submitbutton.value='Sending...';" action="action" name="formname">
  <!-- some form controls here -->
  <input value="Send" name="submitbutton" id="submitbutton" type="submit">
</form>

With this technique, you achieve two positive effects:

• avoiding the double submit problem; and
• giving feedback to the user confirming the submit

Of course, there's no perfect solution. If JavaScript is disabled at the browser, it doesn't works; if it's really important avoiding multiple submits (for instance, when it's an economical transaction), it should be done at server's level.

It's really simple to use and without negative effects. Try it if you are really tired of multiple submits and tell me how it goes!

Google Analytics has a nice new interface, much more intuitive and usable, but I still miss something I think it would be really usefull: an integrated calendar of events.

I can select a range of dates at Google Analytics and get different statistics: visits, unique users, etc. But there are many events (internal and external) that may affect that data. For instance:

• Changes at the site: contents, layout, etc.
• Changes in Google Analytics configuration (for instance, in filters)
• Google Adwords campaigns linking to that site
• etc, etc.

Any webmaster would be happy to know how those events are related to the statistics, wouldn't they?

How could Google do that? We already have a solution: Google Calendar. So we simply would associate a site monitorized by Google Anlytics to a calendar in Google Calendar. A webmaster could add events to that calendar, and they would be shown at Google Analytics.

Here's an example; this graph shows a decrease in the number of visits on June, 2nd:

Hmmm… What happened that day? Oh, maybe that new filter to exclude inner visits. With the feature I suggest, I would link the Google Analytics account with a Google Calendar which includes events related to the site, like this:

… sigue / more +++