introdução à programação exercício f13 - minigame - interação - imagens 1º semestre 2010...

16
Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Upload: internet

Post on 17-Apr-2015

110 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Introdução à ProgramaçãoExercício F13- Minigame- Interação - Imagens

1º Semestre 2010 > PUCPR > Design Digital

Bruno C. de PaulaBruno C. de Paula

Page 2: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Objetivo do exercício

Introduzir o tópico de interação via mouse e teclado;

Demonstrar como podemos trabalhar com imagens no Processing;

Propor um exercício que ilustre os tópicos anteriores e que gere um porfolio real ao grupo através da criação de um jogo;

211/04/23

Page 3: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

O que é um jogo digital?(minha definição)Experiência digital que :

Seja interativa;Seja simulada;De alguma maneira, consiga criar um

sentimento de diversão E/OU desafio ao jogador;

Seja repetível e que haja motivação para repetí-la;

Dê um retorno ao jogador segundo suas ações, seguindo um conjunto de regras.

311/04/23

Page 4: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Funcionamento básico de um jogo

Game loop:Fluxo principal do jogo;Pode ter diversas variantes;Enquanto (jogo está rodando)

• Verificar a entrada de dados do usuário• Executar a inteligência artificial;•Mover os inimigos;• Resolver colisões;• Mostrar os gráficos;• Tocar os sons.

411/04/23

Page 5: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Fonte:http://nerdson.com/blog/refresh/

Page 6: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Interação via teclado no ProcessingVariável keyPressedVariável que indica se uma tecla está

pressionada; O teste é feito a cada draw;Exemplo:

611/04/23

void draw() {if(keyPressed==true) {

fill(0);} else {

fill(255);}rect(25, 25, 50, 50);

}

Page 7: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Interação via teclado no ProcessingFunção keyPressedFunção que é chamada quando uma

tecla é pressionada; A execução se dá uma vez só;Não desenhe nada dentro dela!Exemplo:

711/04/23

void keyPressed() {println(“Tecla pressionada!”);

}

Page 8: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Outras funções e variáveis

Veja a referência (eng / pt);key, keyCode, keyReleased, keyTyped;E, para o mouse:

mouseButton, mouseClicked, mouseDragged, mouseMoved, mousePressed, mouseReleased, mouseX, mouseY, pmouseX, pmouseY

811/04/23

Page 9: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

9

Exibição de imagens

loadImage: carrega uma imagem a partir de uma url ou arquivo em disco;

image: exibe uma imagem na posição escolhida;

Page 10: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

10

Seleção de imagem

Por exemplo, a imagem do endereço:http://tinyurl.com/jogoaviao

Page 11: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

11

Seleção de imagem

Salvar a imagem em qualquer pasta com o Firefox ou IE;

Page 12: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

12

Seleção de imagem

Selecionar o menu Sketch > Add File e selecionar a imagem desejada;

Page 13: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

13

Exibição de imagens

// Variável de imagemPImage img; //aviao.png está na pasta do Projeto img = loadImage("aviao.png"); // cor de fundo igual à cor da imagembackground(0,67,171); // exibe a imagem na posição escolhida image(img,0,0);

Page 14: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Exercício F13 Jogo de um botãoSeu objetivo neste exercício será criar

um mini-jogo controlado apenas com um botão;

Este gênero de jogos (one button, one switch, etc) é bastante utilizado tanto em:Jogos para Web e Móveis;Jogos acessíveis;Jogos para eventos;

1411/04/23

Page 15: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Exercício F13 Jogo de um botãoNo fim deste exercício, criaremos um

único jogo no qual todos os minigames serão executados seqüencialmente ao jogador;Exemplo:

http://www.youtube.com/watch?v=_3VRTgMWVsc

Mais uma restrição: seu jogo deverá ter uma duração máxima de 10 segundos;

Esta duração deverá ser indicada na tela.

1511/04/23

Page 16: Introdução à Programação Exercício F13 - Minigame - Interação - Imagens 1º Semestre 2010 > PUCPR > Design Digital Bruno C. de Paula

Exercício F13 Jogo de um botãoEntrega no dia 24/03/2010;Defesa no mesmo dia;Pode ser feito em duplas;Hoje você deve criar uma explicação

sobre o que é seu jogo e como ele funciona;

Envie até próxima terça (9/3) esta explicação no formulário indicado;

Você irá desenvolver seu jogo durante as próximas semanas;

1611/04/23