Objetivo

Crear un nuevo diseño website para una nueva submarca de De Blanco a Tinto.

 

Naming

En los talleres de Hands On I nos ha tocado crear un nuevo diseño de website para una nueva submarca de “De Blanco a Tinto”.

El nombre elegido para la submarca de De Blanco a Tinto, es “Un brindis”. Quisimos mostrar la experiencia de compartir con alguien cercano una buena bebida con una frase típica que hace referencia al momento concreto en el que se va a consumir el producto.

Utilizamos una tipografía moderna que pueda ser atractiva para gente joven.

El claim por el que apostamos es “Tu mejor selección de blanco, rosé y tinto”, ya que queremos acotar la cantidad de productos para esta submarca y creemos que los más representativos y que más se venden son estos, aunque añadiremos algún espumoso. 

Como nuestro público objetivo es, principalmente, de España, hemos decidido que el nombre fuera en castellano. Así, también le damos una continuidad con la página original, De Blanco a Tinto.

 

Logo

Para el logo hemos utilizado la tipografía Big John. Es una tipografía de caja alta y sin serif, que nos da un toque actual. 

Queríamos que la marca se leyera fácilmente, por lo que no queríamos que fuera rebuscada. La imagen, nos ayuda a reforzar el significado del nombre, ya que son dos copas haciendo la acción de brindar. 

Para complementar el nombre, tenemos el claim, donde hemos utilizado la tipografía DIN Condensed. Esta tipografía contrasta con la anterior por ser más alargada. 

El hecho de tener dos tipografías nos permitirá jugar gráficamente a la hora de usarlas tanto para la página como para la imagen de la marca. 

Para la gama de colores, hemos mantenido los colores de la marca madre, De Blanco a Tinto, para mantener una coherencia entre ellas.

 

Podemos utilizar el logotipo tanto en una tinta (solo blanco, negro o burdeos) o en dos tintas (blanco con las copas en burdeos o negro con las copas en burdeos). 

El logotipo puede funcionar tanto como isotipo (texto + imagen), como isotipo (solo imagen) o como logotipo (solo texto), dependiendo de la necesidad que tengamos en ese momento.

 

Personas

Hemos creado dos users personas de diferente sexo y edad basados en el target del briefing del cliente.

 

Anna Dalmau

Tenemos a Anna, una joven de 25 años, que vive en Barcelona y trabaja como Account Manager. Le gusta celebrar fiestas en casa con sus amigos y le gusta beber vino para relajarse mientras cocina.

Anna es una adicta a las redes sociales y la mejor manera para llegar a ella es precisamente vía Instagram, ya que está acostumbrada a consumir publicidad en esta red. Suele decidirse a comprar productos recomendados por influencers y amigos. 

Para dirigirse a ella con una campaña habría que hacerlo desde un tono cercano y ofreciéndole alguna promoción o descuento. 

Le irrita tener que gastar mucho tiempo en realizar una compra, así que desde esta plataforma podemos facilitarle el proceso para impulsar la compra de nuestro producto.

 

Ignacio Fernández

 

A diferencia de Anna, Ignacio tiene 42 años y vive con su mujer en Las Rozas, por lo que tiene un perfil más maduro y un presupuesto más elevado acorde a su nivel de vida. 

Realiza la mayoría de sus compras online, por lo que tendríamos que dirigirnos a él con campañas y SEM y Display en las que el mensaje no esté enfocado en el precio sino en la calidad de los productos “premium”.

Consume vino en cenas con sus amigos, por lo que siempre trata de informarse sobre el producto para poder quedar bien delante de los demás.

 

 

Arquitectura de la información

Las clasificación de las categorías de la nueva web serían:

 

 

La idea es simplificar el menú para que los usuarios menos expertos puedan encontrar los productos que están buscando sin que esto suponga un esfuerzo muy grande. 

El menú será de estilo hamburguesa, tanto en desktop como en mobile, para no entorpecer la experiencia del usuario. 

Tenemos seis categorías principales divididas en: vino blanco, vino rosado, vino tinto, espumoso, para picar y packs.

Blanco tiene dos subcategorías: seco y afrutado, que nos permiten dividir los productos de una manera fácil de identificar. 

En las subcategorías de Tinto hemos decidido no incluir el vino Joven, ya que tenemos pocos productos en nuestra página web, y no entran dentro del precio. De esta manera, nos quedamos con las subcategorías: crianza, reserva y gran reserva. 

La categoría Para picar está dividida en dos tipos de productos: dulce o salado. 

