DEV Community

Cover image for Hackathon de Cloudinary junto a Midudev: Mi experiencia y aprendizajes al participar
John Serrano (jandrey15)
John Serrano (jandrey15)

Posted on

Hackathon de Cloudinary junto a Midudev: Mi experiencia y aprendizajes al participar

🎃 ¡Patícipe en la hackathon de Cloudinary junto a Miguel Ángel Durán García con mi proyecto: HallowStick! 👻

Durante la última semana, estuve trabajando en HallowStick, una web interactiva que transforma tus imágenes o fotos en stickers con temática de Halloween. 🧛‍♂️🧟‍♀️🎨

Introducción

En este artículo exploro cómo utilicé tecnologías como Astro, Cloudinary y TailwindCSS para desarrollar una aplicación web capaz de transformar fotos en stickers temáticos, listos para compartir en redes sociales.

Además, detallo los desafíos que enfrenté, las oportunidades que descubrí al integrar Cloudinary para manipulación avanzada de imágenes y los aprendizajes clave que me llevo de esta experiencia.

¡Acompáñame en este recorrido y descubre cómo puedes crear tus propios stickers personalizados!

¿Por qué elegí Astro?

Opté por Astro porque es un framework moderno que disfruto mucho usar. Ofrece una curva de aprendizaje suave, facilitando la creación rápida de proyectos, además de proporcionar una experiencia de desarrollo fluida y un rendimiento excepcional. Un gran beneficio adicional fue la posibilidad de utilizar el SDK Astro-Cloudinary, lo que simplificó enormemente la integración y manipulación de imágenes mediante Cloudinary.

Conceptualización del proyecto

La idea principal era desarrollar una herramienta que permitiera generar imágenes con estilo de sticker, añadiendo un toque de Halloween o terror. Las temáticas incluyeron fantasmas, brujas y zombies. Al final, los usuarios podrían compartir estos stickers por WhatsApp como imágenes comunes o utilizarlas para crear stickers personalizados dentro de la aplicación.

El proceso creativo y el desarrollo del proyecto me tomó alrededor de 5 a 6 días. Durante ese tiempo, busqué los recursos necesarios, como imágenes y logos, y trabajé en la implementación técnica de la idea.

Desafíos

Uno de los retos más grandes fue la integración de los distintos componentes de Cloudinary con Astro. Encontrar los prompts adecuados para generar los fondos y lograr efectos en los rostros —como pintar o modificar la apariencia— fue todo un desafío.

También resultó complicado seleccionar imágenes atractivas como fondos y elegir los logos que mejor se ajustaran a cada temática. Sin duda, estos obstáculos hicieron el proceso más interesante y enriquecedor.

Lo que aprendí

Participar en esta hackathon me permitió poner en práctica habilidades tanto técnicas como creativas. Aprendí a integrar el SDK de Cloudinary para Astro, lo que abrió un abanico de posibilidades para manipular imágenes sin perder calidad.

Además, exploré cómo aplicar filtros avanzados, cambiar fondos y modificar aspectos visuales de las imágenes de manera eficiente. Esta experiencia me enseñó lo poderosa que puede ser la combinación de un framework ligero como Astro con herramientas multimedia como Cloudinary, optimizando tanto el flujo de trabajo como los resultados finales.

Otro aspecto clave fue entender los desafíos técnicos al trabajar con servicios externos y mejorar la experiencia de usuario en la web, como la creación de stickers personalizables que se puedan compartir fácilmente en redes sociales. También descubrí la importancia de gestionar bien los recursos visuales para asegurar un rendimiento óptimo del sitio.

Agradecimientos

¡Un enorme agradecimiento a Cloudinary y Midudev por esta fantástica oportunidad! 🎉💻 Ha sido una experiencia enriquecedora para poner a prueba mis habilidades, experimentar con nuevas herramientas y llevar mi creatividad al siguiente nivel. 🚀🧠

👉 ¿Te animas a probarlo? Entra aquí: 🔗 https://hallowstick.netlify.app/ 🎃👻

Si te ha gustado mi proyecto, te invito a visitar el repositorio en GitHub. ¡No dudes en regalarme una estrellita! ⭐ Tu apoyo significa mucho y me motiva a seguir mejorando. ¡Gracias! 👉 https://github.com/johnsi15/hallow-stick

Conclusiones

La hackathon me permitió mejorar tanto habilidades técnicas como la creatividad, aprendiendo a combinar Astro y Cloudinary para crear contenido visual optimizado con multiples opciones de manipular las imágenes. Además, fortalecí mi capacidad de trabajar bajo presión y enfocar esfuerzos en soluciones eficientes, logrando desarrollar un proyecto funcional y atractivo en pocos días.

¡Anímate a probarlo y crea tus propios stickers de Halloween! Espero que lo disfrutes tanto como yo lo hice desarrollándolo. ❤️

🔗 https://hallowstick.netlify.app/ 🎃👻

Top comments (0)