Rediseño e-commerce :

innovación vs. MPV

Proyecto grupal del bootcamp de diseño UX/UI con el objetivo de realizar un rediseño de un e-commerce de un negocio local.

Equipo:

  • Almudena Gallego
  • Darío Hermida
  • Inés Real
  • Sabela Muñiz

Resumen

En el bootcamp de diseño UX/UI nos pidieron rediseñar un e-commerce de un negocio de ámbito local. Nos decidimos por una librería de barrio cercana al campus.

Después de realizar una investigación sobre el negocio y el sector, y de empatizar con los usuarios/clientes del negocio y del e-commerce. Definimos los aspectos a tener en cuenta a la hora de proponer e idear las mejoras en el e-commerce para mejorar la experiencia de los usuarios. Y por último, diseñamos un prototipo de un producto mínimo viable para poder testear y visualizar la propuesta de rediseño.

Investigación y empatización

Herramientas:

  • Desk Research
  • Lean Survey Canvas
  • Encuestas
  • Entrevistas

Para analizar y comprender las características y peculiaridades del negocio y del proyecto a realizar, utilizamos varias metodologías y herramientas de investigación.

Además, nos permitieron recopilar cierta información relevante para poder entender al usuario y sus necesidades, deseos y frustraciones. 

¿Qué necesitábamos saber?

En primer lugar, realizamos una recopilación de datos existentes sobre tendencias de compra online, y datos relacionados con la actividad y el sector al que pertenece el negocio. En este caso, la venta de libros.

Así mismo, redactamos una serie de preguntas para entrevistar al dueño de la librería de modo que nos permitiese conocer mejor las características y circunstancias del negocio. Y así, poder detectar necesidades u oportunidades de mejora. 

Además, aprovechamos la visita al negocio para hacer investigación de campo a través de información que observamos en el local. Y realizamos varias encuestas de “guerrilla” a los clientes que nos encontramos en el negocio.

Por otro lado, definimos otras preguntas para realizar a clientes habituales de negocios con características similares al nuestro. Y de ese modo, poder analizar y comprender las experiencias de estos usuarios a través de sus vivencias.

¿Qué descubrimos?

A partir de la investigación, establecimos tres aspectos fundamentales que fueron los pilares sobre los que sustentar el proyecto:

El aumento exponencial de las compras online a nivel general que no se ve reflejado en el sector editorial.
El principal canal de venta de libros son las librerías, muy por encima de internet.
La importancia de la experiencia de compra por encima de otros aspectos como por ejemplo el precio.

La entrevista con el dueño de la librería nos permitió conocer la situación del negocio y detectar los siguientes aspectos en los que debíamos enfocar nuestras propuestas:

A pesar de tener 3 años, la venta online apenas aporta ganancias al negocio.
Los pedidos a través del e-commerce son mínimos.
El gasto por cliente es más elevado a través de la compra presencial debido a la compra cruzada.

Investigación y empatización

Herramientas:

  • Desk Research
  • Lean Survey Canvas
  • Encuestas
  • Entrevistas

Para analizar y comprender las características y peculiaridades del negocio y del proyecto a realizar, utilizamos varias metodologías y herramientas de investigación.

Además, nos permitieron recopilar cierta información relevante para poder entender al usuario y sus necesidades, deseos y frustraciones. 

¿Qué necesitábamos saber?

En primer lugar, realizamos una recopilación de datos existentes sobre tendencias de compra online, y datos relacionados con la actividad y el sector al que pertenece el negocio. En este caso, la venta de libros.

Así mismo, redactamos una serie de preguntas para entrevistar al dueño de la librería de modo que nos permitiese conocer mejor las características y circunstancias del negocio. Y así, poder detectar necesidades u oportunidades de mejora. 

Además, aprovechamos la visita al negocio para hacer investigación de campo a través de información que observamos en el local. Y realizamos varias encuestas de “guerrilla” a los clientes que nos encontramos en el negocio.

Por otro lado, definimos otras preguntas para realizar a clientes habituales de negocios con características similares al nuestro. Y de ese modo, poder analizar y comprender las experiencias de estos usuarios a través de sus vivencias.

¿Qué descubrimos?

