AI PAC03: Mapa web y wireframe

PAC /03Realización de mapa de la web y wireframe de página detalle de la web Practica

Beatriz García Fernández Grado Multimedia Noviembre 2012

01. NUEVO ÁRBOL DE CONTENIDOS

INICIO

Todos los productos Toda la casa Ofertas

Información

Dormi- torio Salón Espacio de

trabajo Cocina Club Practica

Búsqueda avanzada

Búsqueda

Newsletter

Mi carro de la compra

Mis favoritos

Redes sociales

Redes sociales

Contacto

Tarjeta socio

Nuestras tiendas

Servicio de financiación

Servicio de transporte

Política de devoluciones

Guía de compra online

Preguntas frecuentes

Mapa de la web

Recursivo

Pie de página

Enlaces especiales de la página

CamasLos productos se pueden mostar ordenados por:• habitación• función

De la A a la Z

Catálogo

Online

Descarga de pdf

MultimediaSillas

Mesas

Organi-zación

Sofás y sillones

Mesas

Almacena-miento

Almacena-miento

Almacena-miento

Accesorios

Almacena-miento

Iluminación

IluminaciónIluminación

Niños

Jardín

Comedor

Baño

Cocina

Esp. trabajo

Salón

Dormitorio

Textil

Textil

Textil

Eventos

Ideas decoración

Productos Practica

Foro

Espejos

02. WIREFRAME DE PÁGINA DETALLE (FICHA DE PRODUCTO)

Puedes combinarlo con... También te puede gustar... También vistos...

IMAGEN

BasicCómoda de tres cajones

120 €

IMAGEN


120 €

IMAGEN


120 €

< > IMAGEN

VacariCómoda de dos cajones

69 €

IMAGEN

PekinCómoda de tres cajones

110 €

IMAGEN

BasicCómoda de dos cajones

80 €

< > IMAGEN


120 €

IMAGEN


120 €

IMAGEN


120 €

< >

LOGO

IMAGEN #1

IMAGEN #2

> MÁS INFORMACIÓN DEL PRODUCTO

COMPARTIR ME GUSTA EMAIL

IMAGEN #3

IMAGEN #4

Todos los productos

INICIO > DORMITORIO > ALMACENAMIENTO > CÓMODAS


talian made high gloss Perouse 1 door/1 drawer bedside unit with dark putty interior. Door and drawer have push latch catches for a smooth, handle-free minimalistic look. Part of the sleek Perouse bedroom furniture range available in white and brown.80 x 43 x 84 cm

AÑADIR A FAVORITOS

AÑADIR AL CARRO120 €Comprobar disponibilidad

Toda la casa OfertasDormitorio Salón Espacio de trabajo Cocina Club Practica

Si quieres recibir nuestras novedades inscríbete en nuestro newsletter:

Búsqueda avanzada

Mi carro de la compra(300 € | 2 productos)

Mis favoritos(3 productos)

INFORMACIÓNContactoTarjeta socioNuestsras tiendas

© 2012 Practica Política de privacidad | Aviso legal

escribe tu email

escribe tu búsqueda

Servicio de fi nanciaciónServicio de transportePolítica de devoluciones

Guía de compra onlinePreguntas frecuentesMapa de la web

Iconos redes sociales

El número de imágenes no es fi jo: puede que sólo haya 1 o que hayan 20 (en el caso de que hayan más de 3 aparecerán los signos para pasar por las fotos del carrusel).

*El subrayado que aparece en algunos textos indica que es un link a otra página.

<>


> IMAGEN


69 €

IMAGEN


110 €

IMAGEN


80 €

< > IMAGEN


120 €

IMAGEN


120 €

IMAGEN


120 €

< >

IMAGEN #1






AÑADIR A FAVORITOS


Toda la casa OfertasEspacio de trabajo Cocina Club Practica

Búsqueda avanzada




Política de privacidad | Aviso legal




Características- Los cajones, fáciles de abrir y cerrar, llevan topes.- Cajones muy amplios. Más espacio para guardar

tus cosas.- También puede usarse de mesilla de noche.

MantenimientoLimpiar con un paño humedecido con una suave solución jabonosa. Secar con un paño seco.

Información adicionalTe recomendamos fi jar el mueble a la pared con el herraje de seguridad que se incluye. Así evitarás que vuelque si un niño se encarama o cuelga del mismo.

Diferentes tipos de pared requieren diferentes herrajes. Utiliza los herrajes más adecuados para tus paredes (no se incluyen).

