Ejercicio Artículo 1.10. El prototipado en la arquitectura de la información

Documentos relacionados
GUÍA DE USUARIO: GOOGLE DRIVE

SYMBALOO 1º.- QUÉ ES? 2º.-Darse de alta en Symbaloo

Presentaciones compartidas con Google Docs (tutorial)

UNIVERSIDAD DE MEDELLÍN NUEVO PORTAL WEB MANUAL DE USUARIO GESTOR DE CONTENIDOS

Manual de usuario. Autor: Oriol Borrás Gené.

GUÍA RED SOCIAL FACEBOOK

Ilustraciones

Tutorial de herramientas de Google

El e-commerce de Grupo JAB es una herramienta que permite a los clientes del Grupo, realizar un amplio conjunto de servicios de consulta, petición y

1.- DESCRIPCIÓN Y UTILIDAD DEL SOFTWARE DAEMON TOOLS.

Manual para la utilización de PrestaShop

CONFEDERACIÓN DE EMPRESARIOS DE MÁLAGA

AGREGAR UN EQUIPO A UNA RED Y COMPARTIR ARCHIVOS CON WINDOWS 7

Creando una webquests

El Add-on SAXOPRINT pro design para Adobe InDesign

MÓDULO 3 HERRAMIENTAS EN LA NUBE: ANFIX

MANUAL DE CS-ALMACENES (MAYO 2012)

Una App para Facebook

... Formas alternativas de escribir un texto. Columnas. anfora CAPÍTULO 4

1. Qué hacemos con la información encontrada en Internet? 2. De cuántas maneras se puede guardar una información?

Manual de Usuario: Administrar Listas de Distribución

MICROSOFT WORD 2007 AVANZADO. Unidad Didáctica Nº 1

Tutorial de Introducción a la Informática Tema 0 Windows. Windows. 1. Objetivos

Accesibilidad web GUÍA FUNCIONAL

TALLER CREACIÓN PÁGINAS WEB - NVU Prácticas

15 CORREO WEB CORREO WEB

DIAGRAMA QUE NOS MUESTRA LA CREACION DE UN MAILING O CARTA MODELO COMBINADA

Mejoras introducidas MARKETING GIO

GUIA DE BLOQUEO Y DESBLOQUEO WEB

Porcentajes. Cajón de Ciencias. Qué es un porcentaje?

Cómo crear una web desde Webnode?

Manual básico para poner un Enlace Web en el Aula Virtual de Helvia.

GUÍA DE USUARIO DEL CORREO

STRATO LivePages Inicio rápido

Compartir carpetas en XP

POWER POINT. Iniciar PowerPoint

Internet como herramientas de comunicación: El correo electrónico

Sitios remotos. Configurar un Sitio Remoto

GMAIL (avanzado) 1. Accede a la web de Gmail, Te destacamos las funcionalidades que vamos a enseñarte a. 2. Vamos a enseñarte a:

01 Índice. GESTOR DE CONTENIDOS Manual de uso 01 ÍNDICE OBJETO DEL DOCUMENTO ESTRUCTURA GRÁFICA DEL SISTEMA... 3

Ministerio de Educación. Base de datos en la Enseñanza. Open Office. Módulo 5: Report Builder

Uso del Programa Gantt Project

Acciones pueden haber en Flash más de 1000 por lo tanto no se trata de aprenderlas de memoria sino de utilizarlas cuando nos interese.

MANUAL PARA GESTIÓN DE INCIDENCIAS INFORMÁTICAS

Guía Rápida de MyEgoo.com

Cómo crear una copia de seguridad del contenido de Outlook. Service Desk

HIPERVÍNCULOS. Es posible asignar un vínculo a un texto, a una imagen, o a parte de una imagen

Alberto Marcano Díaz

CASO PRÁCTICO. ANÁLISIS DE DATOS EN TABLAS DINÁMICAS

Guía de uso del Cloud Datacenter de acens

Manual de uso básico de la aplicación

Figura 4.6: Prototipo de la pantalla de inicio.

La pestaña Inicio contiene las operaciones más comunes sobre copiar, cortar y pegar, además de las operaciones de Fuente, Párrafo, Estilo y Edición.

MANUAL DE USO PROGRAMA DE GESTIÓN AGENCIAS DE VIAJES

Módulo I - Word. Iniciar Word Finalizar Word Definición de elementos de pantalla Escribir texto en un documento El cursor...

CREAR UNA CUENTA DE CORREO : GMAIL

Guía rápida del usuario DoliShop

TRABAJANDO CON BLOGGER

TUTORIAL DE LinkedIn. Proyecto Empleo 2.0

