//briefing

PROYECTO

WEB
ClackClack
//briefing
shoes
¿Porqué una web para ClackClack? //briefing

En la actual era de la información y de tecnología, hay una acelera-

ción del ritmo de trabajo y del estilo de vida. A todos nos gusta ser
prácticos y obtener lo que queremos en el menor tiempo posible, y
no es para menos cuando se trata de la información.

?
Por ello es tan importante hacer una página web para ClackClack, y
así poder mostrar esa información a sus clientes en el menor tiempo
posible, mediante un medio rápido, barato e independiente.
El sitio web le permitirá al cliente acceder a diferentes datos sobre
la empresa y los productos, incluyendo imágenes, videos o descrip-
ciones.. También servirá para reforzar la imagen corporativa de la
empresa.
La web será creada para cumplir las siguientes funciones:

Fidelización de clientes: mediante la página web, la empre-

sa pretende que sus clientes formen parte del estílo de vida que
representa ClackClack, manteniendo informados y actualizados a
los usuarios en todo momento. La web servirá como herramienta
para crear un espacio abierto en el que los usuarios podrán re-
lacionarse entre sí y compartir sus experiencias, opiniones, foto-
grafias...La empresa, de esta manera, conocerá mejor los gustos y
preferencias de sus clientes.
Captar nuevos clientes: otro fin de la web es dar a cono-
cer a la empresa y sus productos, y así poder captar nuevos clien-
tes. Un correcto posicionamiento y uso de internet provocará que
nuevos usuarios se fijen en la empresa. Los nuevos usuarios logra-
rán contactar con la empresa desde la comodidad de su hogar o
desde cualquier lugar del mundo en el que se encuentren.

Por tanto, el objetivo de la empresa es crear una página web para

captar nuevos clientes y fidelizarlos, y mantenerlos informados de
forma fresca y renovada.
Análisis del sector //briefing

ClackClack shoes es una empresa de caracter nacional. Encontra-

mos empresas de su competencia que son nacionales o interna-
cionales. Nos vamos a centar en investigar páginas web de dise-
ñadores famosos de zapatos, zapatos de autor, que se aproximen
al target de ClackClack. También se analizarán otras empresas del
sector aunque algunas no sean competencia directa de la empresa.

Empresas de zapatos de autor:

//Manolo Blahnik
//Jimmy Choo
//Louis Vuitton
//Christian Louboutin
//Christian Dior
//Dolce & Gabbana

Empresas de zapatos:
//Mari paz

Análisis del sector //briefing

Empresas de zapatos de autor:

Manolo Blahnik: http://www.manoloblahnik.com/
Site Map:
Home
Biography
The man
The shoes
Collection
This season
Stories
Press
News
What´s new
Where to buy
Contacts
Análisis del sector //briefing

Empresas de zapatos de autor:

Manolo Blahnik: http://www.manoloblahnik.com/

Contenidos y servicios: Publicidad:

Web del diseñador de zapatos de tacón. La web contiene No aparece ningun banner de publicidad en toda la web.
una biografía del diseñador y otra de sus zapatos. Mues-
tra sus distintas colecciones de zapatos, y portadas de ¿Para quién va dirigida?
revistas donde han salido. Noticias de actualidad sobre la
marca, dónde están las tiendas, y un contacto. Principalmente a su público más clásico, glamusoro y fiel.
Hay poca cantidad de texto, y se estructura en columnas
estrechas. La tipografía utilizada tiene un tamaño normal, Conclusiones:
y siempre aparece en color blanco.
Es una web que funciona, técnicamente es efectiva y no
Jerarquia: aparecen dudas en su navegación. Es una web clara y
limpia, no hay saturación de elementos gráficos, quizás
La web cuenta con un menú lateral en la parte izquierda demasiada poca saturación.
de la pantalla como sistema de navegación, y en la parte Busca a un target clásico, por el uso de sus colores cor-
derecha se encuentran los contenidos desarrollados. porativos en la web.
Es una web diseñada para navegar por ella sin el uso del
scroll lateral..
Uso del color:
El color que más predomina es el gris, ya que ocupa todo
el fondo de la página web, y el blanco, pues es el color de
la tipografía.
En la sección de collection, llama la atención el uso de los
colores saturados de los zapatos, que contrastan mucho
con la apariencia fría y seria que tiene toda la web.
Análisis del sector //briefing

