De acuerdo con Marcus [1992] existen 5 niveles en el diseño de iconos agregando semiótica:

1. Cualidades léxicas. Marcas generadas por computadora [silueta de pixels, color, brillo, parpadeo]
2. Sintaxis. Apariencia y movimiento [líneas, patrones, partes modulares, tamaño, forma]
3. Semántica. Objetos representados [concreto frente abstracto, parte frente todo]
4. Pragmática. Legibilidad, utilidad, facilidad para identificarlo, facilidad para memorizarlo y agradabilidad a nivel global.
5. Dinámica. Predisposición a los clics [resaltar, arrastrar, combinar]

DENIM es un software desarrollado por la Universidad de Washington para crear mapas de navegación e interfaces de baja fidelidad ahorrándonos tiempo.

Este software permite componer secuencias de visualizaciones en sólo unas pocas horas, hacer revisiones rápidas y pruebas de usabilidad en las primeras etapas del proyecto.

Es fácil de usar, además de que está disponible para Windows, Unix y Mac OS X.

Sencillez en las pruebas

Yo decía que lo mejor era pensar que una prueba es como viajar: una experiencia edificante. Esto le recuerda lo diferente, y lo parecida, que es la gente, y le da una perspectiva objetiva de las cosas.

El secreto mejor guardado de la prueba de usabilidad es el grado al que no importa a quien pruebe.

Tome a cualquiera (dentro de los límites) y clasifíquelo.

• Prueba de “captación”. Mostrarle a los usuarios el sitio y ver si lo captan (entienden el propósito del sitio, su valor, cómo se organiza, cómo funciona, etc.).
• Prueba de tarea clave. Perdirle al usuario que haga algo, y ver cómo lo hace.

Examine los resultados.

• Toma de contacto. Revisión de los problemas que los usuarios se han encontrado y elección de cuáles deberían solucionarse.
• Resolución de problemas. Decisión de cómo se solucionarían.

[1] Krug, S. No me hagas pensar. Prentice Hall.

Diseño de la página principal

Algunas cosas que debe tener una página principal:

• Identidad y misión del sitio. La página principal tiene que decirnos qué es este sitio y para qué es, y si es posible, por qué deberíamos estar aquí y no en otro sitio.
• Jerarquía del sitio. La página principal tiene que dar una visión conjunta de lo que ofrece el sitio ["¿Qué puedo encontrar aquí?"], tanto del contenido como de sus características ["¿Qué puedo hacer aquí"] y cómo está organizado.
• Búsqueda. La mayoría de los sitios necesitan tener un cuadro de búsqueda muy visible en la página principal.
• Sugerencias. La página principal necesita convencer al usuario con sugerencias de “lo bueno” que hay en su interior.
• Contenido temporal. La página principal probablemente necesite tener algunos contenidos que se actualicen con frecuencia.
• Accesos directos. Las partes de contenido que se solicitan más frecuentemente pueden merecer sus propios vínculos en la página principal de modo que los usuarios no tengan que buscarlas.

¡Nada puede con una buena línea de etiquetas! [tagline]

Una tagline es la frase medular que caracteriza a la empresa entera, resumiendo lo que es y lo que la hace especial.

La navegación de la página principal puede ser única

La navegación de la página principal puede ser diferente a la del resto del sitio. Pero no demasiado diferente.

Las diferencias típicas entre la página principal y el resto del sitio:

• Descripciones de sección.
• Orientación diferente.
• Más espacio para la identidad.

[1] Krug, S. No me hagas pensar. Prentice Hall.

Diseño de la navegación

Convenciones de la navegación web

Las convenciones especifican, la apariencia y la ubicación de los elementos de navegación, de manera que nos permiten saber en todo momento lo que buscamos y dónde encontrarlo cuando lo necesitamos.

Navegación coherente o global. Conjunto de elementos de navegación que aparecen en todas las páginas del sitio. 

Jerarquía visual de la página

• Secciones. Vínculos a las secciones principales del sitio: el nivel superior en la jerarquía del sitio.
• Utilidades. Vínculos a los elementos importantes del sitio que realmente no forman parte de la jerarquía de contenidos. Son cosas que nos pueden ayudar a usar el sitio.

Nombre de las páginas

• Todas las páginas necesitan un nombre.
• El nombre ha de estar en el lugar adecuado.
• El nombre ha de ser prominente.
• El nombre debe corresponder con aquello sobre lo que he hecho clic.

Breadcrumbs [migas]

Se llaman migas de pan porque nos recuerdan a la pista de migas de pan que Hansel iba dejando caer en el bosque para poder volver, junto a Gretel, a casa.

