Programación creativa 2.0 con JavaScript: animación, sonido y color

Programación creativa 2.0 con JavaScript: animación, sonido y color

“¡Felicidades! Has llegado al final de este curso de Domestika. Gracias por participar y espero que lo hayas disfrutado. Trabajamos juntos en algunas composiciones, pero la parte más importante fueron las técnicas que aprendiste. ¡Ahora puede transferirlos, volver a aplicarlos en otro lugar y crear algo diferente! Aunque cubrimos mucho, siempre hay más de qué hablar, así que preparé una pequeña lista de consejos para esta última unidad. Bibliotecas Usé algunos de ellos a lo largo del curso, pero hay miles más por ahí. A algunas personas les gusta hacer todo por sí mismas, pero a veces eso es como tratar de reinventar la rueda. Siempre que necesite algo específico, le recomiendo que busque primero en NPM. ¡Alguien más podría haber trabajado en ese problema ya! Por ejemplo, si necesita cargar datos de un archivo CSV, hay bibliotecas para eso. Si necesita realizar operaciones con vectores, convertir entre diferentes espacios de color o cargar archivos de fuentes, hay bibliotecas para eso. Creación de un sitio web Un boceto puede vivir por sí mismo. Puede exportar su composición e imprimirla o publicarla en algún lugar. Pero si desea compartir sus bocetos en línea, también puede hacerlo con un comando "--build". Genera archivos JavaScript y HTML estáticos que se pueden alojar como páginas web normales en cualquier lugar. En caso de que necesite que su boceto se integre en un sitio web existente, recuerde que siempre usamos la API nativa de Canvas, por lo que puede copiar partes relevantes de su código en otro proyecto y ejecutarlo sin el boceto de lienzo. p5.js Muchas personas se involucran en la codificación creativa con Processing o p5.js, y eso tiene mucho sentido, son excelentes herramientas. Estoy acostumbrado a trabajar con la API nativa, pero si ya se siente cómodo con p5.js, puede usarlo junto con canvas-sketch. Hay un ejemplo básico incluido en el video de arriba que muestra cómo hacerlo. Documentación Esta es una obvia. Asegúrate de revisar la documentación. Eso no es solo para canvas-sketch o Canvas, sino para cualquier API con la que esté trabajando. Alguien se tomó el tiempo de organizar y documentar su código para que podamos aprovecharlo. Está ahí para ayudarnos. A continuación, me gustaría hacer un resumen de lo que hemos visto hasta ahora. En este curso, he trabajado en cinco pequeños proyectos. El primero comenzó con un simple rectángulo, pero al final involucró algunos conocimientos sobre trigonometría, aleatoriedad, paletas de colores, modos de fusión y máscaras de recorte.

El segundo proyecto consistió en crear unos visuales usando segmentos de curvas distribuidos como una cuadrícula, usando los colores de una manera diferente a como lo hiciste en la primera unidad. Luego, usé datos de frecuencia de audio para impulsar algunas imágenes e intenté recrear un par de diseños de carteles clásicos usando código. ¡El último boceto tiene que ver con las partículas! Aprendiste a aplicarles fuerzas, utilizando conceptos básicos de la física como la velocidad y la aceleración. Ahora, me gustaría que compartieras tus bocetos en el foro haciendo clic en el botón "Crea tu proyecto" arriba. Sería genial si también pudieras explicar las elecciones que has hecho en el camino y decirnos si tienes alguna duda. Así todos aprenderemos unos de otros. Estaré allí para responder preguntas y dar alguna orientación. Tengo curiosidad por ver qué crearás con lo que aprendiste en el curso. ¡Te veo allí! ”

Transcripción parcial del vídeo

“Proyecto final Hola a todos, espero que hayan disfrutado el viaje. Trabajamos en algunas composiciones juntos. pero la parte principal fueron las técnicas que aprendimos ya que ahora puedes llevarlos encima, Vuelva a aplicarlos en otro lugar y cree algo diferente. Cubrimos mucho, pero siempre hay más de qué hablar. He preparado una lista de consejos para este video final. Bibliotecas, usamos algunas a lo largo del curso pero hay miles más. Algunas personas hacen todo por sí mismas pero a veces es como intentar reinventar la rueda. Siempre que necesite algo específico, le recomiendo consulta...”

Generamos automáticamente esta transcripción y puede haber erratas.

Resumen del curso: Programación creativa 2.0 con JavaScript: animación, sonido y color

• Nivel: Iniciación
• 99% valoraciones positivas (172)
• 19453 estudiantes
• 6 unidades didácticas
• 28 lecciones (2h 47m)

• Categoría

  3D y Animación, Diseño Web y App

• Áreas

  JavaScript, Motion Graphics, Multimedia, Programación