Volver a Proyectos Listado de Proyectos

GameLearn

Migración, diseño nuevo e integración con Salesforce

Fecha de lanzamiento: septiembre 15, 2021

En 2021 nos metimos en un proyecto que se parecía más a una montaña rusa que a un trabajo. ¡Pero valió la pena! Al final logramos crear una web nueva y mejorada, a partir de una que estaba llena de problemas. ¡Y todavía estamos dándole mejoras! ¿Quién dice que el trabajo no puede ser divertido?

Solucionar problemas graves de rendimiento en WordPress

Antes de comenzar con el nuevo desarrollo tuvimos primero que estabilizar la web actual de GameLearn que tenía como constructor visual «WPBakery Visual Composer», para el multiidioma «Polylang», y «52 plugin» instalados.

Solucionamos varios problemas graves y uno de ellos era el consumo de los plugin. En estas imágenes podemos ver la importancia de elegir el plugin más adecuado para WordPress.

Diferencias de tiempo de carga entre plugin equivalentes.
Diferencias de tiempo de carga entre plugin equivalentes.
Sumario timeline entre los dos plugin
Sumario timeline entre los dos plugin

Reemplazamos algunos plugins por otros que brindaban las mismas funcionalidades, pero con un menor consumo de recursos del servidor, y desinstalamos aquellos que no eran esenciales.

De esta manera logramos eliminar las micro caídas y estabilizamos el servidor, especialmente en el lado de administración. Esto permitió a los equipos de marketing y contenidos poder trabajar sin interrupciones, mejorando su eficacia.

Migración de contenido

Uno de los requisitos que tenía el desarrollo de la nueva web era eliminar cualquier rastro de la web ya existente, debido a que daba muchos problemas por la multitud de plugin. Solo funcionaba en la versión de PHP 5.6.40 por un theme comercial absoleto y descontinuado.

Lo único que teníamos que intentar recuperar eran los artículos del blog que estaba realizado con el editor visual «WPBakery Visual Composer» y utilizaban para el multiidioma el plugin «Polylang», el cual tuvimos que migrar al plugin «WPML» que es el que se utilizaría en la nueva web.

Para ello estuvimos haciendo pruebas en un entorno local hasta que conseguimos parar todo el contenido de los artículos en ese instante.

Integración con Salesforce / Pardot

Otros de los requisitos era dar estilo a los formularios de Salesforce según su equipo de diseño y UX/UI. Esta tarea era bastante relevante debido a que era la entrada de Lead.

Estuvimos barajando la posibilidad de integrarlo mediante iframe o Form Handlers, pero debido a nuestra experiencia con casos anteriores, nos decantamos por iframe. Así evitaríamos spam y daríamos mayor flexibilidad al equipo de Marketing a la hora de crear formularios.

Integrar WordPress con Salesforce y dar estilo según diseño
Integrar WordPress con Salesforce y dar estilo según diseño

Dando forma al proyecto

Una vez estabilizada la web actual y migrado el contenido a un WordPress limpio, nos pusimos a trabajar con el equipo de Marketing, diseño y UX/UI de Gamelearn para conseguir una web bonita, usable, rápida y sobre todo fácil de manejar por el equipo de marketing, ya que sería su herramienta de trabajo.

Después de varias reuniones para definir requisitos nos pusimos manos a la obra. Utilizamos bastantes vídeos en modo local que podían afectar al rendimiento de la página, pero al final lo solucionamos de la mejor forma posible.

Unificamos los Artículos del blog, Casos de éxito e Informes y Whitepapers, con filtros y rutas personalizas. Una de las funcionalidades más complejas fue el comparador de los planes puesto que queríamos que resultase lo más sencillo posible de gestionar.

Desarrollamos diferentes slider específicos para el proyecto siguiendo las indicaciones de su equipo de diseño UX/UI, multiidioma y 100% gestionado a través de WordPress.

Slider vídeo explicativo

Creación de plantillas para email y landings Salesforce/Pardot

El equipo de marketing nos comunicó que necesitaba unas plantillas para crear landing y emails en Salesforce. Nos facilitaron el diseño y desarrollamos plantillas a las que se le podían duplicar bloques, eliminar, mover hacia arriba y abajo, etc.

Podéis ver aquí algunos vídeos de la funcionalidad que desarrollamos.

Cambiando bloque de posición
Duplicando, eliminando y moviendo bloques

Página de Planes

Otro apartado delicado era la sección de Planes. Las páginas de precios siempre suele ser el mayor reto, sobre todo cuando uno de nuestros lemas es facilitar la inserción de contenido al equipo de contenidos para que no sea un dolor de cabeza.

Al ser 100% editable suele ser bastante complicado dependiendo de la complejidad del diseño y funcionalidades. En este caso teníamos dos, uno para empleados y otro para clientes, con sus respectivos comparadores.

Tabla de diferentes planes en WordPress
Tabla de diferentes planes
Comparador de los diferentes plantes en WordPress
Comparador de los diferentes plantes

Filtrado de la zona de recursos y búsqueda

Y como no, la sección de recursos, donde se puede filtrar por tipología, incorporamos un buscador, implementamos un botón de «cargar más» contenido en lugar de típica paginación, y muchas opciones más.

… Y para finalizar

Seguimos dando apoyo al equipo de marketing con otras pequeñas web corporativas, y creando documentación de los procesos para que sean los más «autosuficientes» posibles. Continuamos desarrollando nuevas funcionalidades a la web, y optimizando lo ya existente para que vaya lo más rápido posible.