Principios básicos de usabilidad y diseño Acercamiento al proceso de desarrollo web.

1. Usabilidad y diseño
Román Tienda Martínez
@romantm

2. Diseñador
Programador

3. El usuario es
lo más importante!

4. We see individual shapes and
colors and layout where our users
just see a page on the Internet.
Put another way, we’re unable to
see the forest for the trees.
Designer Myopia: How To Stop Designing For Ourselves
http://uxdesign.smashingmagazine.com/2012/02/14/designer-myopia-stop-designing-for-ourselves/

5. Leaving the office and spending time
observing users in their own
environments is the best way to
understand how a product is really being
used in the wild. It’s the most efficient
way to get out of your own head.
Designer Myopia: How To Stop Designing For Ourselves
http://uxdesign.smashingmagazine.com/2012/02/14/designer-myopia-stop-designing-for-ourselves/

6. El usuario
Es aquella persona a la cual está dirigido el sitio a
desarrollar.
Es a quien debe llegar el mensaje y el fin de
nuestro sitio, sea cual sea el objetivo.
Vender, Promover contenido, posicionamiento de
marcas, Intercambio de ideas o información.

7. ¿Qué buscamos del usuario?
Atención
Retención
Enamoramiento
Conversión

8. Identifica las necesidades
¿Por qué un sitio web?
¿Qué quiero decir, hacer, promover, vender?
Definir objetivo
Análisis de la información
Propuesta de soluciones y de trabajo (antes de
definir las herramientas de trabajo)

9. Usabilidad - Definición
Consiste en hacer la experiencia de usuario, (UX), más
fácil e intuitiva, sin el requerimiento de ninguna
capacitación especializada.
El usuario debe ser capaz de llevar a cabo las tareas y
conseguir sus objetivos de manera rápida y sencilla.

10. ¿Quiénes deben cuidar la
Usabilidad?

11. Los que están produciendo,
desarrollando y creando interfaces.

12. Estudiantes.
Directores creativos.
Diseñadores
Copy
Ingenieros.
Redactores
Programadores.
Administradores de
contenido.

13. Estrategia de la información
Análisis de la información
Diagramación
Estructura de la información
Diseño de la interfaz.
Aplicación de contenidos.
Interactividad con el usuario
Retroalimentación

14. Proceso de desarrollo
Planeación
Diseño
Desarrollo
Lanzamiento
Post lanzamiento

15. Proceso de desarrollo
Planeación
Análisis
Proyecto
Mapa de sitio (Diagrama)
Contrato de trabajo / Derechos de la información
Acceso a servidores (Desarrollo y Producción)
Tecnología de desarrollo

16. Proceso de desarrollo
Diseño
Wireframe o layout
Mockups
Diseño
Revisiones y aprobaciones
Diagramación (Codificación HTML / CSS)

17. Proceso de desarrollo
Desarrollo
Herramienta de desarrollo
Codificación de templetes
Desarrollo y pruebas
Aplicación de contenidos
Pruebas y revisiones

18. Proceso de desarrollo
Lanzamiento
Revisiones
Publicación a servidor de producción
Pruebas de funcionamiento
Revisión entre navegadores
Validación W3C

19. Proceso de desarrollo
Post lanzamiento
Entrega al cliente
Proveer documentación y archivos
Cierre de proyecto, documentación final
Mantenimiento (Servicio de Webmaster)

20. Proceso de desarrollo
Documentar el proceso
Utilizar el proceso (reutilizar el proceso)
Refinar el proceso
Archivos y respaldos
Recuerda que es un negocio (para ti y tu cliente)
Consideraciones finales

21. Preguntas y Respuestas

22. Román Tienda Martínez
@romantm