Empresas de zapatos de autor:

Jimmy Choo: http://www.jimmychoo.com/
Site Map:
Home
Collections
Spring/summer 11
Choo 24:7 bags
Cruise 11
Choo 24:7
Choo 24:7 bags
SS 11
Cruise 11
Choo 24:7
Hunter
Ugg
Mens
Fragance
Shoes
Handbags
Accesories
Sale
Choo Connection
Fuera del menú, encontramos otros servicios
como:
Buscador / Iniciar sesión / Registrarse/
Encuentra la boutique/ Contacto/ Terminos
Legales/ Cesta de la compra.
Análisis del sector
Empresas de zapatos de autor:
Jimmy Choo: http://www.jimmychoo.com/
Contenidos y servicios:
Web del diseñador de zapatos de tacón. La web contiene
mucha información, como todas sus colecciones de zapa-
tos, bolsos, complementos, colonias..
Contiene una tienda virtual, donde comprar cualquier
producto de los que nos ofrecen. También dispone de un
acceso identificado para iniciar sesión, y así pertenecer
a la zona ¨vip¨ de la página web, y de un buscador de
contenidos.
Hay mucha cantidad de información, aunque está bien
estructurada El texto se encuentra centrado siempre que
aparece. La tipografía utilizada tiene un tamaño normal, y
siempre aparece en color negro o en el gris corporativo.
Jerarquia:
En primer lugar, la web cuenta con una cabecera en la
parte superior con el logotipo de la empresa. Debajo,
cuenta con un menú superior, donde pinchando en cada
sección se desarrollan los contenidos ocupando toda la
página. También dispone de un footer en la parte inferior.
La home no tiene scroll lateral, pero al entrar en cada
una de sus secciones si lo encontramos, aunque no es
muy extenso.
//briefing
Uso del color:
Los colores que predominan en la web son el blanco, el
negro y el beige, que son los tres colores corpotativos de
la empresa. El uso del color es muy importante en las fo-
tografías de la web, son colores contrastados que hacen
llamadas de atención sobre los productos.
Es una página web cálida.
Publicidad:
Aparece un sólo banner de publicidad en la página web
de la própia empresa, y está situado en la parte inferior
de la web, a modo de faldón. Sólo aparece en la home.
¿Para quién va dirigida?
Principalmente a su público objetivo, chicas jóvenes y mo-
dernas, un tanto atrevidas.
Conclusiones:
Dado su público objetivo, pienso que es una web clára-
mente hecha para ellas, donde forman una comunidad, se
puede comprar on-line y las mantiene informadas y a la
última.
Análisis del sector //briefing

Empresas de zapatos de autor:

Louis Vuitton: http://www.louisvuitton.com/
Site Map:
Home
El universo de Louis Vuitton
Tiendas
Personalización
E- Shopping

Fuera del menú, encontramos otros

