1.10. El prototipado en la web
EJERCIO DE LA UNIDAD
Realizar un primer análisis de las webs de Zara y Máximo Dutti para tratar de identificar los principales elementos arquitectónicos que éstas presentan.
Utilizando esa sencilla herramienta, proponed de forma argumentada cómo podría ser el wireframe de la página web principal de una empresa fabricante de ropa que quiera abrir una nueva línea de negocio a través de las ventas por internet.
Las webs tanto de Zara como de Massimo Dutti son muy parecidas en cuanto a la arquitectura web y a los sistemas de navegación. No es de extrañar porque ambas son dos marcas de moda, con prestigio, con buenos técnicos especialistas que trabajan a su servicio: programadores, diseñadores y arquitectos web, etc. Pero sobre todo porque ambas son webs comerciales y tienen muy claro cuál es su objetivo: vender; cual es su público potencial; y en función de ello diseñan websites funcionales, potentes, estéticas y elegantes. Se trata de diseños web muy centrados en sus clientes.
El resultado final son sitios que pueden resolver muy bien las necesidades de negocio de la empresa: escaparate y venta de productos y servir mejor a las necesidades de sus clientes (reales y potenciales)
Las dos páginas tienen una estructura:
- muy intuitivas y lógicas: los directorios y subdirectorios siguen una lógica muy clara.
- Su aspecto visual es muy agradable
- Combinación de colores (no estridentes) y tamaño de letra, adecuados
- Todas las páginas tienen una coherencia interna que da personalidad y equilibra el sitio.
- Con muchos enlaces para facilitar la navegación
- Con poco texto e imágenes
En ambos casos y de forma prácticamente idéntica, la página de entrada es “una bienvenida a la web”, con un sumario sencillo, claro, elegante, visual e intuitiva. Con el título o marca (Zara o Massimo Dutti) que identifica la web y la empresa.
En ambos casos, en esta primera página vemos la misma estructura de la información.
Los sistemas y diseños de navegación ofrecen en ambos casos:
- información sobre el contexto: con el nombre de la marca ya es suficiente contexto
- flexibilidad de acceso
En el caso de Zara está desarrollado en vertical y en caso de Massimo Dutti en horizontal y se complementa con menús desplegables (listado de enlaces incrustados).
En ambos casos el proceso de compra es el mismo: seleccionas la prenda según el color y la talla y añades a la cesta de la compra.
Como vemos, la portada de ambas páginas web tiene la misma consistencia, son como gemelas (como hechas por el mismo de equipo de profesionales) y representan muy bien la imagen de la empresa.
Y en ambos casos la experiencia de usuario es muy buena y seguro que consiguen fidelizar a sus clientes.
Modelo básico de wireframe
Después de reflexionar sobre los objetivos de la web, el público potencial al que está destinada, los contenidos mis criterios para crear este prototipo han sido:
- la estructura de la página debe ser intuitiva, clara y estética; realizada para que el usuario tenga una “buena experiencia”.
- la primera pantalla debe ofrecer el máximo de información e invitar a continuar la exploración.
- Frases cortas, ya que lo principal es comunicar y orientar bien al usuario.
- En esta primera pantalla debe figurar el nombre de la empresa.
- Fecha de confección de este primer prototipo.
