sábado, 7 de diciembre de 2013

Herramientas gratuitas para elegir los colores de nuestra web

Uno de los aspectos esenciales para garantizar una buena experiencia de usuario es elegir una combinación de colores adecuada para nuestra web. El esquema de colores de una web ayuda a crear su propia identidad, por tanto no debe dejarse nunca a la improvisación.

A continuación, se presentan algunas herramientas que nos pueden ayudar en la elección de los colores de nuestro site:

Kuler

Es una de las mejores herramientas de creación de esquemas de color para la web. Nos ofrece infinidad de combinaciones predefinidas de colores, y además podemos crear nuestras propias combinaciones a través de una interfaz bastante intuitiva y sencilla. Para descargar los esquemas de color, necesitamos darnos de alta mediante el correo electrónico. Lo más interesante, la opción de buscar las combinaciones de colores por palabra clave (Mediterranian en la siguiente imagen).  

Experiencia de usuario mediterránea a través de Kuler

Color Scheme Design

Una interfaz sencilla para crear esquemas de color web que nos ofrece una herramienta imprescindible para garantizar la accesibilidad de nuestra web: una simulación de la visión de las combinaciones de colores para personas con diferentes problemas de visión. No necesitamos auntenticarte para descargar tus combinaciones. 

Color Scheme Designer. Combinar colores en la web teniendo en cuenta la accesibilidad

Web Colour Data

Esta herramienta nos permite extraer la combinación de colores de una web ya existente simplemente introduciendo la url. Si una web nos gusta, podemos inspirarnos en su esquema de colores para crear el nuestro propio.

Extrae la paleta de colores de cualquier web con Web Colour Data


Colour Lovers

Una comunidad de aficionados al diseño de colores. Lo más interesante de esta herramienta es la opción de consultar las últimas tendencias en combinaciones de colores para poder inspirarnos para nuestro propio site.
Colour Lovers, últimas tendencias en combinación de colores





miércoles, 4 de diciembre de 2013

Una buena experiencia de usuario implica prototipar: WireframePro, herramienta gratuita de prototipado


Una de las claves de diseñar una web que genere una buena experiencia de usuario es el hecho de trabajar con prototipos y wireframes.


El hecho de ver estos prototipos de la web permite al equipo de diseño: 



  • Ver implementada la arquitectura de la web en un boceto
  • Ver implementadas las bases del diseño web en un boceto
  • Empezar a testear con usuarios potenciales la funcionalidad y usabilidad de la web


Esto ayuda al equipo de diseño de la web a ir mejorando la interfaz durante todo el proceso de elaboración (diseño incremental).


WireframePro de Mockflow es una herramienta gratuita (podemos abocetar webs de hasta 4 páginas, para diseñar webs más complejas tendremos que usar la versión de pago).


¿Cómo funciona WireframePro?

Para empezar a trabajar con esta herramienta nos encontramos con un lienzo en blanco sobre el que imnplementaremos nuestro boceto:

Para ello, empezaremos a agregar elementos prediseñados que encontramos en el panel a la derecha de la pantalla arrastrándolos hacia el centro del lienzo. Antes que nada, para favorecer que los elementos del boceto estén centrados os recomiendo añadir una cuadrícula de fondo a través del icono Grid situado en la parte inferior del menú:


Una vez tengamos un objeto en el lienzo podremos cambiar colores, disposición, añadir texto... A continuación, os muestro un boceto muy sencillo elaborado para una web de recetas:

!Os animo a que probéis la herramienta!

* Para más información, podéis visitar el blog Apunts Digitals de mi compañera de master Marina Vallès.

sábado, 30 de noviembre de 2013

Mejorar experiencia de usuario del catálogo de la biblioteca.


Muchos usuarios de la web de una biblioteca se dirigen a ésta para consultar el catálogo. Por tanto, el catálogo es una herramienta que debemos diseñar con especial cuidado para garantizar la mejor experiencia de usuario. 

Los resultados de una búsqueda en catálogos de biblioteca suelen pecar de falta de claridad, poca eficiencia (¿está o no el libro en la biblioteca?) y dificultad de navegación de la página de resultados de los catálogos de biblioteca. 

Aaron Schmidt (2013), propone eliminar de la lista de resultados el exceso de información bibliográfica que los usuarios, sobretodo en bibliotecas públicas, no necesitan. Ofrecer así un diseño mucho más claro y intuitivo.

Aquí van algunas propuestas muy diversas de diferentes bibliotecas: 

Experiencia de usuario catálogo Bibliotecas Públicas del Estado
En esta primera imagen del catálogo de la Biblioteca de Castilla la Mancha vemos la lista de resultados con información sobre: los autores, los traductores, el año de publicación, la edición, los datos de publicación, la descripción física, el ISBN...
Clicando sobre el título, se enlaza al usuario con la información detallada del documento.

Experiencia de usuario catálogo New York Public Library