A partir de la investigación, establecimos tres aspectos fundamentales que fueron los pilares sobre los que sustentar el proyecto:

El aumento exponencial de las compras online a nivel general que no se ve reflejado en el sector editorial.
El principal canal de venta de libros son las librerías, muy por encima de internet.
La importancia de la experiencia de compra por encima de otros aspectos como por ejemplo el precio.

La entrevista con el dueño de la librería nos permitió conocer la situación del negocio y detectar los siguientes aspectos en los que debíamos enfocar nuestras propuestas:

A pesar de tener 3 años, la venta online apenas aporta ganancias al negocio.
Los pedidos a través del e-commerce son mínimos.
El gasto por cliente es más elevado a través de la compra presencial debido a la compra cruzada.

Gracias a las encuestas obtuvimos diferentes datos para poder analizar las diferencias entre las experiencia de comprar libros online y presencial.

Los encuestados prefieren comprar libros, según el medio de compra, en:

Los encuestados valoran como aspectos positivos, según el medio de compra:

Los encuestados valoran a la hora de volver a realizar una compra en el mismo negocio:

Y con las entrevistas a clientes habituales de librerías pudimos empatizar más con los usuarios a los que debíamos dirigir nuestras propuestas y comprender sus necesidades.

opiniones entrevistados compra libros

Compra presencial

Prefieren comprar en el comercio local por la atención o asesoramiento personalizado, y por la cercanía en el trato.

Experiencia de compra

Compran otro tipo de productos en e-commerce, pero libros no, porque internet no les ofrece la misma experiencia de ocio y descubrimiento.

Ventajas online

Optan por la compra online cuando necesitan algo muy concreto y con urgencia que no pueden conseguir en una librería. 

Definición e ideación

Herramientas:

  • Affinity Diagram
  • DAFO
  • Lean UX Canvas
  • Competitive Analisys

En esta fase, por un lado utilizamos varias metodologías y herramientas para ir extrayendo la información más relevante de los datos recopilados o que íbamos obteniendo, y con ella poder definir el problema que se quería solucionar y establecer los objetivos del proyecto. 

Y por otro lado, íbamos generando ideas y propuestas en base a ellos, para resolver el problema explorando diferentes enfoques y teniendo al usuario siempre en el centro del diseño.

¿Qué necesitábamos mejorar?

Antes de empezar a generar ideas o propuestas, categorizamos las ideas por temas comunes, organizándolas y dándoles una jerarquía para poder visualizar toda la información obtenida de una manera más directa y simplificada.

Luego analizamos las ventajas competitivas de la empresa para determinar la estrategia genérica que más le convenía en función de sus propias características y las del mercado en el que se mueve.

Para generar propuestas de valor para los usuarios, definimos aspectos como el problema identificado, los usuarios a los que queríamos dirigir nuestras acciones, los beneficios que obtendrían y las ideas o soluciones para lograr esos beneficios.

Y por último, analizamos aspectos positivos y negativos de plataformas e-commerce de venta de libros y e-commerce de librerías con características similares a nuestro negocio, para detectar qué funcionalidades sería bueno incluir y cómo hacerlo. 

¿Qué detectamos?

Durante este proceso, decidimos centrar las propuestas en el e-commerce al detectar que era un elemento que no estaba aportando beneficios significativos al negocio, y que estaba prácticamente desaprovechado.

Por lo que establecimos que debíamos sustentar nuestras propuestas en:

  • La confianza y fidelización de los clientes en el negocio, como principal elemento de valor. 
  • Ofrecer a los clientes habituales una experiencia online similar al trato que reciben presencialmente para animarlos a utilizar el ecommerce. 
  • Aprovechar las ventajas de la compra online para aumentar las ventas por este medio, y atraer nuevos clientes ampliando el perfil de clientes habituales.

Además, gracias a la comparativa con la competencia, detectamos varios aspectos a mejorar en el e-commerce actual, tanto en la búsqueda de productos como en el proceso de compra.

Definición e ideación

Herramientas:

  • Affinity Diagram
  • DAFO
  • Lean UX Canvas
  • Competitive Analisys