Puede completarse con otro mobiliario de la serie BIRKELAND.

Combina con otros elementos de la serie BIRKELAND.

Medidas y peso del embalajeBultos: 1Referencia artículo: 201.902.21 Ancho: 57 cm. Fondo: 13 cm. Alto: 73 cm.Peso: 27.4 kg. Cantidad: 1

Montaje del productoDescarga las instrucciones

X

Ventana fl otante

02. WIREFRAME DE PÁGINA DETALLE (FICHA DE PRODUCTO) (continuación)

03. OBJETIVOS

MAPA DE CONTENIDO DE LA WEBDespués del análisis realizado de la web Practica era necesaria una reestructuración de la organización de la misma. Ésta era demasiado plana y desequilibrada, y por eso se ha intentado añadir nuevas etiquetas y reorganizar las antiguas.

Antiguo

· Productos· Tienda· Entregas· Club > Contacto· Mi cuenta

· Todos los productos· Dormitorio· Salón· Espacio de trabajo· Cocina· Toda la casa· Ofertas

· Club Práctica· Redes sociales

· Newsletter· Información

· Mis favoritos· Mi carro de la compra· Búsqueda

PropuestoProductos

Contacto empresa- clienteEmpresa

Acciones de búsqueda y compra

HOME

PRODUCTOS TIENDA ENTREGAS CLUB

CONTACTO

MI CUENTA

Se ha intentado mejorar las etiquetas antiguas que se caracterizaban por ser inexactas y no seguir una línea común. Dentro de los productos, se mezclaban etiquetas como “Iluminación” con “Salón” y “Otras cosas”. En el nuevo mapa los productos se han dividido por estancias. Esta nueva forma de organización de los productos hace que el usuario no tenga que recorrer un largo camino hasta llegar a un producto determinado. De esta forma, al estar los productos clasificados claramente por estancias de la casa, son más fáciles de distinguir. En el caso de no aparecer en el menú principal la estancia donde se encuentra el producto, se ha añadido la etiqueta “Toda la casa” en el que un desplegable muestra todas las secciones posibles de una casa. También el nuevo menú ofrece la posibilidad de acceder también a cualquier producto gracias a la etiqueta “Todos los productos” donde se podrá escoger la forma de visualización de estos productos, e incluso poder descargar el catálogo en pdf. También se ha añadido la etiqueta “Ofertas”, una sección que antes no aparecía en ningún sitio y era difícil de acceder.Ahora la etiqueta “Club Práctica” ocupa un espacio destacado en el menú, para así darle la importancia que debe tener este canal de comunicación entre empresa y clientes, y entre los mismos clientes. De “Club Práctica” creamos 4 subapartados que deben animar más al cliente a utilizar esta sección de la web, ya que las etiquetas son más amigables: “Eventos”, “Ideas de decoración”, “Productos Practica”, “Foro” y “Redes sociales”.En el pie de la página se ha creado la etiqueta “Información” en la que se engloban todos los servicios que puede ofrecer tanto la empresa como la web y que es posible que el usuario busque, como “Información de financiación”, “Guía de compra online” o “Contacto”. De esta manera se han eliminado etiquetas confusas del menú de navegación principal como eran “Tienda” o “Entregas”.Justo encima del menú de navegación se ha agrupado una serie de etiquetas que son más significativas para el usuario que las que antes aparecían. Se ha añadido “Mis favoritos” y se mantienen “Mi carro de la compra” y “Búsqueda”, eliminando de esta forma etiquetas como “Mi cuenta” o “Entrar” que creaban confusión.

INICIO

Todos los productos Toda la casa Ofertas

Información

Dormi- torio Salón Espacio de

trabajo Cocina Club Practica

Búsqueda avanzada

Búsqueda

Newsletter

Mi carro de la compra

Mis favoritos

Redes sociales

Redes sociales

Contacto

Tarjeta socio

Nuestsras tiendas

Servicio de financiación

Servicio de transporte

Política de devoluciones

Guía de compra online

Preguntas frecuentes

Mapa de la web

Recursivo

Pie de página

Enlaces especiales de la página

CamasLos productos se pueden mostar ordenados por:• habitación• función

De la A a la Z

Catálogo

Online

Descarga de pdf

MultimediaSillas

Mesas

Organi-zación

Sofás y sillones

Mesas

Almacena-miento

Almacena-miento

Almacena-miento

Accesorios

