Presentación para el Drupal Picchu 2014, el primer evento internacional de la comunidad Drupal que se realizó en el Cusco. Hablamos sobre la Experiencia de Usuario para nuestros proyectos en drupal.
2. Hoy vamos a hablar sobre UX (Experiencia
de Usuario) y cómo podemos aplicar estas
buenas prácticas a nuestros proyectos en
Drupal.
¿Quién determina si un proyecto es exitoso?
Para mí lo es cuando el cliente dice algo
como “…esto es lo que yo quería…” :)
3. El menú del día
1. ¿Qué es Experiencia de Usuario
2. Importancia de la Arquitectura de Información
3. Importancia de los Wireframes y Prototipos antes del desarrollo
4. Criterios sobre el uso de algunos elementos web
5. Test de los 5 segundos
6. Reglas heurísticas de usabilidad de Jakob Nielsen
7. Pruebas de usuario y muchas preguntas
4. 1. ¿Qué es Experiencia de Usuario?
Es el conjunto de ideas, sensaciones y valoraciones del
usuario como resultado de la interacción con un sitio web.
Es un conjunto de ideas positivas o negativas.
En otras palabras… “Es lo que un usuario puede expresar de
un sitio web”. Los comentarios, opiniones,
recomendaciones.
5. ¿Cómo sé si en mi sitio web se necesita
aplicar UX?
Te vas a dar cuenta cuando tu sitio:
Es difícil de navegar.
No funciona.
Tiene contenido duplicado y/o desordenado.
Cuando los usuarios reportan quejas.
Estas son buenas razones para plantear un re-diseño
del sitio, pero esta vez pensando en el usuario.
6. Antes de aplicar UX tienes que saber un
par de cosas
a) Tus objetivos:
Claros
Medibles.
Observables.
Realistas.
b) Reglas para el usuario:
No me hagas pensar.
El diseñador no es el usuario.
Prototipo mata argumento.
c) No existe el usuario promedio, hay público objetivo.
d) Tú debes aprender del usuario, no al revés.
7. Un sitio diseñado y pensado en el
usuario se reconoce porque es:
1. Útil
2. Usable
3. Deseable
4. Encontrable
5. Accesible
6. Creíble
7. Valioso
9. ¿Qué es y para qué es importante?
Es el arte de estructurar y organizar los sistemas de
información.
Y es importante para ayudar a las personas (usuarios) a lograr
sus objetivos.
Registro en el sitio
Inscripción a un curso
Encontrar lo que están buscando
10. ¿Qué hace un arquitecto de
información?
Organiza el contenido
Diseña los sistemas de
navegación
12. 3. Importancia de los Wireframes y
Prototipos antes del desarrollo
Tenemos una visión clara del contenido.
Evitamos tiempos muertos.
Nos damos cuenta de algunos errores y podemos
corregirlos.
El cliente puede interactuar el diseño y ver si es realmente
lo que quiere.
Nos sirve como garantía para evitar cambios futuros que
pueden retrasar el proyecto.
16. 4. Criterios sobre el uso de algunos
elementos web
Un sitio sobrecargado, distrae al usuario.
Slider:
¿Qué es? ¿Cuál es su propósito?
Enlaces:
¿Qué es? ¿Cuál es su propósito?
Formularios:
¿Qué es? ¿Cuál es su propósito?
29. 5. Test de los 5 segundos
El tiempo es oro. No hagas esperar al usuario.
Cache de drupal
Páginas
Bloques
Vistas
Configuración de
Boost, Memcache, Varnish
Técnica de sprites para imágenes e iconos
30. 6. Reglas heurísticas de usabilidad
de Jakob Nielsen
1. Visibilidad del estado del sistema: que está sucediendo,
loading, downloading, etc.
2. Coincidencia entre el sistema y el mundo real: ico home.
3. Control y libertad, salidas de emergencia.
4. Consistencia y estándares: sigue las convenciones de la
plataforma.
5. Prevención de errores, diséñelos cuidadosamente.
31. 6. Reglas heurísticas de usabilidad
de Jakob Nielsen
6. Reconocimiento mas que el recuerdo.
7. Flexibilidad y eficiencia de uso.
8. Diseño estético y minimalista.
9. Ayude a los usuarios a reconocer, diagnosticar y
recuperarse de los errores: mensajes.
10. Ayuda y documentación.
32. 7. Pruebas de usuario
Son importantes para verificar si el sitio va tener éxito o no.
Dice “imprimir” y no lo hace
http://prensa.bbva.com/accesibilidad.html
http://prensa.bbva.com/actualidad/notas-de-prensa/bbva-
frances-ofrece-beneficios-de-verano-en-mar-del-plata-y-
pinamar__9882-22-c-106754__.html
33. 7. Pruebas de usuario
Dice “enviar” y no lo hace
http://prensa.bbva.com/actualidad/notas-de-
prensa/enviar_amigo.html?url=http%3A%2F%2Fprensa.bbva.com
%2Factualidad%2Fnotas-de-prensa%2Fbbva-frances-ofrece-
beneficios-de-verano-en-mar-del-plata-y-pinamar__9882-22-c-
106754__.html
34. 7. Pruebas de usuario
Buscar en Google:
Page not found
Page not title
Ejemplo de Checklist de usabilidad
http://www.guiadigital.gob.cl/articulo/usabilidad-0
Modelo de para Prueba de usabilidad:
Prueba Usabilidad.docx