PLANTILLAS EN MICROSOFT WORD

Presentaciones. Con el estudio de esta Unidad pretendemos alcanzar los siguientes objetivos:

MANUAL DE AYUDA MODULO TALLAS Y COLORES

C. E. I. P. LAS VIÑAS. Bollullos del Cdo. (Huelva) Centro TIC/DIG. Buscar en Internet

Copia de Seguridad en windows

Manual de NVU Capítulo 4: Los enlaces

Configuración de DNS seguros

COMO CREAR UNA PÁGINA WEB 2-INTRODUCCIÓN A DREAWEAVER

Mi correo con OUTLOOK

Guía nuevo panel de clientes Hostalia

Relaciones entre Tablas en una Base de Datos Access

Plataforma Educativa Manual del Docente Nivel II Módulo 3 Wiki

Manual de iniciación a

Cómo creo las bandejas del Registro de Entrada /Salida y de Gestión de Expedientes?

TEMA 4: EMPEZANDO A NAVEGAR ESCUELA UNIVERSITARIA DE INFORMÁTICA. Raúl Martín Martín

Notas para la instalación de un lector de tarjetas inteligentes.

Tutorial DC++ Usarlo es muy sencillo y configurarlo también, aunque tiene algunos trucos importentes.

Capítulo 9. Archivos de sintaxis

Cómo instalar fácilmente tu WordPress tras contratar un hosting en Hostalia

PANEL DE CONTROL (Zona de Administración) MANUAL DE USO Por conexanet. Revisión 1.1 Fecha

EL PROGRAMA DE PRESENTACIONES IMPRESS (I)

Inicio del programa WORD 2007

Sube tus vídeos a YouTube

Organización del contenido en un blog

Jornadas de INCLUSION DIGITAL. a través de las TIC ORGANIZAN: CAPACITA: CLAEH

LiLa Portal Guía para profesores

Servidor FTP LEECH FTP INDICE PRESENTACIÓN ACERCA DE CTRLWEB MAILING WORD AYUDA : Acceso a Panel de Control. 1.-Panel de control privado.

GUÍA RED SOCIAL LINKEDIN

RESOLUCIÓN DE ERRORES EN MOODLE CAMPUS VIRTUAL-BIRTUALA UPV-EHU

Más Clientes Más Rápido: Marketing Online bien enfocado

El control de la tesorería consiste en gestionar desde la aplicación los cobros y pagos generados a partir de las facturas de venta y de compra.

Estructurar la información dentro del ordenador:

Laboratorio 6. Creación de sitios Web - Dreamweaver

TUTORIAL DE PUBLICACIÓN PARA REDACTORES

para jóvenes programadores

MANUAL DE PRACTICUM12 PARA UNIVERSIDADES ÁMBITO MÁSTER

Musikaze Concursos Organiza tu concurso de bandas online

Manual básico de Outlook Express

Pago por Clic. Aumenta ya el tráfico a tu web

Manual Web Alexia Profesor. Índice

MEDIA KIT TRAFFICFACTORY.BIZ

Transcripción:

Maximiliano Díaz Molinaro Ejercicio Artículo 1.10. El prototipado en la arquitectura de la información Realizar un primer análisis de las webs de Zara (http://www.zara.com/webapp/wcs/stores/servlet/home/es/es/zara-sales) y Mássimo Dutti (http://www.massimodutti.com/webapp/wcs/stores/servlet/home/dutties/es/massimodutti?usecookie=1) y tratar de identificar los principales elementos arquitectónicos que éstas presentan. Tras ese análisis, tendréis que familiarizaros con una de las dos las herramientas de prototipado (wireframes y blueprints) MockFlow o Gliffy. Podréis encontrar un tutorial de esas dos herramientas entre los documentos de la unidad didáctica. Una vez familiarizados con la herramienta, existen dos opciones distintas de evaluación: Opción A. Utilizando esa 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. Opción B. Aquellos alumnos que quieran hacer un ejercicio más completo pueden utilizar esta herramienta de prototipado y proponer de forma argumentada, además, un blueprint que incluya los diferentes tipos de contenidos que cuelgan de esa página principal. La web de Zara dispone de una barra de navegación situada a la izquierda y un pequeño menú (Idiomas, Identifícate, Cesta de compra y Contacto) en la parte superior derecha que son los elementos permanentes a lo largo de toda la navegación. En mi opinión la página web es algo confusa y caótica porque algunas de sus etiquetas se prestan a la confusión, pero también porque no hay un pie de página permanente que nos informe sobre cómo comprar, o que informe sobre qué es Zara y sus políticas como empresa y 1

además, no hay un acceso fácil a las herramientas ya clásicas y tan valiosas de la web social (facebook, Twitter, Youtube, Pinterest, etcétera), elementales en el mundo comercial. Vamos por partes. En cuanto a las etiquetas, para empezar tenemos un error grave en la imagen que se muestra más arriba. La cabeza de la modelo confunde la etiqueta Identifícate, que queda medio escondida por el cabello de la misma; es evidente que cuando cambia la imagen se ve claramente, pero es un error que debería evitarse. Pero lo que queremos destacar de las etiquetas es que hay una mezcla de conceptos que no son claros de entrada. El primero, la etiqueta Última semana imaginamos que debe referirse a ofertas concretas durante una semana, pero no se explica en ninguna parte. Luego encontramos otra que nos refiere a TRF; tampoco hay explicación sobre qué es TRF. He buscado información (con las palabras clave TRF Zara) y luego de una búsqueda no muy sencilla, en el séptimo lugar de resultados, he encontrado información facilitada por terceros que nos explica que TRF es una segunda marca de Zara dirigida a un público más joven. Por último, y para no extendernos más, hay una serie de etiquetas (Campaña, Lookbook o Wednesday) de las cuales tampoco hay una explicación para saber de forma rápida de qué se trata. He navegado por estas secciones y más o menos puedo hacerme una idea, pero no ofrecen nada en especial que las diferencie y haga de estas etiquetas una necesidad para encontrar información valiosa. En cuanto al pie de página, lo hemos encontrado en la sección Última semana y en terceros niveles como en la sección People. El pie de página contiene: Guía de compra, Síguenos, Políticas y Empresa pero no hay constancia de la autoría de la página. Creemos que es básico que el pie de página esté presente al menos en el primer y segundo nivel de navegación. Por último, tal y como se apuntaba más arriba, la posibilidad de compartir contenidos en las redes sociales o bien de adherirse a los diferentes canales de Zara no es de fácil acceso y eso, hoy día, se paga caro. A favor de la web de Zara podemos decir que la navegación es sencilla y en todo momento podemos acceder a los contenidos que se nos muestran sin tener que pasar por la página principal. Faltaría, eso sí, los breadcrumbs para tener clara la ubicación en todo momento. Por último, la opción de Búsqueda es bastante buena en comparación con la opción que ofrece Massimo Dutti. El cajón de búsqueda se encuentra en la parte inferior de la barra de navegación y al lanzar una búsqueda, por ejemplo: pantalones, los resultados los presenta diferenciados por la categoría de mujer, TRF, hombre, niños y todos, cosa sumamente útil. Por lo que se refiere a la web de Massimo Dutti, también tiene barra de navegación situada a la izquierda y aquí sí hay un pie de página. Esto último es importante porque ofrece información útil y de fácil acceso a lo largo de toda la navegación. El pie de página se encuentra en la parte inferior derecha y, a parte de la información habitual, ofrece un acceso rápido a las redes sociales. Ambos elementos, la barra de navegación y el pie de página, son permanentes a lo largo de la navegación. Hay en la parte superior derecha, también de forma permanente, la opción de cambio de país/idioma, un cajón de búsqueda, acceso a Ayuda y a Mi cuenta y Cesta de compra. 2

En términos generales podemos decir que es una página mejor confeccionada respecto a la de Zara y con buenas soluciones para entender de qué se trata en cada una de las secciones. Por poner un ejemplo, la etiqueta Lookbook corresponde a una sección donde se nos muestra conjuntos o combinaciones de ropa reales; al ver la imagen del modelo, aparece una pestaña que indica Shop the look y si clicamos en ella a continuación se superpone una ventana donde se muestra, de forma individualizada, cada uno de los elementos que viste el/la modelo y se nos da información adicional sobre cada prenda. Para salir de esta sección, y de algunas otras, hay una etiqueta que indica Back to shop. Es tal vez el uso del inglés una crítica posible a la web de esta empresa, más que nada porque el visitante que no domine el idioma puede desorientarse en un momento determinado. Por último, añadir que no dispone de breadcrumbs (en la web de Zara tampoco), y que el sistema de Búsqueda deja mucho que desear en comparación con el de Zara. Hemos probado diferentes búsquedas y en todas hemos obtenido resultados donde no hay categorías. Para acabar, y en referencia a las dos webs, no existe un mapa del sitio (blueprint) que nos dé una visión general del contenido. 3

Opción A. Wireframe de la empresa téxtil Retales realizado con MockFlow. La página principal tendrá un aspecto semejante al de la imagen: 4

Opción B. Blueprint de la página web de Retales confeccionado con Gliffy: 5