Almacena-miento

Iluminación

IluminaciónIluminación

Niños

Jardín

Comedor

Baño

Cocina

Esp. trabajo

Salón

Dormitorio

Textil

Textil

Textil

Eventos

Ideas decoración

Productos Practica

Foro

Espejos

03. OBJETIVOS

WIREFRAME DE PÁGINA DETALLE (FICHA DE PRODUCTO)En este wireframe podemos observar las mejoras realizadas tanto en el menú de navegación principal como en el pie de la página y la sección relativa a búsquedas y compra.El problema principal de estas páginas era que su apariencia era pobre e inacabada. Se ha reestructurado la colocación del material que disponemos de cada producto, además de añadir sugerencias de navegación por otros productos con “Puedes combinarlo con...”, “También te puede gustar...” y “También vistos...” (que marca al usuario los productos ya visitados ofreciéndole la opción de volver a visitar). Tenemos que destacar que estas etiquetas tienen un lenguaje más informal y sencillo ya que pretende ayudar al usuario tal y como haría un asesor en su compra.

Estructurado a base de una retícula de 9 columnas se han colocado los elementos de una forma que se marquen jerarquías entre ellos. Por ejemplo, la imagen principal tiene un ancho de 4 columnas, mientras que otras imágenes secundarias pueden ser de 1 o 2 columnas.Con tal de que el contenido de la fi cha sea lo más compacto posible se han utilizado carruseles de

imágenes, marcando así el máximo de espacio que deben ocupar los elementos. También para ahorrar espacio con información secudaria se ha creado un botón en la descripción del producto que nos da acceso a una ventana fl otante en la que aparece más información relativa al producto.

Otros nuevos elementos destacados en esta reestructuración es la utilización de “Mis favoritos”, otra forma de hacer que el usuario se implique más y se sienta más cómodo al navegar por la web.En “Mi carro de la compra” se indicará el total de productos añadidos y el total del importe.Se deberán crear iconos identifi cativos para estas dos acciones.

Al haberse eliminado las antiguas etiquetas de “Mi cuenta” y “Entrar” en el menú de navegación principal, al hacer clic en cualquiera de los botones de “Añadir a favoritos” o “Añadir al carro” automáticamente se le pedirá al usuario que se registre o que inicie sesión en el caso que la página detecte que no lo ha hecho previamente.Respecto al pie, destacar que se ha cambiado la antigua etiqueta “Newsletter” que podría ser incomprensible para algún tipo de público por una frase más descriptiva y “amigable”: “Si quieres recibir nuestras novedades inscríbete en nuestro newsletter:”. La web se termina con una franja en la que se indica en qué año se ha actualizado la web.


IMAGEN


120 €

IMAGEN


120 €

IMAGEN


120 €

< > IMAGEN


69 €

IMAGEN


110 €

IMAGEN


80 €

< > IMAGEN


120 €

IMAGEN


120 €

IMAGEN


120 €

< >

LOGO

IMAGEN #1

IMAGEN #2



IMAGEN #3

IMAGEN #4

Todos los productos




AÑADIR A FAVORITOS


Toda la casa OfertasDormitorio Salón Espacio de trabajo Cocina Club Practica

Si quieres recibir nuestras novedades inscríbete en nuestro newsletter:

Búsqueda avanzada





escribe tu email




<>

Características- Los cajones, fáciles de abrir y cerrar,

llevan topes.- Cajones muy amplios. Más espacio para

guardar tus cosas.- También puede usarse de mesilla de noche.

MantenimientoLimpiar con un paño humedecido con una suave solución jabonosa. Secar con un paño seco.

Información adicionalTe recomendamos fi jar el mueble a la pared con el herraje de seguridad que se incluye. Así evitarás que vuelque si un niño se encarama o cuelga del mismo.

Diferentes tipos de pared requieren diferentes herrajes. Utiliza los herrajes más adecuados para tus paredes (no se incluyen).

Puede completarse con otro mobiliario de la serie BIRKELAND.

Combina con otros elementos de la serie BIRKELAND.

Medidas y peso del embalajeBultos: 1Referencia artículo: 201.902.21 Ancho: 57 cm. Fondo: 13 cm. Alto: 73 cm.Peso: 27.4 kg. Cantidad: 1

Montaje del productoDescarga las instrucciones

X




AÑADIR A FAVORITOS



AI PAC03: Mapa web y wireframe

Design

Transcript of AI PAC03: Mapa web y wireframe