El catálogo de la New York Public Library nos ofrece información muy básica sobre el documento: tipo de material, si está disponible para el préstamo.
Además permite la interacción de los usuarios con el sistema:

  • Reservar el documento: Place a Hold
  • Pedir el documento para préstamo interbibliotecario: Offsite Request
  • Socializar la lectura del documento: Add to my shelves: si ya ha leído el libro, si lo está leyendo, o si lo desea leer y compartirlo con sus contactos
  • En el caso de los libros electrónicos, aunque no se vea en la imagen, se ofrece la opción de descargarlos directamente
  • Acceder a la información detallada, conocer detalles sobre la disponibilidad y ubicación del documento para préstamo: and more... , Availability details, in some locations

Experiencia de usuario catálogo de la Chicago Public Library
En el caso de la Chicago Public Library, vemos más información sobre el documento: Autor, fecha de publicación, signatura topográfica y idioma.

La interacción con la interfaz se basa en:

  • Consulta de más información
  • Consulta de la disponibilidad del documento
  • Consulta la información detallada
Esta propuesta de Aaron Schmidt (2013), ofrece, en cambio, poca información bibliográfica: autor y título.
Y como opciones de interacción, los usuarios pueden:

  • Reservar el documento
  • Conocer la localización del documento
  • Acceder al registro detallado del documento






El catálogo de la University of Michigan nos muestra información sobre: el autor, la fecha de publiación, el tipo de publicación, la localización y la disponibilidad del documento.
Como interacción con la interfaz, se puede:

  • Guardar el documento como favorito
  • Consultar la información detallada clicando sobre el título
  • Consultar el documento en Google Books (Vista limitada)
  • En el caso de los recursos electrónicos, consultar el documento directamente

Kim (2013) nos hace algunas propuestas a la hora de prototipar la lista de resultados en un catálogo de biblioteca que nos pueden ser de gran utilidad:
  1. Ordenar el desorden
  2. Mostrar sólo la información útil para las acciones posteriores del usuario
  3. Destacar la siguiente acción
  4. Acortar textos

Conclusiones

Aunque tengamos poco control sobre la visualización del catálogo por el hecho de que se gestiona con herramientas externas a la biblioteca, el hecho de hacer esquemas y imaginar diseños más accesibles, siempre nos ayudará a entender algunos problemas de usabilidad y a aplicar mejoras que repercutirán directamente en la satisfacción de nuestros usuarios.

Los ejemplos más sencillos, aunque son muy usables y intuitivos, pueden resultar demasiado simples para contextos como bibliotecas universitarias o especializadas, por eso es importante tener en cuenta el contexto y, sobretodo los usuarios de cada interfaz para diseñarla. 

El objetivo a la hora de diseñar este tipo de interfaces es encontrar el equilibrio en la cantidad de información que ofrecemos, porque demasiada información satura al usuario y demasiada poca información puede ser insuficiente (Russell-Rose, 2013).

Bibliografía consultada para el artículo:


Kim, Bohyun (2013). Redesigning the Item Record Summary View in a Library Catalog and a Discovery Interface. ACRL TechConnect Blog. [Consulta 27/11/2013]. Disponible en: <http://acrl.ala.org/techconnect/?p=3883>.

Rusell-Rose (2013). Designing Search: Displaying results. UX Magazine: April 24, 2013. [Consulta 28/11/2013]. Disponible en: <http://uxmag.com/articles/designing-search-displaying-results>

Schmidt, Aaron (2013). Catalog by Design. Walking Paper. [Consulta 28/11/2013]. Disponible en: <http://www.walkingpaper.org/5979>.

miércoles, 27 de noviembre de 2013

Por qué aplicar la experiencia de usuario en la web de la biblioteca?

La experiencia de usuario nuestra tarjeta de presentación:

En los últimos años con la generalización de Internet los hábitos de búsqueda y acceso a la información, las bibliotecas debemos adaptarnos a esta nueva realidad. 

La principal forma de acceso a la biblioteca es a través de su web. Si no se asegura una buena experiencia de usuario en esta web, se pueden perder a miles de usuarios potenciales, ya que una mala experiencia de usuario repercute directamente en la reputación de la biblioteca.

Las bibliotecas han ido adaptando su espacio físico a las expectativas de sus usuarios, la mayoría de bibliotecas son espacios agradables en los que la gente quiere pasar el rato y se encuentra cómoda, ¿por qué no hacer lo mismo con nuestras webs? Si se analiza qué quieren y necesitan los usuarios, se les puede ofrecer en la web un espacio en el que se sientan cómodos buscando información, la biblioteca.
Harold Washington Center . Chicago Public Library. Una gran experiencia de usuario

La web de la biblioteca tiene algunos puntos clave que son de especial interés para sus usuarios, en éstos se debe poner especial atención para que tengan un diseño agradable, sea accesibles, usables, etc.

Principales apartados a tener en cuenta:

Catálogo
Servicios de referencia virtual
Datos de ubicación y contacto de la biblioteca
Acontecimientos y actos de la biblioteca
Bases de datos
Anuncios y banners

Se debe optimizar el diseño de estos apartados clave en la misma dirección que marca la misión y objetivos de la biblioteca, para satisfacer las necesidades y los problemas de sus usuarios actuales y potenciales de forma que valoren la web de la biblioteca como un recurso útil y agradable de usar.

Sólo detectando cuales son estas necesidades y construyendo una web en esta dirección tendremos la oportunidad de crear servicios y recursos realmente impactantes.

Artículos relacionados

Related Posts Plugin for WordPress, Blogger...