Portfólio de Programação
Bem neste cantinho do meu blog vai estar organizado, mais ou menos, o portfolio da cadeira de programação do MDM da FCTUC.A cadeira tem por base a programação em processing.
.Introdução…
Processing é um projecto open source de Casey Reas e Benjamin Fry, formados no MIT Media Lab. É uma linguagem de programação e um ambiente de desenvolvimento integrado construído para as “artes electrónicas” e comunidades de arte e design visual, que tem como base a programação básica num contexto visual. Permitindo assim, programar conteúdos gráficos, de forma fácil e sem necessitar de programação avançada, de forma a que o utilizador consiga ver os resultados (feedback da aplicação) em tempo real. A linguagem esta construída sobre as capacidades gráficas da programação em java, com algumas funcionalidades simplificadas e outras que foram adicionadas!
fonte: http://en.wikipedia.org/wiki/Processing_(programming_language) adaptado por Carlos Valério.
.Primeiros passos…
O Processing tem presença na web em http://processing.org/, aqui podemos adquirir o software e começar a explorar as suas capacidades.
Links p/download do processing:
# Processing c/Java para Windows
Após o dowload podem então correr o programa e começar por explorar os exemplos, para terem uma noção do que é possível criar com a aplicação.
Fica um exemplo:
Video linkado ao youtube. Direitos reservados ao autor.
.Exercicios introdutórios
Exercicio 1
.Desenhar linhas paralelas
O exercício introduziu alguns conceitos como por exemplo,como declarar variáveis e a função das mesmas.
Desenhámos uma linha definida por line(x,y,x+20,y-40) sendo x e y os valores iniciais das variáveis que definem o primeiro ponto da linha. Com o uso de variáveis a posterior alteração de código fica simplificada, pois basta modificar os valores iniciais das variáveis para todo o bloco de código ser afectado.
Resultado:
Exercicio 2
.Linhas “coladas” ao ponteiro do rato
Neste exercicio usámos o código das linhas anteriores e aprendemos novos conceitos:
.função setup();
- Função chamada apenas uma vez quando é iniciado o programa. Usa-se para definir as propriedades iniciais da aplicação, tais como a dimensão da janela, cor de fundo, imagens a carregar, entre outras, e tem de ser definida antes do “draw()”;
.função draw();
- Chamada logo após o setup() e executa de forma continua as linhas de codigo dentro do seu bloco até o programa ser parado ou se for chamado o noLoop();
.utilização das coordenadas do rato para criar interacções com o programa, sendo mouseX a coordenada da posição do rato na horizontal e mouseY a coordenada vertical.
Exercicio 3
.Boneco movimentado com o rato
.Este exercício surgiu em sequência do anterior e como forma de praticar o desenho de formas.
Resultado
Exercicio 4
.Circulo de Cores
No exercício “circulo de cores” conseguimos aprender bastantes conceitos novos, este foi o exercício que levou mais horas a concluir, e foi sendo construído à medida que surgia nova matéria.
.Novos conceitos:
.ciclo “for” – controla uma sequência de repetições, divide-se em três etapas, inicialização – teste – update, “for(int i=0; i> 9; i++)” – inicia a variavel i a zero, testa se a variavel ainda respeita a condição, incrementa a variavel.
.arrays – lista de qualquer tipo de dados. Através de um indice os valores são guardados no array e podem ser acessedidos, modificados e apagados consoante o que se pretende.
No exemplo, do circulo de cores usámos um array de cores de forma a que as cores usadas em cada divisão do circulo fossem guardadas e rodassem para a posição seguinte.
Resultado
Trabalho de Grupo
.Moinho
Grupo constituído por:
* Ana Eduarda;
* Carlos Valério;
* Cecília Brito;
* Lígia Costa;
* Mário Pessegueiro;
* Michael Gomes;
.Para o trabalho de grupo o que se pretendia era o uso das capacidades gráficas do processing e da programação em Java para criar uma animação de um moinho.
Resultado
Comentário do Trabalho Individual 1
“Espiral” por Rita Ferraz
.Comentário:
O trabalho da minha colega, preencheu os requisitos estabelecidos para o exercício, i.e., conseguiu perceber o código inicial e “moldou-o” de acordo com o que pretendia.
As alterações que fez mostram-se concisas e não arriscadas, na tentativa de criar algo aleatoriamente, ou seja estabeleceu um objectivo (criar uma espiral de linhas a partir do centro), e cumpriu-o.
Apenas não respeitou o facto de quando a linha atinge-se o comprimento máximo decresce-se.
Como forma de solução criei uma condição if que quando a linha atinge o limite do ecrã volte ao valor inicial.
Outra coisa que achei menos correcta foi o facto de usar variáveis com o mesmo nome, “final int VARCOMP” e a “int varComp “ , embora não implique qualquer complicação de código, numa aplicação mais extensa pode criar alguma confusão.
A nível gráfico a aplicação ficou bastante boa, apenas usaria um “smooth()” para melhorar a definição das linhas.
Conclusão, conseguiu cumprir os requisitos do exercício e criou uma animação bastante interessante.
Bom trabalho
Trabalho Individual 1
No trabalho individual 1, foi-nos fornecido um bloco de código que representava umas linhas estáticas como podem verificar na imagem.
Com isto, o essencial era pegar forma fornecida e animar!
Fica aqui o resultado final.
Trabalho Individual 2
Este exercicio tinha como função partilha de conteúdos sobre processing e investigação de trabalhos mais complexos.
Assim, tivemos de pesquisar trabalhos feitos em processing de um grau de dificuldade mais elevado e através do código preparar uma breve apresentação do mesmo focando alguns elementos chave usados na compilação.
Após uma pesquisa na Web por conteúdo de processing, fui parar ao fórum do site oficial do Processing e descobri um projecto interessante.
O projecto criado por Lukas Vojir, consiste num trabalho de cooperação entre os vários participantes do fórum. O objectivo é o de criar um monstro animado, feito em processing, e de disponibilizar o seu código fonte, estes estão apresentados numa pagina web e que no final do “concurso” resultará na união de todos os trabalhos numa única animação.
Segundo o autor, “Processing Monsters are result of my effort to learn Processing and encourage others to do so by showing the source code.
Also, at the end, my plan is to do a short music reactive video using these monsters.”
Poderá então ver este projecto em : »FORUM
Exposição da Obra: » Página de exposição
Contudo não teria tempo para explicar todos os trabalhos, portanto escolhi um que achei muito cativante, CubeMonster, trabalho este que foi submetido a esta iniciativa por Eduardo Omine.
»Ver animação e download do código
Conclusão:
O trabalho de Eduardo Omine, apresenta uma animação de um pequeno cubo 3d, que paira/flutua, ao mesmo tempo de liberta círculos de cubos a expandirem até desaparecerem na tela.
Para a parte de interacção, podemos mover a personagem no ecrã e “irrita-la” clicando no rato, ficando esta realmente furiosa e libertando cubos em todas as direcções.
A nivel visual está bem estruturado, e desenhado e a animação bastante realista e com uma suavidade de movimentos perfeita.
Exemplos e Links uteis:
A titulo de despedida deste blog para a cadeira de programação deixo mais alguns exemplos que podem ser vistos na web e tomados como referência.
Exemplos e partilha de trabalhos em Processing
Muitos e muitos exemplos em processing que vêem explicados no livro.
Site de Casey Reas
Ben Fry site
Assim encerro o meu blog, quando tiver novidades em processing colocarei aqui…espero que não seja o fim mas uma breve ausência!
Quem nos dera a nós um dia conseguirmos fazer algo como esse vídeo!!! =) Vale a pena sonhar