servicios como:
Buscador / Su cuenta / Boletín
electrónico/ Contacto/ Carreras
profesionales/ Avisos legales/
Condiciones generales/ Mapa del
sitio web/ Preguntas/ Medio Ambiente
Análisis del sector
Empresas de zapatos de autor:
Louis Vuitton: http://www.louisvuitton.com/
Contenidos y servicios:
Web del diseñador de zapatos de tacón. Disponible en
varios idiomas, elegimos uno que nos lleva a la home.
La web contiene mucha información, como todas sus
colecciones de zapatos, bolsos, complementos...
Contiene una tienda virtual, donde comprar cualquier
producto de los que nos ofrecen atraves de un registro
de datos. También dispone de un acceso identificado para
iniciar sesión, y así pertenecer a la zona ¨vip¨ de la página
web, y de un buscador de contenidos. Hay un menú que
pinchando sobre el nos lleva a una página donde el dise-
ñador colabora con sus diseños con el medio ambiente.
Esta página contiene sonido y animaciones flash.
Hay mucha cantidad de información, aunque está bien
estructurada.
Más importancia a las imágenes que a los textos. No
tiene scroll. Sí tiene música.
Uso de Flash para animaciones en fotografías y menus.
Uso de elementos gráficos corporativos de la empresa,
como por ejemplo para el cursor cuando está cargando.
Jerarquia:
La web se encuentra enmarcada dentro de un marco
negro. En la parte superior izquierda, se encuentra el
logotipo de la empresa. A su derecha, un pequeño menú.
Debajo, está el top menú horizontal, y el buscador en la
parte derecha.
//briefing
En el resto de la página se situan los contenidos.
También dispone de un footer en la parte inferior.
Uso del color:
Diferenciación del menú por colores corporativos. De-
pendiendo de donde situemos el cursor, aparecerá de un
color que se repetirá en el desarrollo de la sección.
Los colores que predominan en la web son el blanco y
el negro, que son los colores corpotativos de la empre-
sa. Las fotografías están muy bien tratadas, y sus colores
también.
Publicidad:
No contiene publicidad de otras empresas ni de la mis-
ma.
¿Para quién va dirigida?
Principalmente a su público objetivo, mujeres interesadas
por la moda. El usuario puede interactuar con la web.
Conclusiones:
Me parece una web muy interesante, ya que se hacerca
a la estética de ClackClack y utiliza recursos diferentes
otras páginas web de la competencia. Hace un buen uso
de los espacios en blanco.
Análisis del sector //briefing

Empresas de zapatos de autor:

Christian Louboutin:
http://www.christianlouboutin.com/
Site Map:
Home
Louboutin world
The collection
Store locator
Online shopping
Loubi Blog&gossip
The Louboutin times

Fuera del menú, encontramos otros

servicios como:
Find a boutique/ Where do i repair my
Louboutins?/ Contact us/ Terms of use/
Análisis del sector
Empresas de zapatos de autor:
Christian Louboutin:
http://www.christianlouboutin.com/
Contenidos y servicios:
Web del diseñador de zapatos de tacón. Disponible solo
en inglés. La web contiene mucha información, como una
parte donde habla solo del diseñador, otra de sus colec-
ciones...
Contiene una tienda virtual, donde comprar cualquier
producto de los que nos ofrecen atraves de un registro
de datos. También dispone de un acceso identificado.
Me parece interesante la idea de hacer un periódico lla-
mado The Louboutin Times, de 4 páginas, donde hace un
repaso general sobre famosos, diseños...También contiene
un blog.
Esta página contiene sonido, que por cierto es muy in-
cómodo y un abuso de las animaciones flash. Aparecen
animaciones por toda la página, incluso al cliquear sobre
alguna categoría del menú se mueven unos zapatos para
llegar hasta él.
No hay mucha cantidad de información. No dispone de
scroll lateral ni horizontal.
Jerarquia:
La web se encuentra enmarcada dentro de un marco
rojo. En la parte superior se encuentra la cabezera, com-
puesta por el lgotipo de la empresa en la parte izquierda,
y a su derecha un menú que hace referencia al blog, el
periódico, mi cuenta y las tiendas.
//briefing
También aparece un cronómetro de cuantos dias quedan
para que salga la nueva colección de invierno.Debajo,
está el top menú horizontal. En el resto de la página se
situan los contenidos.
También dispone de un footer en la parte inferior.
Uso del color:
Diferenciación del menú por colores rojo y blanco. Los
colores que predominan en la web son el negroy el rojo,
que son los colores corpotativos de la empresa. Las foto-
grafías son animaciones flash, donde aparece una feria de
colores.
Publicidad:
No contiene publicidad de otras empresas ni de la mis-
ma.
¿Para quién va dirigida?
Principalmente a su público objetivo, y sobretodo con su
público más joven. El usuario puede interactuar con la
web a través del blog, la tienda...
Conclusiones:
Me parece una web cargada de animaciones flash, que
entorpece y cansa al usuario. El sonido que utilizan es
molesto y repetitivo. Pero me parece muy interesante lo
del periódico, y que es la primera web de un diseñador
que he visitado que contenga blog.
Análisis del sector //briefing

Empresas relacionadas con el sector:

Christian Dior:
http://www.dior.com/
Site Map:
Home
Pret-a-porter
Colecciones
Bolsos
Calzado
Marroquinería
Accesorios
Relojes
Joyería
Dior phone
Baby Dior
Ayuda y consejos
Tiendas
Contacto
Newsletter
Los universos dior

Fuera del menú, encontramos otros

servicios como:
Los universos dior/ Política de privacidad/
Buscador/ Cesta de la compra.
Análisis del sector
Empresas relacionadas con el sector:
Christian Dior:
http://www.dior.com/
Contenidos y servicios:
Web de la multinacional. Disponible en diferentes idio-
mas. En el index, podemos elegir entre moda y accesorios,
perfumería y belleza, joyería y relojería. Para el análisis de
la web, se analizará moda y accesorios. La web contiene
mucha información muy bien estructurada por diferentes
submenús.
Contiene una tienda virtual, donde comprar cualquier
producto de los que nos ofrecen atraves de un registro
de datos. También dispone de un buscador. Uso de ani-
maciones flash pero de manera responsable.
Jerarquia:
La web contiene a su izquierda una columna con el logo-
tipo de la empresa en la parte superior, y el menú lateral.
En la parte superior derecha se encuentra el buscador y
la cesta de la compra. El resto de la página está compues-
to por los contenidos.
Uso del color:
La home es de color negro con algunos matices en azul,
utilizando el color blanco para tipografías, logotipos y
demás elementos gráficos.
//briefing
Al acceder a alguna categoría del menú, cambian los colo-
res por completo, siendo el blanco en gran predominan-
te y el color negro para la tipografía. Da una apariencia
limpia, y buen uso de los contragrafismos.
Publicidad:
No contiene publicidad de otras empresas ni de la mis-
ma.
¿Para quién va dirigida?
Principalmente a su público objetivo, usuarios serios y
convencionales.. El usuario puede interactuar con la web
a través de la tienda, lasúltimas noticias...
Conclusiones:
Es una página web muy limpia donde el diseño está muy
cuidado, lo cual está bien logrado porque saben transmi-
tir a través de su web los valores que reflejan la marca.
Me parece interesante el salto de color de la home a las
categrorías del menú, ya que la hace más dinámica y han
sabido lograr que siempre parezca que seguimos en la
misma página web.
Análisis del sector //briefing

Empresas relacionadas con el sector:

Dolce & Gabbana:
http://www.dolcegabbana.es/
Site Map:
Home
Pret-a-porter
Colecciones
Bolsos
Calzado
Marroquinería
Accesorios
Relojes
Joyería
Dior phone
Baby Dior
Ayuda y consejos
Tiendas
Contacto
Newsletter
Los universos dior

Fuera del menú, encontramos otros

servicios como:
Los universos dior/ Política de privacidad/
Buscador/ Cesta de la compra.
Análisis del sector //briefing

Empresas relacionadas con el sector:

Dolce & Gabbana:
http://www.dolcegabbana.es/ Site map
Análisis del sector
Empresas relacionadas con el sector:
Dolce & Gabbana:
http://www.dolcegabbana.es/
Contenidos y servicios:
Web de la marca, donde engloba todo el mundo que
forma D&G. Disponible en diferentes idiomas. Cuenta
con acceso a redes sociales, donde la marca participa
activamente en ellas.
Es una página web cargada de información, donde se uti-
liza el flash para cambiar algunas imágenes. El uso de las
animaciones flash apenas se aprecia, se hace de manera
muy suave.
Pese a tanta información, está bien estructurada, el usua-
rio no se pierde por los contenidos. También contiene
una tienda virtual. Tiene scroll lateral y horizontal.
La home contiene un vídeo que nos lleva directamente a
youtube.
También hay una sección que nos lleva, al igual que la pá-
gina de Manolo Blahnik, a las portadas de la revista Vogue
donde D&G a participado.
Jerarquia:
La web contiene la cabecera, compuesta por el logotipo
de la empresa en la parte izquierda superior. A conti-
nuación en la parte de abajo de la cabecera, aparece un
menú compuesto por los cinco grandes bloques en que
se divide la página. También aparecen en este menú los
iconos de las redes sociales.En la parte derecha de la ca-
becera, aparece una opción para cambiar el idioma, iniciar
//briefing
sesión y unirte al club. El resto de la página está compuesto por
los contenidos., donde se jerarquizan por el tamaño que ocu-
pen en la página, siendo los más grandes los más importantes.
Uso del color:
La home es de color negro, utilizando el color blanco para tipo-
grafías, logotipos y demás elementos gráficos. como los filetes
que separan los contenidos
Publicidad:
La publicidad que aparece son los logotipos de las redes socia-
les y de youtube, pero aparecen de una manera muy sutil.
¿Para quién va dirigida?
Principalmente a su público objetivo, usuarios jóvenes y de clase
social alta. El usuario puede interactuar con la web a través de
la tienda, las redes sociales...
Conclusiones:
Es una página web dinámica, donde el diseño está muy cuidado,
pero a la vez es rompedora con las demás webs de la compe-
tencia, lo cual está bien porque saben transmitir a través de su
web los valores que reflejan la marca.
Es la web más diferente que he analizado, por la distribución de
sus elementos de forma reticular.
Me parece interesante el recurso de participar en redes socia-
les, ya que las anteriores páginas web analizadas ninguna tiene
este complemeto. También es la primera que me he encontra-
do que tenga en la home un video.
Algo que no me gusta, es que en la home cuando quieres en-
trar en alguna caregoría se abre una ventana nueva.
Análisis del sector //briefing