En esta fase, por un lado utilizamos varias metodologías y herramientas para ir extrayendo la información más relevante de los datos recopilados o que íbamos obteniendo, y con ella poder definir el problema que se quería solucionar y establecer los objetivos del proyecto. 

Y por otro lado, íbamos generando ideas y propuestas en base a ellos, para resolver el problema explorando diferentes enfoques y teniendo al usuario siempre en el centro del diseño.

¿Qué necesitábamos mejorar?

Antes de empezar a generar ideas o propuestas, categorizamos las ideas por temas comunes, organizándolas y dándoles una jerarquía para poder visualizar toda la información obtenida de una manera más directa y simplificada.

Luego analizamos las ventajas competitivas de la empresa para determinar la estrategia genérica que más le convenía en función de sus propias características y las del mercado en el que se mueve.

Para generar propuestas de valor para los usuarios, definimos aspectos como el problema identificado, los usuarios a los que queríamos dirigir nuestras acciones, los beneficios que obtendrían y las ideas o soluciones para lograr esos beneficios.

Y por último, analizamos aspectos positivos y negativos de plataformas e-commerce de venta de libros y e-commerce de librerías con características similares a nuestro negocio, para detectar qué funcionalidades sería bueno incluir y cómo hacerlo. 

¿Qué detectamos?

Durante este proceso, decidimos centrar las propuestas en el e-commerce al detectar que era un elemento que no estaba aportando beneficios significativos al negocio, y que estaba prácticamente desaprovechado.

Por lo que establecimos que debíamos sustentar nuestras propuestas en:

La confianza y fidelización de los clientes en el negocio, como principal elemento de valor. 
Ofrecer a los clientes habituales una experiencia online similar al trato que reciben presencialmente para animarlos a utilizar el ecommerce.
Aprovechar las ventajas de la compra online para aumentar las ventas por este medio, y atraer nuevos clientes ampliando el perfil de clientes habituales.

Todos estos procesos nos llevaron a formular las siguientes hipótesis con las que obtener un resultado comercial si los usuarios/clientes obtienen un beneficio.

Definición e ideación

Herramientas:

  • User persona
  • Test usabilidad
  • User journey

¿Cómo podemos ayudar a mejorar la experiencia del e-commerce actual?

Para empezar a generar ideas y propuestas, primero creamos un modelo del posible usuario/cliente al que queríamos dirigir nuestras acciones basándonos en la investigación, segmentación y perfil definidos con anterioridad. 

Y de ese modo, poder identificar sus ambiciones o motivaciones, y sus frustraciones o temores, y de ese modo, poder ofrecerle soluciones que le aporten beneficios. 

En este caso, definimos un cliente que le encanta la lectura y disfruta descubriendo novedades y curiosidades. Sin embargo, por falta de tiempo o debido al horario de apertura, no puede acudir a su librería local y no encuentra ningún e-commerce que le convenza para comprar libros de forma online.

Después, analizamos la experiencia de compra en nuestro e-commerce realizando un test de usabilidad con personas reales.

Les encomendamos la tarea de buscar y comprar un libro para regalar a un ser querido. Mientras registrábamos toda la experiencia como el trayecto realizado, sensaciones, problemas, y toda la información que nos ayudase a comprender mejor los deseos y necesidades de los usuarios y de ese modo, detectar oportunidades.

¿Qué propusimos?

Con toda la información obtenida en este proceso, llegamos a las siguientes propuestas para mejorar el e-commerce actual y favorecer o aumentar las ventas a través de él.

Definición e ideación

Herramientas:

  • User persona
  • Test usabilidad
  • User journey

¿Cómo podemos ayudar a mejorar la experiencia del e-commerce actual?

Para empezar a generar ideas y propuestas, primero creamos un modelo del posible usuario/cliente al que queríamos dirigir nuestras acciones basándonos en la investigación, segmentación y perfil definidos con anterioridad. 

Y de ese modo, poder identificar sus ambiciones o motivaciones, y sus frustraciones o temores, y de ese modo, poder ofrecerle soluciones que le aporten beneficios. 

En este caso, definimos un cliente que le encanta la lectura y disfruta descubriendo novedades y curiosidades. Sin embargo, por falta de tiempo o debido al horario de apertura, no puede acudir a su librería local y no encuentra ningún e-commerce que le convenza para comprar libros de forma online.

