Lúpulo
Hopstack es una plataforma SaaS para la gestión de almacenes con el fin de agilizar y digitalizar sus operaciones de almacén.
Hopstack ayuda a las empresas a hacerse cargo de sus almacenes, eliminar los cuellos de botella y aumentar la eficiencia de la gestión logística, todo ello sin aumentar los costos.
Con una precisión de pedidos del 99,8% sin ropa, han enviado más de 6 millones de pedidos hasta la fecha.
Semilla de financiación
Aumento del tráfico orgánico
Puntuación de autoridad de dominio. Se aumentó el rango en 327.4K
Desafío
Cuando Hopstack contactó a Webyansh, tenían un claro punto débil. Su detallada biblioteca de recursos les proporcionaba un gran tráfico orgánico, pero no podían captar visitantes debido a un diseño obsoleto de hace 5 años y a una experiencia de usuario extremadamente frustrante.
Algunos de los desafíos enfrentados fueron:
Tiempos de carga de página lentos y código voluminoso que causó alta tasa de rebote; Core Web Vitals deficiente.
Contenido no estructurado; falta marcado semántico lo que provocó un alcance limitado de las palabras clave; una autoridad temática débil
No hay un proceso escalable para el blog o los recursos lo que llevó a tráfico orgánico estancado; pocos puntos de entrada
Errores técnicos (enlaces rotos, falta de metaetiquetas), lo que provocó un desperdicio del presupuesto de rastreo; volatilidad en la clasificación
Por lo tanto, nuestro objetivo era mejorar la experiencia del usuario en el sitio con:
Un diseño moderno y minimalista, sin animaciones ni efectos sofisticados
Desarrollo limpio de Webflow por velocidad de carga más rápida y rendimiento
Revisión técnica de SEO
Core Web Vitals mejorados: CLS < 0.3, LCP < 2.5 s, FID < 100 ms
Sin embargo, al mismo tiempo, teníamos que asegurarnos de que Las clasificaciones de SEO no bajaron, lo que implicaba una transferencia fluida de todos los elementos o recursos de la CMS.
El equipo de Hopstack nos confió este delicado trabajo debido a nuestra experiencia previa en el ámbito de la logística y el SaaS B2B, reflejada con precisión en nuestro estudio de caso de desarrollo de Shopbox.
Solución
Hopstack nos proporcionó una guía de marca detallada e incorporamos las pautas, como la paleta de colores y la tipografía, en el nuevo diseño.
Nuestro objetivo principal era priorizar el rendimiento del sitio web manteniendo el diseño minimalista y mantenerse alejado de las animaciones o interacciones pesadas.
También fuimos un paso por delante del CMS Webflow nativo para añadir algunos filtrado avanzado opciones con código personalizado.
He aquí una breve descripción de la transformación que logramos para Hopstack en cada aspecto:
Diseño anticuado, ya que el sitio web se creó hace más de 5 años.- No se pensó en resaltar visualmente la oferta principal de Hopstack.
Un diseño minimalista y moderno, líder en la industria. - Fragmentos de interfaz de usuario especiales combinados con imágenes de almacén para resaltar la oferta principal y la experiencia con las herramientas
Mala velocidad de carga y experiencia de usuario debido a una estructuración y un CMS defectuosos.
Desarrollo limpio y CMS Webflow nativo mejorados con código personalizado para una velocidad increíble y una excelente experiencia de usuario.
Arquitectura deficiente y diseño sofocante. - Bloques y secciones con nombres horribles en el backend que generaban confusión.
Arquitectura simple, efectos mínimos y diseño espacioso para mantener a los usuarios enganchados.- Nomenclatura lógica de bloques impulsada por el sistema «Finsweet Client-First»
Estructura de CMS desordenada: confusa y complicada de manejar. Además, afecta al rendimiento del sitio web.
Estructura de CMS superlimpia y fácil de usar mejorada con código personalizado para un filtrado avanzado y un rendimiento superior.
Excelentes clasificaciones de SEO, pero sin conversión de tráfico debido a una mala experiencia de usuario.
Experiencia de usuario completamente renovada y optimizada para la conversión sin comprometer las clasificaciones de SEO.
Pequeños detalles, gran impacto
Tras estudiar en detalle el negocio de Hopstack, estábamos seguros de que necesitábamos una representación visual especial que destacara ambos aspectos del negocio:
1. Su relación con el almacenamiento físico
2. El software como producto principal
Por lo tanto, profundizamos en la interfaz de usuario del software y la estudiamos de adentro hacia afuera con la ayuda del equipo de Hopstack para crear fragmentos personalizados con representaciones abstractas de los elementos de la interfaz de usuario.
Luego los combinamos con imágenes de almacenes físicos y procesos relacionados.
Esta combinación nos dio dos ventajas:
1. Todos los visitantes podían comprender de inmediato la oferta principal de Hopstack, ya que podían asociar rápidamente el software con el almacenamiento y la logística.
2. Los competidores no podían analizar las funciones principales del software, ya que solo utilizábamos conceptos abstractos de la interfaz de usuario en lugar de capturas de pantalla reales.
Con elementos de diseño tan bien pensados, pudimos crear un diseño minimalista y moderno que no solo comunicó el negocio principal a los visitantes, sino que también creó una identidad única para Hopstack que hasta ahora no tiene rival en la industria.
Una revisión completa del CMS
La biblioteca de recursos de Hopstack era literalmente enorme.
Esta es una lista de las categorías de recursos:
130 blogs
Guías
1 Informe
10 libros electrónicos
129 Glosarios
20 Boletines
6 Casos prácticos
260 directorios 3PL
Directorios de cumplimiento
Por lo tanto, no solo tuvimos que migrar todos estos elementos sin problemas al nuevo sitio web, sino también mejorar la mala estructuración para que el sistema de administración de contenido fuera más fácil de usar.
Así es como recreamos todo el CMS para Hopstack:
Exportó todos los datos del antiguo CMS
Se limpiaron todos los campos del antiguo CMS
Se han recreado nuevos campos de CMS
Se importaron todos los datos
Redefinimos todas las categorías y filtros
Redefinió el CMS y creó la sección de recursos
Con el nuevo y robusto CMS, el sitio web de Hopstack es altamente escalable y está listo para evolucionar con las cambiantes necesidades empresariales.
Priorizamos las experiencias de usuario fluidas en todos los dispositivos mediante la implementación de principios de diseño responsivo. Al garantizar que el sitio web se adapte con fluidez a los distintos tamaños y orientaciones de pantalla, incluidos los dispositivos móviles, las tabletas y las computadoras de escritorio, garantizamos la accesibilidad y la usabilidad para todos los usuarios.
Métricas clave de SEO
Crecimiento orgánico del tráfico
- Visitas: Aumentado a 23,2 K/mes (▲ 31% mensual)
- Tráfico de búsqueda orgánica: 19,7 K/mes (+ 8,5% respecto al mes anterior)
- Visitantes únicos: 11,3 KM
Palabras clave y clasificaciones
- Palabras clave de clasificación total: Pasó de ~0 a 11,9 KM
- Palabras clave orgánicas en el Top 3: 630 (India), 5,3 KM (NOSOTROS)
- Mezcla de intenciones de palabras clave:
- 71,3% Informativo (lo que genera 4,1 mil visitas)
- 20,1% comercial; 3,3% transaccional
Mejoras en la participación
- Páginas//Visita: 2,66 (▲ 104%)
- Promedio. Duración de la visita: 08:,31 (▲ 97%)
- Tasa de rebote: 63,5% (▼ 27%)
Autoridad y backlinks
- Puntuación de autoridad de dominio: 37
- Dominios de referencia: 845 (3,4 mil backlinks)
- Cuota de tráfico (por país): India 26%, EE.UU. 25%, Francia 6%
Posicionamiento competitivo
Nuestro trabajo llevó a Hopstack a una posición de liderazgo frente a sus pares al:
- Capturando más de 4,3 000 palabras clave donde los competidores tienen un promedio de 2 a 3 K
- Aprovechamiento ricas funciones de SERP (fragmentos destacados, paneles de información) sobre consultas de alto valor
- Garantizar la autoridad del pilar sobre «temas clave» (por ejemplo, «compañías navieras que realizan envíos», «3PL»)
«Tuve el placer de trabajar con Divyansh en el proyecto de renovación de nuestro sitio web en Hopstack, y puedo decir con confianza que es excepcional en lo que hace. Su pensamiento de diseño es de primera categoría, lo que nos permite lograr un sitio web limpio, moderno y altamente funcional. »
Siguiente caso práctico
Soluciones Aureon
Vamos a crear algo fuera de este mundo juntos.
¿Tienes un proyecto en mente? Póngase en contacto con nosotros para obtener soluciones expertas de diseño y desarrollo. Analicemos cómo podemos ayudarle a hacer crecer su negocio.
Hola, soy Divyansh - Fundador de Webyansh. Programa una llamada conmigo para hablar en detalle sobre su proyecto y cómo podemos ayudar a su empresa. También puedes solicite un presupuesto personalizado gratuito si el alcance del trabajo es claro.