Conclusiones de la indagación:
Utilización de marcos, para encuadrar la página web.
El logotipo siempre aparece en la parte superior dere-
cha de la página web, normalmente aparece en sus colo-
res corpotarivos.
Me parece raro que solo una página web de las analiza-
das tengan acceso directo y participe en redes sociales.
Es común en casi todas una tienda virtual, acceso
identificado y catálogo de productos de la empresa.

Uso de elementos corporativos, como por ejem-

plo para las barras de cargando,o para flechas...
También es importante el uso de colores corpora-
tivos en la web, tanto para el fondo de la home como
para diferenciar contenidos en los menús.
Casi todas tienen en común un buscador de conteni-
dos dentro de la web, ya que contienen mucha informa-
ción.
Es raro que tengan scroll lateral, la mayoría procuran
buscar otras soluciones diferentes.
Todas tienen en común un elemento, el footer.
También es importante el uso de animaciones flash,
pero de forma responsable y no abusando mucho de
este recurso.
Análisis del sector //briefing

Empresas relacionadas con el sector:

MARYPAZ:
http://www.marypaz.com/
Site Map:
Home
Inicio
Empresa
Tiendas
Colecciones
Únete
Contacto
Tarjeta regalo
Zapatos online
Blog
Análisis del sector
Empresas relacionadas con el sector:
MARYPAZ:
http://www.marypaz.com/
Contenidos y servicios:
Web dedicada a zapatos y bolsos, de caracter nacional.
Disponible solo en español.
La home está bien estructurada, situada en el centro de
la página. Contiene una tienda virtual, donde comprar
cualquier producto de los que nos ofrecen atraves de
un registro de datos. También dispone de un acceso a
redes sociales. Un localizador de tu tienda más cercana.
Dispone de un apartado de tendencias, donde e dan las
claves para la temporada. Uso de animaciones flash para
la cabecera y la tienda virtual.
Jerarquia:
La web contiene en la parte superior la cabecera, que
dispone del top emenú, del logotipo de la empresa, y
también de imágenes flash que van cambiando.. El resto
de la web está estructurado en dos columnas, una más
ancha para presentar nuevos spots, novedades en gene-
ral, y otra más estrecha para anuncios de la empresa. Al
final de la web encontramos un enace que nos lleva a la
tienda virtual,, y debajo el footer de la web.
//briefing
Uso del color:
La web utiliza el color azul corporativo y algunos matices
de este mismo color. para componer los menús y el fon-
do. Para las tipografías se utiliza el color blanco, para que
resalte con el color azul.
Publicidad:
Contiene publicidad de la própia empresa, convirtiendose
en protagonista de la web.
¿Para quién va dirigida?
Principalmente a su público objetivo, chicas jóvenes y
atrevidas.. El usuario puede interactuar con la web a tra-
vés de la tienda, el acceso a redes sociales, el blog....
Conclusiones:
Es una página web sencilla pero cargada de contenidos
que les interesa a su público, como el blog, el acceso a
redes sociales, la tienda virtual...creo que han conseguido
hacercarse a target. Me parece muy interesante que en
la galeria de fotos al hacer clic sobre cada zapato, tenga
acceso directo a la tienda.
Análisis del sector //briefing

