Es para mí un placer traer a Edu Corral de nuevo a Blogger3cero. Un autor invitado que en su momento nos trajo contenidos tan divertidos como éste. Un diseñador web convencido y la persona a la que recurrimos cuando queremos aumentar la conversión de nuestras landings de venta.
Índice del artículo
- 1 Qué es lo que más ayuda a vender online
- 2 Landing Minimalista no significa Landing Cutre
- 3 Más allá del diseño web
- 4 Mi propuesta para la innovación de Landing Pages
- 5 Bocetos de personajes para la One Page
- 6 Elegir los colores de la Landing Page y personajes a juego
- 7 Montaje y revisión de la Landing Page
- 8 Conclusiones de una buena página de ventas
Os dejo con el artista (y además en sus ratos libres practicante nichero) Edu Corral.
[pastel-amarillo]DinoRANK se ha querido pasar por el calendario “autores invitados verano Blogger3cero 2020”
y nos ha dejado un cupón que puedes usar para probar la herramienta (a tope de funcionalidad) el primer mes por solo 5 euros. Para ello utiliza el cupón: veranodino (todo en minúsculas) durante el proceso de contratación.[/pastel-amarillo]
Hola de nuevo lectores de B30, es un placer estar otra vez por aquí y espero que lo que os voy a contar hoy, tenga al menos tan buena acogida como la última vez.
Aquí, en internet, estamos todos para ganar dinero, eso es así, además ganarlo rápido y en cantidad si es posible.
Aunque sé que la mayoría de los que leéis este blog os dedicáis al SEO y buena parte de ellos a los nichos, hay que admitir que la manera más rápida de ganar dinero es ofreciendo servicios, por lo que toca vender.
O convertir, como tanto nos gusta decirlo también, ya que convertir engloba muchas acciones, como tener más visitas, conseguir que se suscriban a nuestro email, enviarlos a Amazon, etc.
Pero eso sigue siendo vender, que además, desde hace unos años me parece una habilidad muy importante para los negocios y la vida en sí. Soy de los que piensan que, si sabes vender, siempre tendrás trabajo propio o como empleado.
Pues hoy vengo a contaros cómo vender más. Además, con una propuesta contraria a lo que se ha promulgado insaciablemente los últimos años.
Te cuento.
Qué es lo que más ayuda a vender online
Hay varios elementos que se han elevado en los últimos años como las únicas y más importantes herramientas de ventas en internet: Facebook Ads, Google Ads, copywriter, embudos de ventas…
Y a costa de elevar esas habilidades, el diseño web y el diseño gráfico se han ninguneado descarada y brutalmente en el marketing online, con la excusa de que “una web bonita no vende” afianzando la creencia con mensajes como “la gente cree que necesita una web bien hecha y bonita, pero no es cierto”, “la web es lo de menos, lo importante es el contenido”, “una web bonita no sirve de nada”…
En fin…
Mi opinión respecto al marketing es:
Todo sirve para vender más si se hace bien.
Incluso el diseño puede ser un aliado a la hora de conseguir conversiones si sabes cómo utilizarlo.
Landing Minimalista no significa Landing Cutre
A veces se tiene miedo a hacer un copy demasiado largo porque se cree que la gente cada vez lee menos, que van con más prisas y no se paran a leer.
Pues bien, la gente lee, pero si tiene una buena estructura. El diseño está ligado a la buena comunicación del texto.
He visto webs y Landing Pages poco cuidadas con la excusa de ser “webs minimalistas” rematadas con un copy tipo biblia que no apetecía terminar de leer.
Y si no terminan de leer, no te compran.
Más allá del diseño web
La tendencia actual hace que las webs sean más usables, están mejor diseñadas y la apariencia es limpia y llamativa. Además, se ayuda de gráficos e imágenes para transmitir mejor el mensaje, pero esa tendencia, aunque sigue de actualidad no es nueva, lo que se acaba convirtiendo en algo estándar, previsible y poco innovadora.
Los gráficos llamados “Memphis” cada vez se utilizan más y han supuesto un soplo de aire fresco en el diseño, tiene cierto aire retro.
A mí me recuerda a la intro de “Salvados por la campana” (si sabes de lo que hablo, ya tienes algunas canas, eh? 😂) y quedan muy bien, yo los utilizo mucho; pero ocurre lo mismo, el mercado se acabará saturando de este recurso, porque es de muy fácil acceso.
Por último, las ilustraciones también han cogido mucha fuerza en la planificación del diseño de webs y páginas de venta, pero cuando echas un vistazo al mercado ves que se están utilizando las ilustraciones que puedes encontrar en cualquier banco de imágenes y que cada vez son más aburridas.
Me refiero a esto:
Lo que propongo a mis clientes va más allá de imágenes prefabricadas que encontrarás en las webs de tu competencia…
Y recuerda que si el texto dice que eres diferente pero la imagen grita que eres otro más, no hay nada que hacer.
Mi propuesta para la innovación de Landing Pages
Este post bien se podría haber llamado “cómo vender gracias a un pulpo y un mono loco”.
Presta atención.
Landing Page de Omar de la Fuente
Cuando Omar de la Fuente quiso añadir avatares a su membresía, Titanes Warpress, estuvimos dándole vueltas a cómo trabajar la idea.
Después de varias propuestas nos enfocamos en que los personajes podrían ser animales antropomórficos, pero no a lo Disney, tiernos y cariñosos, sino algo menos edulcorado…
Eran titanes emprendedores, así que tenían que ser más cañeros.
Al lanzar la membresía decidió añadir un par de personajes a la Landing y os aseguro que el resultado sorprendió al mismo Omar.
Aquí tienes al pulpo y el mono loco. A sus suscriptores y alumnos les llamó muchísimo la atención y se lo hicieron saber.
Omar me escribió contando como le preguntaban por las ilustraciones y la Landing Page en general. Tuvo muy buen alcance y una buena conversión, porque tener una Landing tan cuidada hizo que los visitantes la leyesen entera.
Ahora sí, el copy hizo el resto.
Landing Page de DinoRank
La página de aterrizaje de esta herramienta SEO es otro ejemplo de Landing, que esta vez sí está totalmente diseñada por mí.
Respecto a las ilustraciones, el diseño de la idea original no es mío, pues ya contaban con este dinosaurio mecánico como mascota de la herramienta, que todos conocéis, pero sí tuve que rehacerlo en vectorial, por partes, para poder modificar las poses del mismo.
Aunque en principio tardé algo más en hacerla vectorial, acababa ganando tiempo al utilizarla para las otras secciones, pues tan solo tenía que modificar las poses y cambiar algún detalle y añadirle, por ejemplo, el cohete.
Como puedes ver, utilizo tramas, formas geométricas y degradados…
No me centraré en analizarla, pues más adelante verás el proceso de una Landing Page.
Landing Page de Retonicho
Con motivo del lanzamiento de un curso/reto totalmente gratuito que está preparado Dean para que aprendas a montar un nicho rentable, surgió la necesidad de hacer una One Page del mismo.
Este fue el croquis que me pasó Dean:
Con esta información pasé a crear en Photoshop un esquema de cómo quedaría la Landing Page, eligiendo los colores, tipografías y adornos de fondo que podría tener la página.
Bocetos de personajes para la One Page
Ya teniendo claros los colores que se utilizarán y aprobada la estética que tendrá la web, paso a crear los bocetos de los personajes. En principio serían dos, el chico y la chica, pero después se suma uno más en el que aparece Dean junto a los piratillas.
Niño pirata
En principio tendría un aspecto más contemporáneo, pero como puedes ver en la evolución, fue surgiendo la idea de que fuese un pirata.
También se agrandó la lupa con una intención cómica y exagerada, haciendo referencia a la búsqueda de nichos rentables.
Niña pirata
En esta ocasión ocurre igual, la chica iba a tener un aspecto “alternativo”, con botas grandes, sudadera larga, medias de redecilla, rastas… además de unas cadenas que simbolizarían el enlazado.
Aunque en la base es la que menos ha cambiado, modifiqué la ropa para que tuviese una estética más pirata.
El grupo
Por último, añadimos un diseño más en el que saldría Dean con los chicos, pero en esta ocasión la evolución fue al revés, es decir, primero lo dibujé como un capitán pirata, pero para que los chicos destacasen más, vestí al profe con ropa de calle.
Elegir los colores de la Landing Page y personajes a juego
Ya comenté que en el primer paso ya se habían elegido los colores de la web. Con esos mismos colores de referencia, pasé a colorear las ilustraciones.
En este paso, lo que hago es dar colores planos a toda la ilustración para crear una buena combinación de los mismos y cuando creo que funcionan, le paso las ilustraciones al cliente y si los aprueba, aplico las sombras y luces para crear el volumen y ponerlo bonito.
Si los piratas hubiesen estado en otro contexto, seguramente no habría usado estos colores tan llamativos y alegres, pero el motivo por el que los utilicé fue:
- Para que encajasen con la estética de la Landing y tuviese una composición armoniosa, como ya he dicho
- Porque quería que fuesen diseños alegres y desenfadados, no buscaba crear piratas de terror ni realistas ni oscuros. De esta manera elimino la connotación negativa que conlleva el término “pirata” en internet.
Montaje y revisión de la Landing Page
Una vez montadas las ilustraciones en la web y encuadrado el texto original, se pasó a hacer pequeños cambios que mejoraran la experiencia de usuario, tamaño de las tipografías, llamadas a la acción o recalibrar los colores para conseguir un buen contraste.
Esta página está hecha con el tema Divi. Antes de que me preguntéis por qué este y no otro, diré que Gutemberg, aunque me gusta y estoy dándole una oportunidad en ciertas webs, se me queda pequeño y no consigo hacer todo lo que quiero.
Por otro lado, existe la eterna guerra de Divi VS Elementor. Me siento más cómodo con Divi y a estas alturas lo manejo a las mil maravillas, no hay más.
Conclusiones de una buena página de ventas
Todas las áreas del Marketing son piezas importantes para conseguir los resultados más óptimos posibles y, en cuanto a página de ventas se refiere, una buena retención del usuario puede ayudar a que no pase por alto nuestro servicio o producto, dando como resultado una mejor conversión.
Para ello el diseño integro de la Landing es un factor a tener en cuenta.
Por último, déjame decirte que, si no tienes tiempo de crear tu propia Landing Page, te pases por maximaconversion.com y hablamos 😉
¿Qué te parece como ha quedado la Landing Page? ¿Tienes en cuenta el diseño en tu estrategia de marketing? Te leo en los comentarios.
Excelente post, y como dibuja el tio este!
Me ha faltado un poco explicación del Copy para hacer que el cliente accione en la compra
Hola Jose!
Muchas gracias! me alegra que te haya gustado.
Verás, esa parte es cosa del copy no del diseñador, por lo que solo hablo de la parte gráfica y de cómo esta puede ayudar a que se lea el copy y resalte.
Excelente Post, inspirador, gracias
Hola Edu
Trabajas muy bonito, yo he visto esas distintas landings y ya se me hacía conocido el estilo
Llevan tu firma 🤗
Un detalle extrané de la caricatura de Dean, y es que no sale con la cresta XDDD
Respecto a que el diseño ayuda a las conversiones:
¿Tienes alguna data que muestre el antes y después en el tráfico y conversiones de alguna de las webs en las que has trabajado?
Ah! Y ¿Serás profesor en SEOWarriors?
Saludos desde Caracas ☺️
Hola Luis!
Gracias por tus cumplidos 😊
Jajaja es cierto lo de la cresta, pero no creo que ya no la lleva o las veces que le he visto no la tenía.
No tengo gráficas que muestren el antes y el después porque simplemente no se ha hecho, ni si quiera caí en ello. Sé que funciona porque las que he hecho ha sido a clientes con los que ya tenía confianza y ellos mismos me han comentado que la cosa ha mejorado… y de ahí ha nacido este servicio… no ha sido algo al azar, vimos que funcionaba y fui mejorándolo. (Aunque me lo apunto, porque es muy buena idea)
Esto con respecto a mis Landings, con respecto al diseño en general sí que está comprobado, de hecho, en SeoWarriors, ya que lo comentas, Mijaél tiene un curso en el que muestra cómo mejorar la conversión y buena parte de las mejoras, son a nivel de diseño. Y Dani Llamazares está creando uno de diseño y maquetación enfocado a nichos.
Por último, no, no seré profesor en SW, de momento no se me ocurre qué podría aportar a la membresía, pues está muy enfocada al SEO y este tipo de diseños están orientados a otro tipo de conversiones, no a una página nicho, por ejemplo.
Pero oye, ¡a ver qué pasa! 😉
Te envío un abrazo a Caracas, Luis!!
Bueno
Respecto a SEOWarriors, creo que podrías aportar mucho respecto a la creación de landings desde el punto de vista del diseño
O quizás "Landings con Divi"
Estoy seguro que algo se le ocurrirá a Dean.
Y si le metes analítica del antes y el después del extreme makeover seguro que sale algo muy interesante
Saludos ☺️
Tengo una duda. ¿No se supone que una Landing Page debe ser muy especifica y enfocarse sin rodeos al producto que quiere vender? Comprendo que el diseño es un punto de partida, pero igual se debería considerar que la mayoría de las personas entran por celulares y no por computadoras o tablets no ? Siento yo que el contexto esta un poco mal enfocado, pero igual y me confundo mucho.
Hola Joaquín.
La Landing como tu dices, debe ir enfocada al producto, y las ilustraciones pretenden eso… tienen que ir en concordancia con lo que vendes y llamar la atención para retener al usuario, incluso explico en el post, que el que se tiene que llevar el gato al agua, es el copy, ya que es el que explica el producto.
Me explico.
Tienes una langin page con las mismas imágenes que ves en la competencia, con los colores mal elegidos, con el texto en el centro y hablando solo de tu producto…
Luego tienes otra, con el mismo producto, todo bien maquetado, buenos colores y elementos que le generen curiosidad…
¿Cuál apetece leer más?
Te pongo otro ejemplo.
Se dice que la cabecera de una web, tiene que ser pequeña, para que el posible cliente vea rápido lo que le tienes que ofrecer…
Cada empresa tiene su estrategia, está claro, pero entra en Cocacola, entra en Nike, con pc o con móvil, lo que quieras.
Llama la atención y cuando te miren, véndeles.
si no consigues que al posible cliente le llame la atención y decida leerla, no te sirve para nada.
No sé si me he explicado bien eh, pero si no es así, pregunta lo que quieras.
Hola Edu, felicidades por el post!! Muy completo!! La próxima avisa, que le demos difusión 🔝🔝🔝
Hola Toñi!!
Me alegra verte por aquí!!
jajajaja vale, es que ha sido un poco inesperado… luego te escribo 😉
Excelente artículo sobre el proceso gráfico de una landing. Muy instructivo e inspirador. Gracias.
Hola Carlos,
Muchas gracias por tus palabras, espero que te sirva para tus proyectos.
Gracias a ti, saludos!
Muy buenas ilustraciones! Siempre me ha llamado la atención el dinosaurio de Dinorank, como diseñador me fijo en esas cosas. Pues bien ahora sé quien hay detrás. Yo también creo que un diseño puede ayudar mucho a vender, por ejemplo yo cuando dudo entre dos ofertas de valor similar siempre tiendo a elegir inconscientemente la que tiene mejor diseño, me genera más confianza y autoridad. Enhorabuena por tu trabajo.
Hola Jaume!
Me alegra que te hayan gustado mis ilustraciones… aunque tengo que decirte, que el creador del dinosaurio de DinoRank, no fui yo, solo lo volví a hacer porque necesitaba una versión vectorial con la que pudiese modificar las poses.
Sí que hice un rediseño más tipo cómic (porque también me flipa el diseño del dino mecánico), para una caricatura de Dean, pero el original no es mío.
Tienes razón Jaume, el diseño juega un papel más subconsciente que consciente y cuesta explicar un poco sus beneficios.
Muchas gracias por comentar, espero ver cositas tuyas! Saludos!
Si lo sé que el DinoRank no es originalmente tuyo, pero me refiero a este estilo de landing pages. Repasando tu trabajo me sonaban muchas ilustraciones (como las de Omar) porque francamente llaman mucho la atención.
Me parece muy interesante como has sabido crear tu propio nicho con la ilustración de landing pages con un estilo muy personal. Mis dieses.
Y sí es difícil comunicar la importancia del diseño pero creo que lo haces muy bien en tu web. Mis dieses again.
Yo casi que me considero un exdiseñador puesto que estoy explorando otras posibilidades (quizá productividad para creativos), pero sé reconocer el trabajo de calidad. 😉
Un saludo y sigue así con tu trabajo!
Muchas gracias Jaume!
Un gustazo que pienses así y estemos de acuerdo en estas cosas!
Un saludo!
Podrías poner algún ejemplo de alguna landing que te gusta que sea para CPA temática dating?
Gracias
Hola Lopez,
No tengo ningún ejemplo de webs para CPA con temática dating, lo siento.
Aunque llevo tiempo diseñando, este servicio de Landins es bastante nuevo y tengo pocos ejemplos aun.
Un saludo
Edu,
Gusto saludarte, me parece excelente tu trabajo, felicitaciones. Las combinaciones, para mí en las ilustruciones de Juan Palomero y Gamificador, el dinosaurio y el cohete, los colores, son extraordinarias
Hola Ada,
Un placer saludarte también.
Gracias por tus palabras, me alegra que te haya gustado mi trabajo.
Un abrazo!
¿Crees que puede haber canibalización de palabras clave al intentar hacer una landing page demasiado competitiva?