Pasar al contenido principal

Ecommerce

Alqueria

Alqueria-image ">

Overview

Un diseño cuidadosamente elaborado

  • UI/UX
  • Desarrollo web a la medida
  • Ecommerce

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ultrices lorem sem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse vitae varius tortor. Phasellus erat enim, hendrerit ut consectetur at, laoreet nec erat. Mauris ac imperdiet lectus. Nullam feugiat, magna ac tincidunt ultricies, odio mauris blandit sapien, et vulputate velit risus a mi. Praesent tincidunt laoreet nibh, non aliquam felis pharetra et. Fusce non volutpat quam. Aliquam placerat ornare elit. In sodales fermentum justo, quis semper augue rhoncus in. Donec feugiat risus a aliquam efficitur.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ultrices lorem sem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse vitae varius tortor. Phasellus erat enim, hendrerit ut consectetur at, laoreet nec erat. Mauris ac imperdiet lectus. Nullam feugiat, magna ac tincidunt ultricies, odio mauris blandit sapien, et vulputate velit risus a mi. Praesent tincidunt laoreet nibh, non aliquam felis pharetra et. Fusce non volutpat quam. Aliquam placerat ornare elit. In sodales fermentum justo, quis semper augue rhoncus in. Donec feugiat risus a aliquam efficitur.

DESAFÍO

ESCENARIO

Mirror es una tienda de ropa. Son una cadena global con ropa para todos. Mirror comenzó en 1994 como una tienda de ropa dirigida a un público que buscaba ropa barata para cualquier ocasión, siguiendo la misma ola que nos trajo Old Navy y H&M. Creen que la ropa no tiene por qué ser cara y durar para siempre, que deberíamos poder cambiar de estilo según lo necesitemos y nos plazca. Mirror tiene mucho éxito sin conexión. Tienen más de 400 tiendas en todo el mundo en 32 países.

image-challenger-1 image-challenger-2

OBJETIVO DEL PROYECTO

Mirror es una tienda de ropa. Son una cadena global con ropa para todos. Mirror comenzó en 1994 como una tienda de ropa dirigida a un público que buscaba ropa barata para cualquier ocasión, siguiendo la misma ola que nos trajo Old Navy y H&M. Creen que la ropa no tiene por qué ser cara y durar para siempre, que deberíamos poder cambiar de estilo según lo necesitemos y nos plazca. Mirror tiene mucho éxito sin conexión. Tienen más de 400 tiendas en todo el mundo en 32 países. Llegan muy tarde en el juego de una transformación digital. Decidieron no invertir en digital porque preferían mantener el servicio en persona. Los clientes lo han estado preguntando durante años, quejándose de que no pueden encontrar su talla en la tienda, por lo que siempre piden ropa en línea en otras tiendas. Mirror también ha reconocido el hecho de que tienen mucho inventario restante en sus almacenes que son muy difíciles de mover.

goal-image

EMPATIZARSE

INVESTIGACIÓN DE MERCADO E INVESTIGACIÓN COMPETITIVA

La conciencia de marca de Mirror tiene mucho éxito en el mercado de la ropa. Sin embargo, en este momento su objetivo de marketing es limpiar su inventario restante a través de la tienda en línea. Por lo tanto, comencé con Investigación de mercado para aprender más sobre el mercado y la demografía, así como para ayudar a Mirror a identificar oportunidades en el mercado, descubrir problemas potenciales y rastrear tendencias en curso. A continuación, analicé el sitio web de comercio electrónico de la competencia en un intento por identificar sus fortalezas y debilidades para comprender las estrategias de la competencia y cómo tienen éxito en el mercado. Mirror tiene tres competidores directos que he identificado que son H&M, Zara, Old Navy y dos indirectos; Amazon y Macys. Durante el análisis, dividí mi investigación en categorías que mostraban las fortalezas, las debilidades, el análisis de UX, los perfiles de marketing y las métricas de marketing. A través de esto, aprendí qué sitio está ejecutando el negocio de manera efectiva con la mayor conversión.

empath-image

MAPA DEL SITIO

ARQUITECTURA INFORMACIONAL

MAPA DEL SITIO

