En el backstage del rediseño de nuestro sitio

Hola Family Beaver Builder! Nos complace anunciar oficialmente el lanzamiento de nuestro nuevo sitio web. Me gustaría guiarte en un viaje detrás del escenario de nuestro proceso, para darte una perspectiva de por qué hice las cosas como lo hicimos nosotros y tal vez puedas obtener algunos consejos útiles en el camino. ¡Vamos a bucear directamente! Nueva guía de estilo de marca Cuando Brent y yo nos sentamos para discutir este proyecto, sabíamos que nos gustaría comenzar con una nueva guía de estilo de marca, para que podamos implementar esta nueva marca en todos nuestros activos. Queríamos algo que fuera definitivamente único, lo que cuando alguien lo vio … inmediatamente reconoció que él era Beaver Builder.
¡Número 1, el nuevo estilo tuvo que evocar diversión! Estamos tratando de mantener las cosas fáciles aquí … Quiero decir, la mascota de nuestra empresa es un castor. Nuestro antiguo sitio tenía un tono más oscuro y no tenía la energía que estábamos buscando. (Capturas de pantalla en el sitio anterior)

Quería que los colores y la fuente estuvieran limpios, brillantes y juguetones. Finalmente, queríamos una esencia del aire libre sin sentirnos como un campamento. Así que decidimos usar colores para ayudar a la apariencia de eso (marrón, verde, azul, naranja, rojo, gris) para ayudar a traer algunos colores del bosque, cielo azul, lagos, fogatas, sol, piedras, rutas de senderismo, etc. .
(Captura de pantalla de la guía de estilo de marca)

Aquí está el párrafo que lo explica con más elocuencia de nuestra guía de estilo de marca:
“El arte de Beaver Builder 2020 tiene como objetivo crear un ambiente fresco y divertido que inspire una sensación de creatividad y descubrimiento. El arte está destinado a evocar sutilmente pensamientos sobre mapas, viajeros errantes, acampar y salvajes. El proceso creativo es de exploración lúdica y intersecciones inesperadas entre ideas, y el arte sugiere en todo el conjunto. Vea una agencia de diseño con nuestra nueva guía de estilo de marca, estábamos listos para encontrar un diseñador para ayudarnos a implementar nuestra visión.

Queríamos externalizar una agencia de diseño para ayudarnos con este proyecto, porque Brent estaba relacionado con los proyectos de Asistente y Beaver Builder. Me puse en contacto con 3 compañías de diseño diferentes para probarlas y ofrecí a cada uno un proyecto de prueba simple para ver cuál de ellas saldrá primero. La tarea era utilizar nuestra nueva guía de estilo de marca para crear algunos elementos gráficos para anuncios gráficos. Aunque todos tenían exactamente las mismas instrucciones y recursos, todos se les ocurrió interpretaciones muy diferentes de la misma información. ¡Tuve un claro ganador! Spark27 Creative, de Katie Elenberger.
(Ver debajo de las capturas de pantalla de sus conceptos de diseño originales)
Nos reunimos con Katie, para una reunión inicial para consultar el sitio web e inmediatamente reconocimos la gran química del equipo entre todos nosotros. Ella claramente entendió la atmósfera que seguimos y, por lo tanto, sabía que era apropiado. Nueva marca probada con nuestro nuevo equipo de diseño seleccionado, fuimos a la carrera para probarla en la naturaleza. Tuvimos a Katie y el equipo para ayudarnos a crear lo siguiente:

Pancartas de perfil para redes sociales
Miniaturas de YouTubeBanner Canal para Beaver Builder Lite
Base de antecedentes de conocimiento e íconos del sitio
Sitio web del Foro Comunitario
Gráficos publicitarios de Facebook
Anuncios de gráficos gráficos para Google
Publicación de blog Imágenes recomendadas
He implementado estas cosas a lo largo de 2020 y, en general, fueron bien recibidos y bien convertidos. Eso nos dio una ola verde para seguir adelante. La evaluación del sitio hicimos un análisis amplio de nuestro sitio web anterior para ver qué estaba funcionando e identificar las áreas que tuvieron que mejorarse. Estas son algunas de las cosas que se han completado durante la evaluación:
realizó una prueba de mapa térmico

Tasas de conversión analizadas en la página
Lea los comentarios de la comunidad de Beaver Builder
sugerencias reunidas de colegas de WordPress
Vales de asistencia revisados
Una cosa importante que se destacó fue que navegar por el sitio tenía que ser ajustado, en particular, ¿dónde colocar a Beaver Themer?
Beaver Themer era un nuevo producto adicional que se produjo después de Beaver Builder unos años más tarde. Por lo tanto, no tenía un lugar adecuado para esta información y, en cambio, tenía como barra publicitaria en la parte superior del sitio. (Captura de pantalla con antiguas barras de anuncios del sitio)
Los comentarios de los usuarios eran que tenían dificultades para encontrar información sobre Beaver Themer y no sabían cómo agregar el producto al carrito de compras en la página de precios. También presenté un nuevo producto llamado “Asistente” en 2019 y no tenía un área adecuada para ello.
Como resultado, necesitábamos una nueva estructura del sitio que pudiera ser flexible si quisiéramos agregar más productos en el futuro.


Ajustamos nuestro mapa del sitio para agregar “productos” a nuestra navegación y movimos algunas páginas inferiores de conversión al sótano. También sentí que el sitio necesita una página de producto dedicada “Builder” que nos permita mover parte del contenido que existiera en la página inicial en nuestra propia página de destino. (Captura de pantalla del sitio recientemente propuesto) La otra cosa que se destacó fue lo difícil de copiar nuestro sitio antiguo. Queríamos limpiar la copia, pero no alejarnos de lo que teníamos, porque el contenido estaba bien convertido. (Captura de pantalla del área de copia pesada en el sitio anterior)

También transmitimos algunos anuncios de Facebook para probar títulos y expresiones como “enfocarnos en crear, no codificar”, que finalmente llegaron al nuevo sitio.
Con nuestro nuevo mapa del sitio web y una copia de contenido completa, estábamos listos para pasar al proceso de diseño. Fase 1 del nuevo diseño El rediseño de un sitio web de la compañía era una empresa masiva, porque nuestro sitio tiene alrededor de 65 páginas en total, sin incluir la aparición de publicaciones de blog, la aparición del archivo, etc. Decidimos dividir el proyecto en 2 fases por algunas razones.

Ayudaría a acelerar el proceso de diseño, construcción y lanzamiento del sitio.

Tendríamos menos páginas para analizar y optimizar después del lanzamiento.

Obtenga comentarios de la comunidad y los usuarios para implementar cambios en la fase 1.
Finalmente, podemos tomar todas las lecciones aprendidas y podemos aplicarlas en la Fase 2.
Para la Fase 1, decidimos restringirlo para diseñar algunas páginas clave “Frente”.
El hogar
Creador de páginas
Tema Beaver Builder
Beaver Themer
Precios
Todas las demás páginas, como contacto, soporte, blog, etc.Esperaría hasta la Fase 2. Aunque sabemos que esta no es una práctica convencional, porque la mayoría de las empresas cambian todo el sitio de una sola reunión … Sentí que esto funcionaría mejor para nosotros.En general, esta parte del proyecto fue muy bien, porque ya hemos trabajado en pasos anteriores para verificar cualquier cambio importante.Organizamos reuniones semanales de proyectos para hablar sobre cosas y en unas pocas semanas, tuvimos nuevos conceptos de diseño de Katie.
(Captura de pantalla del concepto original)