2. El proceso de prototipado
sitemap
2
flowchart
sketches
wireframes
mockups
prototipo
TONA MONJO
Wireframes
3. Qué son los wireframes
Son representaciones esquemáticas que muestran el contenido
de cada pantalla.
Pueden tener diversos niveles de detalle.
3
TONA MONJO
Wireframes
4. Qué son los wireframes
Fundamentalmente muestran:
- La estructura de cada pantalla
- Qué información aparece en cada pantalla
- El labelling de la aplicación o website
- El comportamiento de los elementos interactivos
4
TONA MONJO
Wireframes
5. Qué son los wireframes
Los wireframes deben
mostrar claramente
cuál es la jerarquía de
los contenidos.
5
TONA MONJO
Wireframes
6. Qué son los wireframes
Los wireframes no muestran aún la línea gráfica
de la aplicación.
La atención debe centrarse en la arquitectura de
la información y el diseño funcional, no en el
diseño gráfico.
6
TONA MONJO
Wireframes
7. Pasos en la realización de los wireframes
1. Layout
7
TONA MONJO
Wireframes
8. Pasos en la realización de los wireframes
2. Wireframe detallado
8
TONA MONJO
Wireframes
9. Pasos en la realización de los wireframes
3. Detalle de los
comportamientos
9
TONA MONJO
Wireframes
10. Pasos en la realización de los wireframes
4. Anotaciones
10
TONA MONJO
Wireframes