La última categoría sería Packs, y contiene diferentes ofertas de productos cerrados para comprar juntos, tanto packs de vino como de vino y comida que saldrían más económicos que comprarlos por separado.

En las fichas de producto de los productos que formen parte de un pack, nos aparecerá un mensaje de sugerencia de ese pack, invitando al usuario a elegirlo. 

También tendremos un buscador donde el usuario puede buscar por marca, categoría, tipo de vino…

En el carrito de la compra habrá un campo para códigos promocionales, que pueden venir dados por campañas publicitarias hechas en Redes Sociales. 

El usuario podrá realizar la compra de dos maneras: como invitado o iniciando sesión (registrado). 

Los productos se podrán añadir a una wishlist a través de un botón añadido en la ficha de producto. Para ello, el usuario tendrá que estar registrado en la página. 

Tanto el botón de Wishlist como el de Añadir al carrito se podrán activar desde el listado de productos, sin necesidad de entrar en la ficha de cada producto en específico. 

La ordenación en el listado de productos será:

• Precio de menor a mayor
• Precio de mayor a menor
• Marca, A-Z
• Marca, Z-A

Al final de la página, antes del footer, encontraremos un banner que redirigirá al usuario a la página De Blanco a Tinto, con un copy parecido a: “¿Te has quedado con ganas de más? Descubre más productos en De Blanco a Tinto”. 

En el footer aparecerá:

• Redes Sociales: Las Redes Sociales de Un Brindis serían Instagram y Facebook, ya que son las plataformas más usadas por nuestros usuarios potenciales. 

• Conócenos

• Contacto

• Términos y condiciones 

• Política de privacidad 

• Métodos de pago

 

 

Wireframes

 

Iniciamos creando algunos bocetos en papel en los que diseñamos la home, página de productos, ficha de producto y el proceso de compra.

 

En este proceso tuvimos en cuenta las características de nuestro público objetivo para adaptar el proceso de compra a sus necesidades.

Teniendo en cuenta esto, hemos decidido que el menú sea en formato “hamburguesa” y que se despliegue para dejarnos seleccionar las categorías y subcategorías, pero que no estén todo el rato a la vista para que el diseño se vea más limpio. 

En la home agregamos un slider con fotos de lifestyle que refleja la esencia de la marca y el claim “Tu mejor selección de blanco, rosé y tinto” que describe la filosofía de Un brindis.

En todas las páginas aparecerá al final la opción de suscribirse a la Newsletter del ecommerce, creemos que será interesante para los usuarios recibir noticias sobre los productos nuevos y posibles promociones. Además, pensando en que estamos trabajando con una submarca, en el footer añadimos la opción de acceder a home de “De Blanco a Tinto”, para que los clientes puedan acceder a ella para ver más productos. 

En la misma línea de crear una website poco recargada y con espacios en blanco, en la página listado de productos hemos optado por poner únicamente la foto, el nombre y el call to action que sería un botón con el precio. 

En cuanto a la página de la ficha de producto, a parte de la foto, el nombre y la marca, hemos añadido tres “tips” a cada producto, en los que describimos su sabor, aroma y con qué alimento se recomienda acompañarlo. 

También hemos incluido un apartado de “Algo de picar para tu brindis” en el que recomendamos productos de la marca que irían bien con el vino en concreto. Finalmente, siguiendo la línea de “lifestyle” en la página de producto pondremos un vídeo personalizado de cada vino en el que se vea a gente consumiendo y disfrutando de él. 

En la página del carrito de la compra hemos querido que se pueda modificar la cantidad elegida de cada producto y que cuando el subtotal del precio sea inferior a 50€, se avise del importe que queda para que el pedido sea gratuito y cuando sea igual o superior se indique que el envío será gratuito. También creemos necesario poner el botón de “seguir comprando” para invitar al cliente a mirar más productos, además del de “pagar”. 

En cuanto al formulario de pago, pensamos que por comodidad y para que no se abandone la compra, debe ser lo más corto y sencillo posible. En una columna en la izquierda estará la posibilidad de seleccionar el método de pago con el que se quiere pagar y los datos imprescindibles para realizar la compra serán: nombre, apellidos, dirección, provincia, ciudad y, en caso de pagar con tarjeta, el titular, el número, la fecha de caducidad y el código de seguridad. 

En la última página del proceso de compra simplemente se confirmará que la compra ha sido realizada con éxito y se pondrá un banner para seguir navegando y encontrar más productos.

 

 

Andrea Barboza

María Játiva

Mireia Sánchez

Víctor Hugo Martín