Programação criativa 2.0 em JavaScript: animação, som e cor
A course by Bruno ImbriziProgramador criativo
A course by Bruno Imbrizi, Programador criativo
Aprenda técnicas de programação avançada para produzir imagens únicas que combinem cor, movimento e som em JavaScript
Programar é como resolver um quebra-cabeça: é um ciclo constante de aprendizado, erros e repetições que dão forma a algo belo. Bruno Imbrizi é um designer gráfico premiado que dedicou os últimos dez anos de sua carreira a dominar a arte da programação criativa.
Ele usa JavaScript para produzir animações, impressões, peças interativas e muito mais, para grandes marcas como Google, Spotify e Nike, e ganhou prêmios como o Adobe Cutting Edge Award e FITC Best Digital Installation.
Este é o segundo curso de Bruno na Domestika. No primeiro, Programação criativa: produza peças visuais com JavaScript, ele ensinará a você os fundamentos da programação e do desenho com códigos do zero.
O que você será capaz de fazer ao final deste curso?
"Ensinarei várias técnicas para você produzir imagens surpreendentes com JavaScript."
Você saberá como programar uma visualização imersiva com som
Aprenderá a desenvolver composições repletas de cores
E como animar seus visuais e incorporar a interação do mouse
O que você aprenderá neste curso online?
28 aulas & 20 downloads
A configuração on-line
5 minutos, 4 segundos
Distribuição
4 minutos, 51 segundos
Adicionando cores
8 minutos, 50 segundos
Máscara de recorte
6 minutos, 29 segundos
Dados de imagem
8 minutos, 53 segundos
O que está incluído neste curso?
Para começar, seu professor fará uma recapitulação das ferramentas fundamentais do JavaScript. Depois, você verá como configurar um ambiente para executar a codificação e criar seus desenhos.
Em seguida, você descobrirá como desenhar formas básicas inteiramente em códigos, como adicionar cores e esticar ou inclinar seus designs.
Já na terceira unidade, você programará as diferentes iterações dos elementos de design e imagens, adicionando vários pontos ao longo de um segmento, e verá como animá-los, fazendo com que o cursor do mouse interaja com as imagens.
Logo, você fará uma visualização de áudio, reproduzindo arquivos de som, lendo os dados e usando frequências para criar uma animação.
Por último, você trabalhará com partículas e ensinará a elas como devem se comportar, aplicando diferentes forças e interações, assim como a modificação de seu tamanho e cor.
What is this course's project?
Você fará uma série de composições de programação, usando cores e sons, que serão executadas em um navegador web.
Projetos de alunos do curso
Who is this online course for?
Para todas as pessoas interessadas em aprofundar seus conhecimentos de programação para criar composições animadas originais.
Requirements and materials
Para fazer este curso, é necessário ter conhecimentos prévios de programação.
Quanto aos materiais, você precisará de um computador com JavaScript.
Avaliações
- há 4 meses
Polecam, fajna zabawa
- há 7 meses
Excelente! Buena fuente de inspiración para creativos incursionando en programación
- há 9 meses
I will recommend this to my friend who likes to know more on javascript designing
- há 9 meses
Recomendado para principiantes que quiera incorporar su lado artístico a la codificación.
- chillwill47PLUShá 11 meses
Just getting started into creative coding and this course is definitely a great point to begin at.
Com mais de 10 anos de experiência, ele já trabalhou em agências, estúdios de design e empresas de produção, além de ter colaborado com marcas como Dell, Adidas e Universal Music. Seu trabalho já foi destacado em publicações online como Wired e Londonist e ele já recebeu prêmios como o Adobe Cutting Edge e o FITC pela melhor instalação digital.
Conteúdo
- U1
Introdução
- Apresentação
- Influências
- U2
A configuração
- Resumo do JavaScript
- A configuração on-line
- A configuração off-line
- Esboço em Tela
- U3
Torção
- Desenhando um retângulo
- Desenhando um retângulo inclinado
- Distribuição
- Adicionando cores
- Máscara de recorte
- Configurando uma semente aleatória
- U4
Curvas
- Desenhando uma curva quadrática
- Interação do cursor
- Vários pontos
- Criando uma grade
- Segmentos
- Animação
- U5
O áudio
- Pressionando Play
- Analisador
- Frequências
- Arcos
- Criando um Pôster
- U6
Partículas
- Desenhando uma única partícula
- Aplicando Forças
- Distribuindo as partículas
- Modificando escala e cores
- Dados de imagem
- PF
Projeto final
- Programação criativa 2.0 em JavaScript: animação, som e cor
O que esperar de um curso da Domestika
Aprenda no seu ritmo
Aproveite para aprender desde casa, sem um horário fixo e no seu ritmo. É você quem define sua disponibilidade.
Aprenda com os melhores profissionais
Aprenda métodos e técnicas fundamentais com os melhores profissionais do setor criativo.
Conheça os maiores especialistas
Cada professor compartilha seus conhecimentos com entusiasmo e explicações claras, oferecendo uma perspectiva profissional em cada aula.
Certificates
PLUSIf you're a Plus member, get a certificado personalizado signed by your teacher for every course. Share it on your portfolio, social media, or wherever you like.
Sente-se na primeira fila
Com vídeos da melhor qualidade, você não perderá nenhum detalhe! Graças ao acesso ilimitado, você pode assistir às aulas todas as vezes que precisar para aperfeiçoar sua técnica.
Compartilhe conhecimentos e ideias
Pergunte, peça opiniões e ofereça soluções. Compartilhe sua experiência de aprendizagem com outros alunos da comunidade tão criativos como você.
Conecte-se a uma comunidade criativa global
Esta comunidade acolhe milhões de pessoas do mundo todo, curiosas e apaixonadas por descobrir e expressar sua criatividade.
Assista a cursos produzidos de maneira profissional
A Domestika seleciona cuidadosamente seus professores e produz cada curso internamente para garantir uma experiência de aprendizagem online excelente.
Perguntas frequentes
Este curso é voltado para alunos intermediários. Recomenda-se ter conhecimentos básicos de JavaScript e conceitos de programação antes de se inscrever para aproveitar melhor as aulas.
Você precisará de um navegador web moderno e ferramentas como StackBlitz, CodeSandbox, Node.js, npm e um editor de código como Sublime Text. Não é necessário hardware especializado.
Você aprenderá conceitos fundamentais de programação criativa, como usar JavaScript e Canvas APIs para visuais interativos, técnicas de arte generativa, configuração de projetos, exportação de obras e integração de áudio para visualização.
O curso foca principalmente em programação criativa 2D usando JavaScript e Canvas APIs, mas também apresenta conceitos de visualização 3D e frameworks como Processing e OpenFrameworks.
Sim, o curso inclui instruções detalhadas para configurar e usar StackBlitz e CodeSandbox para desenvolvimento direto no navegador, facilitando começar a programar sem instalações locais.
Você aprenderá a exportar sua arte generativa feita no navegador como imagens PNG em alta resolução, que podem ser impressas ou compartilhadas online.
Sim, o curso aborda a criação de visuais interativos e esboços animados usando JavaScript, Canvas API e Canvas Sketch, incluindo lógica baseada em frames e interação do usuário.