Después, analizamos la experiencia de compra en nuestro e-commerce realizando un test de usabilidad con personas reales.

Les encomendamos la tarea de buscar y comprar un libro para regalar a un ser querido. Mientras registrábamos toda la experiencia como el trayecto realizado, sensaciones, problemas, y toda la información que nos ayudase a comprender mejor los deseos y necesidades de los usuarios y de ese modo, detectar oportunidades.

¿Qué propusimos?

Con toda la información obtenida en este proceso, llegamos a las siguientes propuestas para mejorar el e-commerce actual y favorecer o aumentar las ventas a través de él.

Mejorar la búsqueda

Mejorar y facilitar la experiencia a través de diferentes medios o rutas para llegar de una manera sencilla y rápida al producto que buscas.

Proceso de compra ágil

Diseñar y ofrecer un sistema de registro, envío y pago intuitivo, rápido y flexible. Comprar como invitado.

Recomendaciones

Mostrar y proporcionar recomendaciones de otros lectores, añadir una selección de libros realizada por el librero, etc.

Trato cercano

Ofrecer información clara, diferentes medios de contacto, y utilizar un tono cercano y humano.

Prototipado y testeo

Herramientas:

  • Card sorting
  • Sitemap
  • User flow
  • Análisis Heurístico

En esta fase, utilizamos varias herramientas y prototipos con las que plasmar las ideas definidas en las anteriores fases para poder testear con los usuarios, y de ese modo, obtener retroalimentación y mejorar la solución.

¿Qué necesitábamos diseñar?

Al detectar que las categorías del e-commerce creaban dificultades a la hora de buscar los productos de una manera intuitiva y ágil, decidimos reorganizarlas basándonos en los resultados obtenidos con los testeos.

Empleamos diferentes herramientas para poder comprender, visualizar y organizar el contenido, pantallas, rutas y elementos necesarios para conformar el nuevo e-commerce.

Para poder mejorar la experiencia de búsqueda y compra del e-commerce, analizamos la usabilidad del e-commerce actual. Y de ese modo, comprender qué aspectos no estaban funcionando para mejorarlos o evitarlos a la hora de realizar el nuevo diseño.

Prototipado y testeo

Herramientas:

  • Card sorting
  • Sitemap
  • User flow
  • Análisis Heurístico

En esta fase, utilizamos varias herramientas y prototipos con las que plasmar las ideas definidas en las anteriores fases para poder testear con los usuarios, y de ese modo, obtener retroalimentación y mejorar la solución.

¿Qué necesitábamos diseñar?

Al detectar que las categorías del e-commerce creaban dificultades a la hora de buscar los productos de una manera intuitiva y ágil, decidimos reorganizarlas basándonos en los resultados obtenidos con los testeos.

Empleamos diferentes herramientas para poder comprender, visualizar y organizar el contenido, pantallas, rutas y elementos necesarios para conformar el nuevo e-commerce.

Para poder mejorar la experiencia de búsqueda y compra del e-commerce, analizamos la usabilidad del e-commerce actual. Y de ese modo, comprender qué aspectos no estaban funcionando para mejorarlos o evitarlos a la hora de realizar el nuevo diseño.

A la hora de analizar el e-commerce actual tuvimos en cuenta aspectos como visibilidad, consistencia, minimizar la carga cognitiva, estética minimalista, flexibilidad y eficiencia del uso, etc.:

Prototipado y testeo

Herramientas:

  • Wireframe Low-Fi
  • Wireframe Mid-Fi
  • Sistema de Diseño
  • Moodboard
  • Guía de estilo
  • Design atomic
  • Wireframe High-Fi

Para comprobar la eficacia de nuestras propuestas, en primer lugar, creamos un diseño de baja calidad. En el que incluimos todo lo que pensamos que necesitaba saber y ver el usuario para comprender la tarea a realizar.

Teniendo en cuenta todo lo anterior, las conclusiones obtenidas del testeo del primer diseño y el análisis del e-commerce actual, diseñamos un prototipo con más detalle incluyendo las mejoras que consideramos que debía tener el nuevo diseño del e-commerce.

