Tienda Currys

Caso de Estudio
Nombre	Tienda Currys
Período	2013-2013
Palabras Clave	diseño grafico responsive design
Estudiado en	Tutorías Gráfica Digital 2013
Estudiado por	Bernardo Silva

Encargo Elegir un sitio web que sea responsivo y establecer una mirada detenida en las buenas practicas tomadas por el sitio, entender el porqué de estas decisiones, lleva a que el contenido se muestre de una manera, cual es la prioridad del sitio.

Presentación

Currys es un sitio que vende electrodomésticos por medio de la compra online. Este permite el envío del producto al hogar o en cambio, reservarlo en la tienda.

Analizando el Sitio

Se medirá la interacción del sitio en 4 tamaños que se ubican en una media respecto a la gran variedad de tamaños que existen actualmente en el mercado.

Se toma partido por analizar el home del sitio ya que este cuenta con una gran variedad de información, al ser un sitio de ventas, ofrecer variedad(cantidad) es clave para su éxito.

Para mostrar el tipo de interacción a la que se ve sometida el sitio, se mediran los siguientes elementos que componen el sitio:

• Tamaños
• Grilla
• Navegación
• Tipografía

Tamaños

Así es como se presenta el sitio al ingresar en distintas resoluciones, podemos apreciar que luego del menú, inmediatamente viene un aviso de venta especial, después se alcanzan a ver promociones en productos.

Tamaños

• 240 x 320 px, Celulares Pequeños.
  
• 320 x 480 px, iPhone & otros.
  
• 480 x 640 px, Tablets Pequeños.
  
• 768 x 1024 px iPad.
  
• 1204 x 728 px (hacía arriba) iPad y Ordenador.
  

• Vista total de la home en distintos tamaños.

Grilla

La manera en como se ordenan los contenidos es bastante lógica, al cambiar su tamaño se mantiene el mismo orden de criterio.

• Menú principal
  
• Slideshow (publicidad)
  
• Ofertas
  
• Anuncios
  
• Productos populares
  
• Menú Secundario
  

Grilla de como se dividen los elementos

• Tamaño de los divs(cajas de contenido).

Desde el tamaño a la manera en como se organiza el contenido, cambia dependiendo la resolución del soporte. Ejemplo de esto es la sección de Anuncios donde se aprecia claramente el cambio de los tamaños y disposición. Estos se deben a que el sitio busca de optimizar al máximo el espacio, colocando varios anuncios en un mínimo espacio.

A pesar de que cambie en numero de filas, la cantidad de elementos que se muestran se mantiene en una medida, por ejemplo, Anuncios en un tamaño máximo muestras 6 filas horizontales, mostrando una cantidad de 6 elementos, luego cambia a una fila de 2 horizontales por 3 verticales, lo que equivale a los 6 anteriores, así mismo, para los tamaños pequeños se muestra una fila horizontal por 6 elementos verticalmente.

Tamaños de los divs

Cambios notorios

• Reducción del menú.

Este se compacta cambiando las palabras por símbolos, se puede acceder a las categorías del menú expandiendo este. Se genera un problema cuando se expande en desde 320px de ancho ya que no se puede volver a contraer el menú

]]