Antes de comenzar con la clasificación de tarjetas, realicé una auditoría de contenido y una investigación de los competidores identificados de Mirror. Este paso me ayudó a conocer la estructura y la arquitectura de la información de los sitios web de ropa. Usé OptimalSort para crear las tarjetas para que los usuarios vean cómo las agrupan en las categorías. Luego apliqué el método híbrido de clasificación de tarjetas a 5 participantes que reflejan la personalidad de Mirror. Tenía 10 categorías junto con 30 elementos diferentes en el tipo de tarjeta. Escogí algunas tarjetas que a los compradores no les resultan familiares para ver cómo conocen los nombres de las tarjetas y las clasifiqué en categorías establecidas. Con base en los resultados de Card Sorting que me ayudaron a evaluar la arquitectura de la información y organizar los contenidos en categorías, creé un mapa del sitio que incluye todas las pantallas propuestas y el flujo de usuarios para ayudarme a comprender la estructura del sitio y mostrar la relación. dentro del contenido del sitio de Mirror

mapsite-image

Requisitos de la interfaz

Tareas de usuario

Requisitos

acciones y contenido que tendrá la pagina

Antes de comenzar con la clasificación de tarjetas, realicé una auditoría de contenido y una investigación de los competidores identificados de Mirror. Este paso me ayudó a conocer la estructura y la arquitectura de la información de los sitios web de ropa. Usé OptimalSort para crear las tarjetas para que los usuarios vean cómo las agrupan en las categorías. Luego apliqué el método.

  • Llega a la página de inicio, encuentra artículos para comprar.
  • Agrega artículos al carrito.
  • Verifica, se registra.

Páginas de la página de inicio y del departamento de la tienda que permiten agregar una unidad de producto al carrito de compras. Páginas de productos individuales y páginas de listas de compras que permiten a los usuarios establecer la cantidad necesaria de producto que se debe agregar al carrito.

La página de detalles del producto debe contener los siguientes elementos: título del producto, foto de alta calidad, precio / precio con descuento, ofertas especiales (si las hubiera), descripción breve que se puede ampliar si el usuario lo desea, productos relacionados (similares), control de la interfaz de usuario que permite el usuario debe especificar la cantidad de producto (en unidades requeridas) y agregarlo al carrito de compras. La página de listas de compras debe contener una colección de listas de productos con un botón "Agregar al carrito" separado para cada elemento de la lista, de modo que el usuario pueda agregar la lista completa con un solo clic. El usuario también puede crear una nueva lista de compras desde esta página; debería haber un botón "Nueva lista de compras" para esto. La página de detalles de la lista de compras debe contener una colección de artículos con el título del producto, imagen de alta calidad y precio / precio con descuento, ofertas especiales.

request-image

Wireframes de fidelidad media

Antes de crear wireframes de fidelidad media, leí mi mapa del sitio y los flujos de usuario y luego creé los requisitos de la interfaz de usuario que contienen mi propia lista de tareas pendientes para cada wireframe. Me concentré en el proceso de compra desde que el usuario llega a la página de inicio hasta el proceso de pago. Según los requisitos de la interfaz de usuario, construí 5 páginas clave para Mirror utilizando una cuadrícula, en un tono monótono (tono de grises) para ayudar Yo camino a través de la estructura del sitio Mirror. Estos wireframes representan el proceso de cómo los usuarios ingresan al sitio, buscan los artículos, los agregan al carrito y hacen clic para realizar el pedido. Las personas compran todo el tiempo en todo tipo de formas, por lo que rediseñar un sitio web receptivo mantiene la lealtad del cliente y atrae a más usuarios, además de aumentar la tasa de conversión más alta para el negocio Mirror. Creé diseños para diferentes ventanas gráficas de la estructura alámbrica existente: móvil y de mesa. Mirando hacia atrás en la versión de escritorio, traté de simplificar cada elemento en la versión para tableta y móvil.

wireframe-image-1 wireframe-image-2

Prototipo de fidelidad media

Se probaron e iteraron las estructuras alámbricas y los prototipos para determinar los flujos de usuarios. Hacer un prototipo liviano me ayudó a probar el producto más rápido antes de construir un sitio completo. Para probar mi diseño, utilicé Invision para cargar mi estructura alámbrica para realizar una prueba interactiva con usuarios de prueba virtuales y en vivo.

prototype-image
Ver Prototipo

Proyectos relacionados