ux e ecommerce - cursos de verano upv/ehu
TRANSCRIPT
#EcommerceEHU @bubalie
El poder de Mr. Google IV
UX y Usabilidad para e-commerce
#EcommerceEHU
#EcommerceEHU @bubalie
Como mejorar la Experiencia de compra en
nuestros Ecommerce a través de buenas
practicas de experiencia de usuario y
usabilidad
#EcommerceEHU @bubalie
Tesco Homeplus Virtual Subway Store in South Korea
https://www.youtube.com/watch?v=fGaVFRzTTP4
#EcommerceEHU @bubalie
ALDO Virtual Store - Lionel-Groulx
https://www.youtube.com/watch?v=4ABVUOXHkxo
#EcommerceEHU @bubalie
http://jeffsuderman.com/the-wow-factor-increasing-employee-engagement
Conseguir una experiencia “wow”, una experiencia de compra online
memorable!
#EcommerceEHU @bubalie
Tener un buen producto no es suficiente…
Es necesario crear una experiencia de compra óptima y diferenciadora
#EcommerceEHU @bubalie
Los productos son perecederos pero las experiencias son memorables
Vínculo emocional fidelidad + diferenciación
#EcommerceEHU @bubalie
Birchbox
#EcommerceEHU @bubalie
Una buena UX se traduce en mejoras en:
1. La satisfacción y fidelización de los clientes
2. Eficiencia y productividad del sito web
3. Ratios de conversión y ROI
#EcommerceEHU @bubalie
El usuario es la base estratégica de un Ecommerce que funciona
Optimizar la relación con el cliente y comprender los insights de este es
clave.
#EcommerceEHU @bubalie
Pero no es fácil….- uno de cada cuatro consumidores abandonan la
visita tras aterrizar en la home/landing page
- solo un 20% escoge productos y los mete en su carrito de la compra
- y aquellos que lo hacen, un 60% lo dejan abandonado sin pasar por caja
#EcommerceEHU @bubalie
Proceso de compra online llevado a la vida “física/offline”
http://www.youtube.com/watch?v=3Sk7cOqB9Dk&list=PLC34DC3AFD26EF033&index=2&feature=plpp_video
#EcommerceEHU @bubalie
Elementos clave para una buena UX
#EcommerceEHU @bubalie
1. Página de inicio
2. Navegación
3. Páginas de categorías
4. Páginas de producto
5. Carrito de la compra, checkout y registro
6. Asistencia en compra / servicio al cliente
7. Trato exclusivo y personal
8. Confianza y credibilidad
Elementos clave
#EcommerceEHU @bubalie
Elementos clave
Página de inicio1
#EcommerceEHU @bubalie
¡Primer contacto con la tienda!
La primera impresión es la que vale!
50 milisegundos
Diseño claro y ordenado confianza
Página de inicio1
#EcommerceEHU @bubalie
Reconocimiento, propuesta de valor y diferenciación
– Qué vendemos?
– Cuales son las ventajas de comprar en nuestro sitio web?
– Quienes somos?
Página de inicio1
#EcommerceEHU @bubalie
Página de inicio1
Optimizar el “hero area”
– Imágenes o vídeos gran formato o pantalla completa
– Textos cortos
– 1 o 2 llamadas a la acción
– Gran carga visual y poder comunicativo
#EcommerceEHU @bubalie
Página de inicio1
https://www.dollarshaveclub.com/
Dollar Shave Club
#EcommerceEHU @bubalie
Página de inicio1
#EcommerceEHU @bubalie
Más pautas…– Sistema de navegación eficiente
– Carga rápida
– Buscador eficiente
– Contenido jerarquizado
– Mensajes más importantes en base a cada tipo de usuario
– Personalizar la experiencia
– Elementos sociales Confianza
– Generar “brand content”
Página de inicio1
#EcommerceEHU @bubalie
Elementos clave
Navegación2
#EcommerceEHU @bubalie
La «encontrabilidad (findability)» de los productos es una de las claves de cualquier
tienda online.
Si no pueden encontrarlo, no pueden comprarlo!
Problemas de navegación y encontrabilidad de productos abandonos inmediatos y perjudican a la marca.
Si los usuarios no encuentran lo que buscan, no volverán….
Navegación2
#EcommerceEHU @bubalie
Simplifica tu navegación primaria
Navegación2
#EcommerceEHU @bubalie
Crea páginas de las categorías principales
Navegación2
#EcommerceEHU @bubalie
Ubica la misma sub-categoría en múltiples categorías principales si es necesario
Navegación2
#EcommerceEHU @bubalie
Ubica la misma sub-categoría en múltiples categorías principales si es necesario
Navegación2
#EcommerceEHU @bubalie
Incluye una categoría o un filtro de “novedades”
Navegación2
#EcommerceEHU @bubalie
Sugiere productos alternativos y complementarios en las páginas de producto
Navegación2
#EcommerceEHU @bubalie
Lista los ítems visitados/vistos recientemente
Navegación2
#EcommerceEHU @bubalie
Enlaza las imágenes contextuales a los productos mostrados
Navegación2
#EcommerceEHU @bubalie
Enlaza las imágenes contextuales a los productos mostrados
Navegación2
#EcommerceEHU @bubalie
Elementos clave
Páginas de listado de
productos
3
#EcommerceEHU @bubalie
Para aumentar nuestros ratios de conversión, debemos optimizar nuestro proceso de venta y este comienza en las
páginas de categorías y listados
Páginas de listado de
productos
3
#EcommerceEHU @bubalie
Páginas de listado de
productos
3
Proceso de compra: embudo de conversión
#EcommerceEHU @bubalie
Ver y navegar productos de forma fácil e intuitiva pagina de producto
– Grid View y List View
– Ordenar y filtrar productos
Páginas de listado de
productos
3
#EcommerceEHU @bubalie
Grid View y List View:
Páginas de listado de productos3
#EcommerceEHU @bubalie
Ordenar productos:
Páginas de listado de productos3
#EcommerceEHU @bubalie
Filtrar productos:
Páginas de listado de productos3
#EcommerceEHU @bubalie
Filtrar productos:
Páginas de listado de productos3
#EcommerceEHU @bubalie
Elementos clave
Páginas de producto 4
#EcommerceEHU @bubalie
Una pagina de producto muy visual, social y personalizada puede incrementar la conversión en
hasta un 50%, mejorar el pedido medio en un 30% y reducir las devoluciones en hasta un 30%.
Página de decisión de compra!
Páginas de producto 4
#EcommerceEHU @bubalie
– Imagen potente del producto
– Funcionalidades de realidad aumentada
– Título descriptivo y claro
– Subtítulo, refuerzo
– Descripción detallada, características
– Llamada a la acción “Añadir al Carrito”
– Precio, visible y enfatizado, mejor con descuento
– Transparencia con la política de gastos de envío y devolución
Páginas de producto 4
#EcommerceEHU @bubalie
– Indicar las ofertas especiales, gastos de envío gratuitos y demás promociones
– Contenido social integrado
– Ratings y Reviews
– Venta cruzada
– Recomendaciones personalizadas
– Breadcumbs o migas de pan
Páginas de producto 4
#EcommerceEHU @bubalie
Páginas de producto 4
#EcommerceEHU @bubalie
Páginas de producto 4
#EcommerceEHU @bubalie
Páginas de producto 4
#EcommerceEHU @bubalie
Elementos clave
Carrito de la compra,
checkout y registro5
#EcommerceEHU @bubalie
«Un pago o “check-out” simple, sin sorpresas y con posibilidad de reservar online y recoger en tienda puede reducir la tasa de carritos abandonados en
hasta un 50%»
¡Importancia crítica en la tasa de abandonos y el ratio de conversión final!
Carrito, checkout y registro5
#EcommerceEHU @bubalie
Carrito, checkout y registro5
#EcommerceEHU @bubalie
CARRITO: «Soft add to cart»
– Un carrito que muestre a los usuarios que contiene sin tener que ir a otra página.
– Generar un dialogo/feedback al añadir un producto
– Flexibilidad al usuario: ir al producto, eliminar, etc.
– Indicar nº de ítems.
– Página carrito: flexible y eficiente, incentivar check-out
Carrito, checkout y registro5
#EcommerceEHU @bubalie
Carrito, checkout y registro5
#EcommerceEHU @bubalie
Carrito, checkout y registro5
#EcommerceEHU @bubalie
CHECK OUT:
– Aislar el check-outminimizar distracciones
– Estructurar el proceso un pocos pasos y mostrar pasos/ «single-page checkout process”
– Múltiples opciones de pago y transparencia con gastos de envío
– Certificaciones de seguridad en el pago
– Final del proceso: viralización positiva y estimular la repetición con incentivos
– Confirmación online y vía email de la compra
Carrito, checkout y registro5
#EcommerceEHU @bubalie
REGISTRO:
- No obligar al registro: inhibidor de compra / uso como «invitado».
- Pedir la información justa: maximizar auto-completar: registro con perfil social; en EEUU el 30% permiten el registro con Facebook Conect.
Carrito, checkout y registro5
#EcommerceEHU @bubalie
Carrito, checkout y registro5
#EcommerceEHU @bubalie
Elementos clave
Asistencia en compra6
#EcommerceEHU @bubalie
Una asistencia en la compra avanzado puede mejorar la conversión en hasta un 30%
Mucha influencia en el llenado de carritos, el pedido medio y las posibles devoluciones!
Asistencia en compra6
#EcommerceEHU @bubalie
– Buena navegación
– Buscador: resultados precisos, autocompletar, sugerencias.
– Acceso rápido a:
– mi cuenta
– mi carrito
– mi lista de deseos
– Ayuda:
– Atención al cliente en tiempo real: Chats, asistentes, call
center….
– Buscador de tiendas
– Servicio de personal shopper
Asistencia en compra6
#EcommerceEHU @bubalie
Asistencia en compra6
#EcommerceEHU @bubalie
Elementos clave
Trato exclusivo y personal7
#EcommerceEHU @bubalie
Premiar la fidelidad, un trato exclusivo y una experiencia social son claves para estimular la repetición y el valor del cliente en su ciclo
de vida con la marca
Modelo comercial que sepa fidelizar a sus clientes: no solo captación!
Trato exclusivo y personal7
#EcommerceEHU @bubalie
Trabajar el ciclo de vida de un cliente y desarrollar las capacidades de «engagement»:
- Premiar la fidelidad: bonos, descuentos, etc.
- Generar una sensación de exclusividad (trato VIP)
- Crear una experiencia social y efecto comunidad
“Area VIP” virtual que da acceso a servicios y ofertas exclusivas.
Trato exclusivo y personal7
#EcommerceEHU @bubalie
Trato exclusivo y personal7
#EcommerceEHU @bubalie
Trato exclusivo y personal7
#EcommerceEHU @bubalie
Trato exclusivo y personal7
#EcommerceEHU @bubalie
Trato exclusivo y personal7
#EcommerceEHU @bubalie
Trato exclusivo y personal7
#EcommerceEHU @bubalie
Elementos clave
Confianza y credibilidad8
#EcommerceEHU @bubalie
Transmitir confianza, credibilidad y seguridad:– Experiencia de usuario y diseño visual
– Información sobre la compañía
– Información de producto detallada
– Respeto de información de los usuarios
– Indicadores de credibilidad
– Transparencia en Precio y costes
Confianza y credibilidad8
#EcommerceEHU @bubalie
Tendencias 2016
#EcommerceEHU @bubalie
La continua innovación tecnológica genera nuevas disrupciones y nuevos
retos para las marcas
#EcommerceEHU @bubalie
Big data y análisis predictivoDesarrollo de unas capacidades analíticas avanzadas para conocer a nuestros
clientes, anticiparnos a sus necesidades, sorprenderles positivamente y generarles experiencias únicas.
#EcommerceEHU @bubalie
Big data y análisis predictivo
#EcommerceEHU @bubalie
Big data y análisis predictivo
#EcommerceEHU @bubalie
Experiencia personalizada multicanal (CRM,Customer relationship Management):
centralizar la información
#EcommerceEHU @bubalie
Entender las necesidades del usuario para ofrecer una UX perfecta,
personalización
#EcommerceEHU @bubalie
Entender las necesidades del usuario para ofrecer una UX perfecta,
personalización
#EcommerceEHU @bubalie
Mobile/Responsive design
#EcommerceEHU @bubalie
Material design y el diseño en « cards »
#EcommerceEHU @bubalie
Material design y el diseño en « cards »
#EcommerceEHU @bubalie
Branded content
#EcommerceEHU @bubalie
Story telling
#EcommerceEHU @bubalie
Pago con móvil y medios de pago alternativos
#EcommerceEHU @bubalie
Pago con móvil y medios de pago alternativos
#EcommerceEHU @bubalie
Social Selling
#EcommerceEHU @bubalie
Social Selling
#EcommerceEHU @bubalie
Realidad aumentada
IKEA 2016 Catalogue: Augmented Reality
https://www.youtube.com/watch?v=vDNzTasuYEw
#EcommerceEHU @bubalie
Beacon Technology
#EcommerceEHU @bubalie
Realidad virtualThe Topshop Virtual Reality Experience AW14
https://www.youtube.com/watch?v=lUal_Lrhec0
#EcommerceEHU @bubalie
Magic mirrors and virtual dressing
Ebay magic mirror
https://www.youtube.com/watch?v=6G3JIyG_GeY
#EcommerceEHU @bubalie
Virtual dressing
https://www.youtube.com/watch?v=HmYIjI4DxkE#t=23
Shopping - Probador virtual Cisco
#EcommerceEHU @bubalie
Tech Trends in Retail: Robots, Virtual Fitting Rooms / Virtual reality shopping -
Retail's Big Show 2016 in New York
http://ktla.com/2016/01/20/new-tech-trends-in-retail/
#EcommerceEHU @bubalie
¡Gracias!
Virginia AguirreConsultora y Formadora en Estrategia digital, UX y Usabilidad
- Twitter: @bubalie
- Mail: [email protected]
- Linkedin: http://es.linkedin.com/in/uxvirginiaaguirre
#EcommerceEHU @bubalie
Bibliografía
#EcommerceEHU @bubalie
- E-Commerce User Experience Nielsen Norman Group http://www.nngroup.com/reports/ecommerce-user-experience/ This series includes 13 reports on specific topics and presents 884 design guidelines based on our usability research.
- 20 of the Very Best E-Commerce Web Sites - Awwards http://www.awwwards.com/20-of-the-very-best-e-commerce-web-sites.html
- Ux Magazine: Shopping Cart Usability Why a simple, honest checkout sequence (usually) wins: http://uxmag.com/articles/shopping-cart-usability
- The Intro Guide to Ecommerce Website User Experience http://onlinebusiness.volusion.com/articles/intro-guide-ecommerce-user-experience/#sthash.dNVwANlf.dpuf
- 21 examples of user experience innovation in ecommerce https://econsultancy.com/blog/64491-21-examples-of-user-experience-innovation-in-ecommerce#i.c895x53kecokx4
- Creating the Best e-Commerce User Experience (UX) | Something Digital http://www.slideshare.net/somethingdigitl/creating-the-best-ecommerce-user-experience-ux-something-digital
Bibliografía
#EcommerceEHU @bubalie
- Creating the Best e-Commerce User Experience (UX) | Something Digital http://www.slideshare.net/somethingdigitl/creating-the-best-ecommerce-user-experience-ux-something-digital
- Ecommerce UX: 3 Design Trends to Follow and 3 to Avoid – NN/g http://www.nngroup.com/articles/e-commerce-usability/
- Increasing eCommerce Conversion Rates: Category Page http://uxmovement.com/navigation/increasing-ecommerce-conversion-rates-category-page/
- http://www.uxbooth.com/articles/10-ux-features-missing-on-top-e-commerce-sites/
- Ecommerce: 16 consejos para una homepage eficaz: http://www.samueldiosdado.com/09/ecommerce-16-recomendaciones-para-una-homepage-eficaz
- Consejos para optimizar la hompage de un Ecommerce: http://www.kleversoft.com/consejos-para-optimizar-la-hompage-de-un-ecommerce
Bibliografía
#EcommerceEHU @bubalie
- E-Commerce: la página de producto perfecta: http://www.brainsins.com/es/blog/ecommerce-pagina-producto/102089
- Consejos para la optimización de la página de producto de tu tienda online: http://www.kleversoft.com/consejos-para-la-optimizacion-de-la-pagina-de-producto-de-tu-tienda-online
- La página de producto perfecta: http://www.genteecommerce.com/la-pagina-de-producto-perfecta-2/
- 5 claves para darle a tus clientes una experiencia de compra ‘wow’: http://www.trevinocreativo.com/blog/5-claves-para-darle-a-tus-clientes-una-experiencia-de-compra-wow
- Qué es, y qué no es, una Experiencia de Compra Memorable: http://www.puromarketing.com/76/14695/experiencia-compra-memorable.html
Bibliografía
#EcommerceEHU @bubalie
- 105 Ecommerce UX Tips: How to Seduce Visitors to Buy: https://selfstartr.com/ecommerce-user-experience/
- eCommerce UX Design: http://ecommerceuxdesign.com/
- 10 pillars for a successful eCommerce user experience: http://www.ux-lady.com/10-pillars-of-a-successful-ecommerce-user-experience/
- 25 excellent UX examples from ecommerce sites: https://econsultancy.com/blog/66731-25-excellent-ux-examples-from-ecommerce-sites/
- 4 UX Design Best Practices for a Killer eCommerce Site; http://www.rightmixmarketing.com/website-design/ux-design-best-practices-for-ecommerce-site/
- 6 Retailers Revolutionizing The Online Shopping Experience: https://www.americanexpress.com/us/small-business/openforum/articles/online-shopping-revolutionary-retailers/
- u-Commerce, el usuario como base estratégica del negocio digital: http://elblogdeecommerce.com/2016/05/17/u-commerce-el-usuario-como-base-estrategica-del-negocio-digital/
Bibliografía
#EcommerceEHU @bubalie
Tendencias
- 11 eCommerce Design Trends to Watch in 2016: http://blog.lemonstand.com/2016-ecommerce-design-trends/
- 9 eCommerce design trends to embrace in 2016: http://www.webdesignerdepot.com/2016/01/9-ecommerce-design-trends-to-embrace-in-2016/
- 7 Ecommerce Trends to Watch in 2016: http://blog.usabilla.com/7-ecommerce-trends-to-watch-in-2016/
- Top Ecommerce Trends to Watch in 2016: http://www.euroitgroup.com/ecommerce-trends-2016/
- Big Data in e-Commerce: http://fr.slideshare.net/divanteltd/big-data-in-e-commerce
Bibliografía