Para definir, documentar y crear todos los elementos que iban a formar parte del prototipo final, utilizamas varias herramientas con las que definir la imagen de marca,  tipografía, colores, espaciados y todos los elementos y componentes de nuestro diseño, de forma que sea más fácil de comprender a la hora de trabajar con más gente o de pasar el diseño a desarrollo.

Por último, Con todos estos elementos definidos y con los cambios realizados gracias al testeo del prototipo de calidad media, creamos el prototipo de alta calidad, lo más cercano al resultado final, para poder mostrar y testear nuestras propuestas de rediseño.

¿Qué comprobamos?

Gracias a los diferentes prototipos obtuvimos distinta información para poder analizar la experiencia de búsqueda y compra que nos permitiese mejorar nuestra propuesta de rediseño.

Prototipado y testeo

Herramientas:

  • Wireframe Low-Fi
  • Wireframe Mid-Fi
  • Sistema de Diseño
  • Moodboard
  • Guía de estilo
  • Design atomic
  • Wireframe High-Fi

Para comprobar la eficacia de nuestras propuestas, en primer lugar, creamos un diseño de baja calidad. En el que incluimos todo lo que pensamos que necesitaba saber y ver el usuario para comprender la tarea a realizar.

Teniendo en cuenta todo lo anterior, las conclusiones obtenidas del testeo del primer diseño y el análisis del e-commerce actual, diseñamos un prototipo con más detalle incluyendo las mejoras que consideramos que debía tener el nuevo diseño del e-commerce.

Para definir, documentar y crear todos los elementos que iban a formar parte del prototipo final, utilizamas varias herramientas con las que definir la imagen de marca,  tipografía, colores, espaciados y todos los elementos y componentes de nuestro diseño, de forma que sea más fácil de comprender a la hora de trabajar con más gente o de pasar el diseño a desarrollo.

Por último, Con todos estos elementos definidos y con los cambios realizados gracias al testeo del prototipo de calidad media, creamos el prototipo de alta calidad, lo más cercano al resultado final, para poder mostrar y testear nuestras propuestas de rediseño.

¿Qué comprobamos?

Gracias a los diferentes prototipos obtuvimos distinta información para poder analizar la experiencia de búsqueda y compra que nos permitiese mejorar nuestra propuesta de rediseño.

Prototipo Low-Fidelity

Obtuvimos información sobre la experiencia de búsqueda y de compra, con la que realizamos varias modificaciones en cuanto al filtrado y a las diferentes rutas para llegar a un mismo producto.

Redujimos el tiempo de búsqueda y compra con respecto al e-commerce actual.

Prototipo Mid-Fidelity

Comprobamos y analizamos diferentes aspectos relacionados con la arquitectura de la información, el diseño y la usabilidad.

Lo que nos llevó a realizar diferentes cambios en el diseño para mejorar la experiencia.

Prototipo High-Fi

Comprobamos la utilidad de poder llegar a un producto por diferentes medios, así como el uso de diferentes filtros.

Los usuarios agradecen las facilidades y atajos propuestos en el proceso de compra.

Y la información es útil, y está bien organizada y presentada.

Demostración del prototipo final

¿Qué aprendí?

Quizá la idea de replicar la experiencia de compra presencial en el e-commerce, es un propósito demasiado ambicioso para nuestras capacidades y el tiempo del que disponíamos. 

Por lo que optamos por mejorar el proceso de venta del e-commerce actual e incluir alguna funcionalidad que mejorase la experiencia de búsqueda, como las recomendaciones del librero, recomendaciones relacionadas con el producto que estás viendo, opiniones y valoraciones, visualizar primeras páginas, guardar o compartir productos, etc.

Solventar los problemas más básicos y esenciales del e-commerce actual, y dejar mejoras y soluciones más innovadoras para pasos futuros como: 

Recomendaciones personalizadas en base a compras realizadas e intereses.
Sugerencias de compras cruzadas.
Chat directo con la librería.
Realizar peticiones especiales.
Mostrar los resultados y productos de un modo más innovador y atractivo.

¿Quieres saber más sobre cómo soy?

Contacta conmigo.