Hace unos días mi buen amigo Francisco Aguilera me planteó un desafío muy interesante. Él llevaba un tiempo trabajando con la herramienta Webflow, que permite construir de forma visual el front-end de un sitio web (HTML, CSS, JS) sin necesidad de escribir código. Además, el código que esta herramienta genera parece ser limpio y no dejar «restos» como otros constructores que sí lo hacían.
El desafío consiste en poner a prueba la eficacia de Webflow y para ello tanto Francisco como yo, partiremos de un mismo diseño en Sketch, realizado por Gabriel Hidalgo y lo transformaremos en código HTML y CSS. Yo lo haré escribiendo código directamente y Francisco utilizando Webflow. Por último, para hacer que el reto sea más interesante, nos hemos puesto un límite de 30 minutos. Y no acaba aquí la cosa, lo haremos mientras saltamos aros de fuego… vale eso no pasará, pero sería digno de verlo.
Resumiendo: un mismo diseño, código versus Webflow. ¡Preparados, listos, fight! ¿Cuánto podremos avanzar?
Ahora, no te pierdas la segunda parte donde Francisco hará uso de Webflow:
Encuentra más información en el detalle de su artículo y de paso mándale un saludo para que cree más vídeos/tutoriales ineresantes de Webflow 🙂
Agradecimientos:
- Francisco Aguilera: por mantener siempre una actitud de compartir y crecer juntos, en lugar de competir como hace la mayoría.
- Gabriel Hildalgo: por prestarnos su impresionante diseño.
- Helia Witker, madre de Gabriel: por aceptar que pudiéramos utilizarlo.
Obtén el código:
Te recomiendo que te descargues ambos códigos para que puedas compararlos y sacar tus propias conclusiones.
- Mi código
- Código exportado de Webflow, realizado por Francisco
Y nada más por hoy, espero que hayas disfrutado y aprendido mucho con este desafío. Si no conocías Webflow, tal vez se te haya abierto todo un mundo (yo no lo conocía hasta que Francisco me propuso el reto) y recuerda que ninguna de las dos formas es mejor que otra, lo ideal es dominar las dos y decidir para cada proyecto cuál te conviene más.
Un abrazo y Happy Coding!
David
¡Muchas gracias, David! El desafío es muy guay, ¡enhorabuena!
¡Muchas gracias Manu! Un abrazo
Que rapidéz David! haha. Un gusto haber colaborado con ustedes con este diseño que me encuentro desarrollando. Un abrazo y gracias por el aporte.
¡El gusto ha sido mío! Felicidades de nuevo por el diseño. Aclarar que no soy tan rápido, hubo un trabajo previo de analizar el diseño con detalle antes de empezar el reto y ponerme a escribir, sino quizás no hubiera definido ni las fuentes jeje. ¡Un abrazo y estamos en contacto!
Muy buen blog y excelente trabajo. Gracias por compartirlo!!
¡Muchas gracias Daniel! 🙂
Muy interesante, gracias por hacernos descubrir nuevos útiles. Además muy divertida experiencia.
¡Muchas gracias Dominique!
En mi caso he trabajando picando código y con Webflow. Creo que Webflow es el futuro, ha llegado para quedarse. Serán muchos equipos de desarrollo que dejaran de usar código como tal y utilizarán Webflow.