Series
Work
• 
Making
Client
Mellow
Read time
00h10m

Optimización de la navegación móvil de Mellow mediante el análisis de los enfoques de los gigantes del comercio electrónico

In brief

En lugar de adaptar la navegación de escritorio para móviles, este estudio analiza cómo marcas como Nike, Lululemon y Puma abordan la navegación móvil bajo sus propias reglas: velocidad sobre profundidad, tacto sobre precisión, espacio vertical sobre horizontal. El patrón que surge en las seis referencias es consistente: un estado predeterminado minimalista que solo muestra el logotipo, la llamada a la acción (CTA), el carrito y el icono de menú, dejando todo lo demás dentro de un panel desplegable. A partir de ese punto de referencia, se desarrollaron dos propuestas para Mellow: un panel de pantalla completa y una variante de panel al 70%. Ambas son opciones justificables; la diferencia es de sensación más que de función. La ubicación del icono de menú sigue la convención de la derecha observada en la mayoría de las referencias, alineándose con la base de usuarios mayoritariamente diestros.

Pasemos a los móviles. ¿Diseño primero para escritorio o para móvil? Ninguno de los dos.

El diseño de barras de navegación para sitios de comercio electrónico presenta desafíos únicos tanto en escritorio como en móvil. Un debate común gira en torno a si priorizar un enfoque de interfaz para móvil o para escritorio. Sin embargo, reconocer las diferencias fundamentales entre las experiencias móviles y de escritorio sugiere que cada plataforma debe tratarse con una estrategia de diseño claramente diferenciada.

La navegación móvil prioriza la velocidad, basándose en la respuesta táctil (sacrificando la precisión) dentro de un espacio vertical reducido. Por el contrario, los entornos de escritorio favorecen la navegación profunda, ofrecen la precisión del ratón y aprovechan un amplio espacio horizontal.

¿Qué están haciendo los gigantes globales del DTC?

Aquí tienes una comparativa rápida sobre cómo un grupo de gigantes globales del deporte aborda su navegación móvil.

Under Armour

Lululemon

Nike

Puma

New Balance

Asics

Tesis: estas marcas no se limitan a reducir sus sitios de escritorio para móviles; están cambiando fundamentalmente el modelo de interacción y la arquitectura de la información según el dispositivo.

Conclusiones: la navegación móvil puede mostrar por defecto solo el logotipo de la marca (que enlaza a la página de inicio), un botón de llamada a la acción, el icono de la bolsa o carrito y el icono de menú que abre un panel con más enlaces. El icono de menú puede colocarse a la derecha o a la izquierda, aunque el lado derecho aparece con mayor frecuencia en los casos estudiados. Esto último también tiene sentido, dado que la mayoría de la población es diestra. El panel puede ocupar toda la pantalla o aproximadamente el 70 por ciento: cualquiera de las dos opciones es segura.

El resultado final

Barra de navegación móvil, por defecto:

Panel de navegación móvil, pantalla completa:

Panel de navegación móvil, pantalla parcial:

Una comparativa:

More on our work

Browse all