Case study 2: E-commerce Violet Tea

Semana 2

Con este proyecto finaliza la semana 2 en el bootcamp de UX/UI de Ironhack. En este caso nuestro proyecto se ha centrado en la creación de un E-commerce para un comercio local ya existente.

En este post explicaré el proceso de UX. Si quieres ver como se desarrolló el UI de Violet Tea, puedes hacerlo aqui.

El primer paso a la hora de realizar este proyecto era encontrar un comercio local al que pudiéramos ofrecer nuestros servicios.

Nuestro grupo encontró Violet Tea, un pequeño local especializado en tés e infusiones.

Image for post
Image for post

La dueña, Violeta, nos dijo que su proyecto personal para este 2020 era conseguir hacer la página web para su negocio, así que nos informó sobre sus productos, localización y algunas ventas online rudimentarias que ya había realizado.

También nos contó que los principales problemas de Violet Tea consistían en la zona en la que se encontraba su local, y el hecho de que atraía menos clientela de la que les habían prometido.

En este caso podemos dividir la investigación en dos partes fundamentales.

La primera consistió en toda la información que nos dió Violeta, tanto sobre sus tés como sobre los esfuerzos que ya había hecho para mejorar su negocio.
Descubrimos que tenía una presencia bastante buena en redes sociales, con más de 1700 seguidores en Instagram.

Image for post
Image for post

También descubrimos que le gustaba realizar pequeños posts sobre sus productos para ayudar a la gente a aprender un poco más sobre el té, y que sus ventas online hasta la fecha habían venido principalmente de asesorar a clientes de forma personal a través de Instagram.

La segunda parte de la investigación fueron las encuestas y entrevistas. A través de ellas llegamos a dos conclusiones:

  1. Los clientes veían las tiendas de té especializadas como una experiencia sensorial a la que dedicar tiempo. El olor, la atención personalizada, la textura de los tés… Todo ello eran factores que contribuían a que la visita a la tienda especializada no fuera solo un proceso de compra.
  2. La mayoría de los clientes no compraba online por desconocimiento, a pesar de manifestar que no iban a tiendas fisicas por falta de tiempo o por incomodidad.

Los datos obtenidos en la investigación eran claros y nos daban bastante con lo que trabajar, pero las soluciones no fueron tan sencillas.

Nos centramos principalmente en el concepto de la tienda física como experiencia, y nuestro enfoque fue encontrar maneras de trasladar las sensaciones sensoriales a nuestra página web (olor, texturas visuales, etc…)

Para ello investigamos como lo hacían los e-commerce de productos que se veían forzados a esto, como los comercios de velas. Lo que encontramos fue una orientación menos hacia el olor y mas hacia el componente emocional y la experiencia que transmite.

Lo único aplicable que pudimos extraer es la forma en la que teníamos que orientar nuestras descripciones de producto y nuestro material gráfico, cosa que no dependía en absoluto de nosotros sino de como Violeta empleara nuestro E-Commerce.

Image for post
Image for post
Mindmap empleado para correlacionar los diversos conceptos entre sí

También se planteó que deberíamos buscar maneras de hacer que la gente encontrara la tienda y promocionar su situación física. Perdimos una gran cantidad de tiempo en este aspecto, solo para darnos cuenta de que todos los aspectos que podrían atraer gente a nuestra tienda dependían de la tienda en sí, y lo único que había en nuestra mano era mostrarlo en la web y dar a conocer su ubicación

Como solución, decidimos dejar de buscar maneras de trasladar las fortalezas menos tangibles de la experiencia física y enfocarnos a cuales de ellas sí que podíamos aprovechar.

Encontramos que la atención personalizada era un tema recurrente y que formaba parte de esta experiencia física, y al contrastarlo con la propia Violeta descubrimos que la mayoría de ventas online que había podido realizar hasta ahora se habían realizado a través de asesoramiento personal.

Image for post
Image for post
User scenario que muestra como resuelve un pain point nuestra solución

Por tanto, redirigimos nuestra propuesta de valor al carácter didáctico de la tienda, y decidimos que nuestro e- commerce debía aportar las siguientes funcionalidades:

  1. Una manera de alcanzar al público que no tiene el tiempo de visitar el comercio local, pero que aun así busca un producto de calidad. Esto se resolvería mediante la funcionalidad de vender el producto a través de la tienda online
  2. Una plataforma para que Violeta pueda aportar sus conocimientos al proceso de compra. Esto está presente en nuestro e-commerce a través de una plataforma para exponer todos los artículos de divulgación que Violeta había ido subiendo a instagram, además de los próximos que quisiera realizar.
  3. Una forma de atender de manera personalizada a los clientes virtuales, con una experiencia tan cercana a la física como fuera posible. Esto está presente en nuestro e-commerce a través de un chat directo entre el cliente y el propietario, el cual se implementó tras preguntar a Violeta si estaría dispuesta de hacerse cargo de dicha herramienta, o contratar a otros expertos para hacerlo.
  4. Un sistema de exposición del producto que permita dar toda la información necesaria acerca de cada té, tanto técnica y de preparación como sensorial y emocional.

Finalmente, estas funcionalidades fueron condensadas en un prototipo de low fidelity y dieron lugar al esqueleto de nuestro e-commerce.

Image for post
Image for post
Muestra de la pantalla de compra de uno de los Tés en Low Fidelity

Una vez nos aseguramos de que el proyecto funcionaba conceptualmente, tocó encargarse de la usabilidad.

Se agruparon todas las funcionalidades y los conceptos necesarios para llevarlo adelante en distintas categorías, y se empleó un card sorting con diversos usuarios para comprobar cual sería la disposición óptima para cada menú, apartado y funcionalidad.

Lo resultante fue este prototipo de mid fidelity, y nuestro proyecto concluyó en este punto.

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post

Written by

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store