Programação criativa: produza peças visuais com JavaScript
A course by Bruno ImbriziProgramador criativo
A course by Bruno Imbrizi, Programador criativo
Aprenda os fundamentos da programação e descubra como desenvolver, desenhar e animar peças visuais e textos por meio de códigos
Experimentar com a programação criativa nunca é chato: sempre há algo para explorar, novas técnicas para aprender, ou novas imagens para criar. Para o creative coder Bruno Imbrizi, esta é uma oportunidade de combinar seus interesses com os motion graphics e o mundo da programação com peças visuais. Ele já trabalhou com pequenas e grandes agências e com marcas famosas, como Dell, Adidas e Universal Music.
Neste curso, Bruno ensinará você a criar peças visuais envolventes por meio de códigos. Você descobrirá os fundamentos da programação e aprenderá a desenhar utilizando a linguagem JavaScript de forma criativa.
Você gostaria de saber mais sobre programação? Confira o segundo curso do Bruno, Programação criativa 2.0 em JavaScript: animação, som e cor, onde ele ensina técnicas avançadas para composições repletas de cor, som e movimento.
O que você aprenderá neste curso online?
21 aulas & 39 downloads
Um ambiente para esboçar
12 minutos, 39 segundos
Rede
7 minutos, 51 segundos
Barulho
6 minutos, 40 segundos
GUI
11 minutos, 12 segundos
Texto
9 minutos, 26 segundos
Bitmap
10 minutos, 34 segundos
O que está incluído neste curso?
Você começará sua jornada conhecendo o Bruno Imbrizi, creative coder e seu professor neste curso. Ele contará sobre o início de sua carreira como designer gráfico e como decidiu combiná-la com seu interesse em programação. Ele também explicará quais são suas plataformas favoritas e as pessoas que mais influenciaram seu trabalho.
Em seguida, você descobrirá os fundamentos da programação. Primeiro, você aprenderá a preparar suas ferramentas principais e entenderá conceitos como variáveis, funções, arrays e loops. Depois, verá como melhorar sua configuração e começará a realizar uma série de esboços.
Na próxima unidade, você criará uma peça visual utilizando transformações de tela. Aprenderá a usar a trigonometria para distribuir figuras ao redor de um círculo, verá como alterar a escala dos desenhos e como utilizar as funções para facilitar os próximos designs. Logo, finalizará o seu esboço desenhando arcos e experimentando com valores para os parâmetros.
Na sequência, você fará um desenho animado com agentes de movimento sobre a tela. Você aprenderá a criar linhas entre eles com base em sua proximidade e descobrirá como exportar um arquivo de vídeo para compartilhar sua animação nas redes sociais.
Neste momento, você voltará a trabalhar com seu grid para torná-lo mais flexível e eficiente. Utilizará geradores de ruído e criará um pequeno painel de controle, atualizando seus desenhos em tempo real.
Para finalizar, você descobrirá como utilizar texto em suas composições. Bruno ensinará a desenhá-lo, medi-lo e a configurar as propriedades da fonte, explicando ainda como atualizar suas letras com apenas uma tecla. Por último, você aprenderá a interpretar valores de cor e dará os toques finais no esboço definitivo.
What is this course's project?
Você criará uma série de composições visuais para implementá-las em um navegador utilizando a programação em JavaScript.
Projetos de alunos do curso
Who is this online course for?
A todos os interessados em programação e em aprender a criar peças visuais por meio de códigos.
Requirements and materials
Para fazer este curso, recomenda-se ter conhecimentos básicos de matemática. Você também precisará de um computador com Node.js instalado, além de acesso a um navegador web e processador de texto.
Sistemas operacionais compatíveis: [list]⦁Linux ⦁SmartOS ⦁macOS 10.7 ou superior ⦁Windows 2008 ou superior
Requisitos mínimos:
⦁4GB de RAM ⦁10GB de espaço livre[/list]
Avaliações
- há 16 dias
Great course, I wish I’d had a stronger foundation in coding before taking it.
- há 1 mês
Excellent introductory course
- há 2 meses
Great course!!!
- há 2 meses
I loved this! I learned a lot and I sincerely recommend this course.
- há 4 meses
Ótimo curso. O professor entende do assunto em profundidade e sabe transmitir muito bem o conteúdo. É uma excelente oportunidade como porta de entrada para a programação criativa.
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
- Sobre mim
- Influências
- U2
Fundamentos
- Configurar
- Variáveis e funções
- Matrizes e Loops
- Um ambiente para esboçar
- U3
Sketch Transform
- Transformar
- Ângulos
- Funções Utilitárias
- Arcos
- U4
Agentes Sketch
- Objetos e Classes
- Animação
- Linhas
- Saida de video
- U5
Sketch Noise
- Rede
- Barulho
- GUI
- U6
Tipo de esboço
- Texto
- Assíncrono
- Bitmap
- Glifos
- PF
Projeto final
- Introdução à codificação para designers visuais
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
Programação criativa é usar programação para expressão artística ou visual. Este curso ensina a usar JavaScript, HTML e Canvas para criar visuais interativos e arte generativa por meio de experimentos práticos de código.
Este curso é indicado para usuários intermediários. É recomendável ter familiaridade básica com JavaScript e desenvolvimento web, mas os conceitos e ferramentas principais são explicados passo a passo para quem já tem alguma experiência com programação.
Você vai precisar de um editor de código como Sublime Text ou Visual Studio Code, Node.js, npm e um navegador moderno. O curso também ensina a instalar e configurar todas as ferramentas necessárias para projetos de programação criativa.
Você aprenderá a criar arte generativa, visuais interativos e protótipos usando JavaScript, Canvas e tecnologias web. Os temas incluem desenhar formas, transformações, animação, exportação de gráficos e uso de bibliotecas como Canvas Sketch.
O curso ensina a usar métodos da API Canvas do JavaScript, como fillRect, arc e fillStyle, para desenhar e estilizar retângulos, círculos e outras formas diretamente no navegador.
Sim, você vai aprender a exportar seus sketches generativos como imagens PNG ou arquivos de vídeo usando o Canvas Sketch CLI, além de dicas para exportações de alta qualidade.
Você será guiado na instalação do Canvas Sketch, inicialização de projetos, gerenciamento dinâmico das dimensões do canvas e execução dos sketches no navegador ou terminal.