Las migas de pan sólo muestran el camino desde la página principal al lugar donde se encuentra.

Recomendaciones:

• Póngalas en la parte superior.
• Utilice el signo > entre los distintos niveles.
• Utilice un tipo de letra pequeño.
• Utilice las palabras “Usted está aquí”.
• Ponga en negrita el último término.
• No las utilice en lugar del nombre de la página.

[1] Krug, S. No me hagas pensar. Prentice Hall.

… innecesarias, el arte de no escribir en la Web

17. Omítanse las palabras innecesarias.

La escritura vigoroso es concisa. Una frase no debe tener palabras innecesarias y un párrafo debe omitir las frases superfluas por el mismo motivo que el dibujo debe prescindir de las líneas innecesarias y cualquier aparato de las partes inútiles.

E.B. White en The Elements of Style

• El discurso innecesario tiene que desaparecer.
• Hay que eliminar instrucciones.

[1] Krug, S. No me hagas pensar. Prentice Hall.

Diseño de páginas para hojear, no para leer

Para asegurar que ven los usuarios:

• Creación de una jerarquía cisual clara en cada página.
• División de las páginas en zonas claramente definidas.
• Dejar bien claro sobre lo que se puede hacer clic.

Creación de una jerarquía visual clara

Qué cosas están relacionadas entre sí y cuáles son parte de otras.

Las páginas con una jerarquía visual clara tienen tres características:

• Lo más importante ha de ser lo más prominente.
• Lo que está relacionado lógicamente, también lo está visualmente.
• Todo se engloba visualmente bien para que queden delimitadas las partes que pertenecen a cada bloque.

Una buena jerarquía visual nos ahorra esfuerzos a la hora de procesar la página, de organizar y establecer prioridades en los contenidos, lo que nos permite captar todo de forma casi instantánea.

División de las páginas en zonas claramente definidas

Permite al usuario decidir en qué partes quiere centrarse y cuáles puede ignorar.

Dejar bien claro sobre lo que se puede hacer clic

[1] Krug, S. No me hagas pensar. Prentice Hall.

Ojear, ser suficiente y arreglárselas

No leemos las páginas; las hojeamos.

¿Por qué?

• Normalmente tenemos prisa.
• Sabemos que ho hay que leerlo todo.
• Somos buenos en ello.

No tomamos decisiones óptimas. Nos es suficiente.

En el diseño de las páginas tendemos a contar con que el usuario hojea una página, considera opciones disponibles y elige la mejor.

No obstante, en realidad, la mayor parte de las veces no seleccionamos la mejor opción; nos quedamos con la primera más razonable, estrategia que se conoce como satisficing.

¿Por qué?

• Normalmente tenemos prisa.
• Las consecuencias por el error cometido no son importantes.
• El sopesar distintas opciones no garantiza la mejora de nuestras oportunidades.
• Adivinar es más divertido.

No averiguamos el funcionamiento de las cosas. Nos las arreglamos.

Son muy pocas las personas que, ante cualquier aparato tecnológico, se toman un tiempo para leer las instrucciones. Por el contrario, seguimos adelante, nos las arreglamos, nos inventamos nuestras propias historias, vagamente verosímiles de lo que hacemos y del por qué de su funcionamiento.

¿Por qué?

• No nos importa.
• Si damos con algo que funciona, seguimos con ello.

[1] Krug, S. No me hagas pensar. Prentice Hall.

Primera norma de la usabilidad de Krug

Todo lo que con ello quiero decir es que, hasta lo humanamente es posible, cuando se mire una página web ésta ha de ser obvia, evidente, clara y fácil de entender.

• ‘Entender’ = qué es y cómo usarla.

Lo que nos hace pensar

• Vínculos
• Botones

Nos hacen dudar si podemos o no pulsarlos.

Lo que los visitantes del sitio no deberían ni pensar:

• ¿Dónde estoy?
• ¿Por dónde empiezo?
• ¿Dónde han pueesto _____________?
• ¿Qué es lo más importante de esta página?
• ¿Por qué lo han llamado de esta forma?

Todo no se puede hacer obvio

El objetivo para cada página debería ser que fuera evidente, que el usuario sólo con mirar supiera de lo que se trata y la forma de usarse.

Si no puede hacer una página fácil de entender, al menos tendrá que hacerla autoexplicativa.

[1] Krug, S. No me hagas pensar. Prentice Hall.

Es una revista open-access y peer-reviewed con artículos bastante interesantes…

http://www.ijdesign.org/ojs/index.php/IJDesign/