Empresas relacionadas con el sector:

Converse:
http://www.converse.es/
Site Map:
Home
Catálogo
calzado
textil
complementos
Comunity
Blog
Registro
Contacto
Trabaja con nosotros
Historia
Prensa
Análisis del sector
Empresas relacionadas con el sector:
Converse:
http://www.converse.es/
Contenidos y servicios:
Web dedicada a zapatillas masculinas y femeninas.
Es una web en clave alta, y bien estructurada.
Al situar el cursor sobre el top menú, se abre un desple-
gable en la sección de catálogo que, cliqueando sobre
cada una de las categorías, nos lleva a la galería de imáge-
nes.
Contiene una tienda virtual, donde comprar cualquier
producto de los que nos ofrecen atraves de un registro
de datos. También dispone de un acceso a redes sociales
y a una galería de vídeos de la empresa donde se pueden
hacer comentarios. Uso de sonidos para los menús, y
animaciones flash para cargar la página.
Jerarquia:
La web contiene en la parte superior la cabecera, com-
puesta por el logotipo, un pequeño menú y el registro.
Debajo, aparece una galería de imágenes que son links de
las diferentes colecciones de zapatillas, que ocupa todo el
ancho de la página. A continución la web se divide en tres
columnas, que también son links de colecciones diferen-
tes.
Tiene footer con categorías que no aparecen en otra
parte de la web, como historia, o trabaja de nosotros.
Aunque no tenga scroll lateral tiene un uso el footer.
//briefing
Uso del color:
La web utiliza el color blanco para el fondo y las tipo-
grafías, y el negro para los menús. Utiliza una textura de
papel arrugado para el fondo de la página web.
Publicidad:
Contiene publicidad de la própia empresa, ya que presen-
ta sus colecciones.
¿Para quién va dirigida?
Principalmente a su público objetivo, chicos y chicas
jóvenes.. El usuario puede interactuar con la web a través
del acceso a las redes sociales, con el registro para que te
envíen el newsleter...
Conclusiones:
Es una página web sencilla y muy limpia, y también atrac-
tiva. Me parece interesante la idea de que el menú sea
desplegable solo con situar el rató sobre el, sin hacer
click. Es molesto un ruido que suena, como una especie
de campana cuando cambiamos de página.
Posicionamiento de la web //briefing
Principalmente, la web de ClackClack tratará fidelizar sus clientes
para que formen parte del estílo de vida que presenta la empresa.
La web servirá como herramienta para crear un espacio abierto
en el que los usuarios podrán relacionarse entre sí y compartir
sus experiencias, opiniones, fotografias...mediante el blog. También
podrán comprar los productos que ofrece ClackClack mediante
su tienda virtual, o simplemente hechar un vistazo en su catálogo
online. También mantendrá informados a los usuarios mediante
una sección de tendencias de lo último en el mundo del calzado, y
otra sección con lo último del mundo de ClackClack.
Otrao fin de la web será captar nuevo clientes, sirviendo esta
como otra plataforma para darse a conocer con un diseño limpio
y atractivo. Así, los nuevos usuarios lograrán contactar con la em-
presa desde la comodidad de su hogar o desde cualquier lugar del
mundo en el que se encuentren.
Arquitectura de la información //briefing

Según las necesidades de la empresa:

Arquitectura de la información //briefing

Según las necesidades del usuario A:

El usuario A es un tipo de clienta

habitual de la empresa, que ya la conoce y
busca información sobre novedades, sobre
nuevas colecciones y compra online. Usa
frecuentemente el blog.
Arquitectura de la información //briefing

Según las necesidades del usuario B:

El usuario B es un tipo de usuario

nuevo de la empresa o que ha comprado
en ella pocas veces, quiere conocerla me-
jor y formar parte de ella.
 //briefing

Proyecto realizado por Alejandra Lombardo Valero