Introdução ao Desenvolvimento de Jogos · para pegar o objeto e levá-lo ao alvo? PRIMEIRA SOLUÇÃO 1. Vire 23 graus para esquerda 2. Vá pra frente 4 cm 3. Pegue o objeto 4. Vire

Introdução ao Desenvolvimento de Jogos

BCT - UERN

Créditos • Professores UERN

– Alberto Signoretti – Raul Paradeda

• Alunos CC UERN

– Pedro Henrique – Bruno Magnos – Gustavo Matheus – Rodrigo Fernandes

Visão Inicial • Elementos iniciais

– Como um jogo funciona? – Ideias básicas de um jogo – Elementos iniciais de programação

• Voltado ao ensino de programação – Não vamos criar imagens, gráficos e sons – Vamos utilizar imagens e sons existentes

O que é um jogo?


Introdução

Como um jogo funciona? O que é a “lógica” de um jogo? O que é um programa? Que ferramentas vamos usar?

Como um jogo funciona?


Dispositivo de entrada Processamento Dispositivo de saída

JOGO

Ciclo de um jogo


JOGO

Gráficos e Animações

Sons e efeitos sonoros

Programa

Programa

• “Lógica do jogo”

• Controla TODOS os elementos do jogo

• Captura o que o jogador faz no dispositivo de entrada

• Seleciona o que será mostrado no dispositivo de saída

entrada saída

O que é a “Lógica do jogo”?

• Exemplo de controle dos elementos do jogo

Se

Se

Se

então

então

então

Como definir a lógica do jogo?

• Através de um Programa – Sequência de instruções que dizem o que o

computador deve fazer (igual à recita de bolo da vovó…)

• no caso de um jogo… – Sequência de instruções que dizem ao computador

o que mudar no jogo, em função do que o jogador faz no dispositivo de entrada (gamepad, teclado,…)

• As instruções são executadas numa ordem pré-definida (igual à receita de bolo da vovó…)

Exemplo

• Que instruções vocês dariam ao robô abaixo para pegar o objeto e levá-lo ao alvo?

SOLUÇÃO???

Exemplo: solução 1


PRIMEIRA SOLUÇÃO

1. Vire 23 graus para esquerda

2. Vá pra frente 4 cm

3. Pegue o objeto

4. Vire 138 graus para direita


6. Deposite o objeto

Exemplo : solução 1


PRIMEIRA SOLUÇÃO



3. Pegue o objeto



6. Deposite o objeto 23o



PRIMEIRA SOLUÇÃO



3. Pegue o objeto



6. Deposite o objeto 4 cm



PRIMEIRA SOLUÇÃO



3. Pegue o objeto






PRIMEIRA SOLUÇÃO



3. Pegue o objeto




138o


3 cm


PRIMEIRA SOLUÇÃO



3. Pegue o objeto






PRIMEIRA SOLUÇÃO



3. Pegue o objeto




Exemplo : solução 1 funciona?

• Quem disse que o computador entende isso? • É necessário dar as instruções num formato

que ele entenda PRIMEIRA SOLUÇÃO



3. Pegue o objeto




?

Exemplo

• E se as possíveis instruções forem apenas “frente”, “esquerda”, “direita”, “pegue” e “deposite”?

SOLUÇÃO???


• E se as possíveis instruções forem apenas “Frente”, “Esquerda”, “Direita”, “Pegue” e “Deposite”?

SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite



SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite

Qual é o formato, então?

• Depende da Linguagem e Ferramentas usadas

• As ferramentas disponibilizam os comandos que podemos utilizar

• Ex: Vire à esquerda, vá em frente, etc.

• A linguagem especifica como usá-los

Ferramenta

SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite

programa numa linguagem

Que ferramenta iremos utilizar?

• Motor de jogo (engine)

• Primeira engine a ser usada: Scratch

Engine • Gráficos e imagens • Sons e efeitos sonoros • Captura de eventos no • teclado • mouse • gamepad

• Sistema de partículas • Modelos de física

SEGUNDA SOLUÇÃO

1. Frente (4x)

2. Esquerda

3. Frente

4. Pegue

5. Esquerda (2x)

6. Frente (3x)

7. Direita

8. Frente

9. Deposite

Programa

Língua vs. Linguagem

Língua

Linguagem

(natural ; gramática)

(artificial ; sintaxe)

• Linguagem • Evita-se ambiguidades • Comunicação através de uma sintaxe formal

Que linguagem iremos utilizar? • Linguagem de blocos do Scratch • Interface própria

Criando a Ideia do Jogo Projeto, desafios e interface…

Idealizando um jogo

• Em geral, essa é a parte mais difícil – O que fazer para seu jogo ser “interessante” – Criatividade: “ovo de Colombo”

• Precisa ter estímulos Desafios

– Você é capaz de…? – Mas…

• Não pode ser muito difícil (“Nunca vou conseguir”) • Não pode ser muito fácil (“Sem graça”)

• Vamos pegar um caso simples

Partes na definição de um jogo

Interface do jogo

Modelo do jogo

Jogador

Jogo

Modelo do jogo

• Elementos que compõem o jogo – Personagem, inimigos, objetos,…

• Atributos que eles possuem – Posição, força, pontos de vida,…

• Regras as quais os elementos estão sujeitas

– A posição de alien não pode ser negativa – Se os pontos de vida forem nulo, o personagem morre – …

Alien

Alien

Posição do alien

Interface do jogo

• Se refere a comunicação do jogo com o jogador – Gráficos, áudio, botões, mouse, teclado, …

pontos: 3283

Elementos de um jogo de corrida

• Cenário: – Asfalto, gramado... – Faixas (sinalização horizontal)

• O carro do Jogador • Obstáculos • Cronômetro e Velocímetro

Irá dar a sensação de movimento enquanto o carro estiver em movimento.

Obstáculos como tempo, inimigos etc apresentam desafios, algo essencial a um jogo.

Regras do jogo - Mecânica

• Objetivo: – O jogador terá o tempo de 1 minuto para percorrer

2 km • Movimentos:

– O carro só poderá deslocar-se para frente e para os lados

– O carro não pode ultrapassar os limites da pista • Obstáculos:

– Ao passar por um obstáculo o carro terá sua aceleração reduzida

Loop do jogo: Inicializa os

dados (configura tela,

carrega imagens, etc.)

Captura eventos do usuário

(movimento do mouse, teclado,gamepad,etc.)

Atualiza os dados

(muda posição de personagens, etc.)

Loop do jogo

Desenha os dados

(desenha gráficos e animações, etc.)

• Várias vezes por segundo

• Ilusão de

continuidade

Elementos imprescindíveis: variáveis e funções


Elementos iniciais

• Objetivos – Variáveis – Funções

Criando o modelo do jogo

• Como armazenar esses dados no computador?

• Uso de variáveis

Tipo do Alien

O que são variáveis?

• A memória do computador é armazenada em blocos de dados

• Cada bloco contém uma informação nele

• … e ao menos uma “etiqueta” para sabermos que informação é aquela

• Chamamos de “variáveis” porque o conteúdo das caixas podem mudar ao longo do tempo

…

Força Posição Nome

Variáveis

forca = 5

posicao = 12

nome = "abc"

forca = 3

posicao = 11

forca = 3 - 1

forca = forca - 1

forca

Declaração da variável forca e… …atribuição do valor 5 a ela

Variáveis

forca = 5

posicao = 12

nome = "abc"

forca = 3

posicao = 11

forca = 3 - 1

forca = forca - 1

forca

Declaração da variável posicao e… …atribuição do valor 12 a ela

posicao

Variáveis

forca = 5

posicao = 12

nome = "abc"

forca = 3

posicao = 11

forca = 3 - 1

forca = forca - 1

forca

Declaração da variável nome e… …atribuição do valor “abc” a ela

posicao

nome Os valores podem ser de tipos diferentes

Variáveis

forca = 5

posicao = 12

nome = "abc"

forca = 3

posicao = 11

forca = 3 - 1

forca = forca - 1

forca

posicao

nome

Variáveis

forca = 5

posicao = 12

nome = "abc"

forca = 3

posicao = 11

forca = 3 - 1

forca = forca - 1

forca

posicao

nome

Variáveis

forca = 5

posicao = 12

nome = "abc"

forca = 3

posicao = 11

forca = 3 - 1

forca = forca - 1

forca

posicao

nome

Variáveis

forca = 5

posicao = 12

nome = "abc"

forca = 3

posicao = 11

forca = 3 - 1

forca = forca - 1

forca

posicao

nome

Dados possuem “tipos”

• Tipos básicos – Número – String (texto) – Booleano (variável que pode assumir apenas dois

valores: verdadeiro ou falso)

• Outros tipos – Imagem – Sprites – etc

O que são funções?

• Uma FUNÇÃO é uma relação entre dois conjuntos de dados…

• Na matemática, pode ser definida como uma relação onde: cada valor x de um conjunto é correspondido por UM elemento y do outro conjunto, também denotado por ƒ(x).

f(x) IR (conjunto dos Reais) f(x) = x + 2 se f(x) = y, então y = x + 2

O que são funções?

• Em computação:

Parâmetros de entrada Tipo do resultado

Parâmetros de entrada

Resultados (saída)

Instruções a serem processadas

(cálculos, consultas, etc.)

f(x) IR

Como funciona uma Função? • Vamos supor algumas situações do nosso dia-

a-dia:

– Um carro aumenta sua velocidade conforme o motorista pisa no acelerador. Então:

• Podemos dizer que a velocidade do carro É FUNÇÃO

direta do “pisar” do motorista no acelador, ou seja:

– Maior o “pisão”, maior o aumento da velocidade – Menor o “pisão”, menor o aumento da velocidade


a-dia:

– Um carro diminui sua velocidade conforme o motorista pisa no freio. Então:

• Podemos dizer que a velocidade do carro É FUNÇÃO

inversa do “pisar” do motorista no freio, ou seja:

– Maior o “pisão”, menor a velocidade – Menor o “pisão”, maior a velocidade


a-dia: – Um carro vai para direita ou esquerda conforme o

motorista vira o volante para esquerda ou para direita. Então: • Podemos dizer que a direção do carro É FUNÇÃO direta

do giro que o motorista dá no volante, ou seja: – Motorista vira para direita, carro vai para direita – Motorista vira para esquerda, carro vai para esquerda

Como escrevemos uma Função matemáticamente? • Um carro aumenta sua velocidade conforme o

motorista pisa no acelerador. Então: – Podemos dizer que a velocidade do carro É

FUNÇÃO direta do “pisar” do motorista no acelador, ou seja:

– Maior o “pisão”, maior o aumento da velocidade – Menor o “pisão”, menor o aumento da velocidade

– Ou seja, a velocidade do carro é igual a valor da velocidade da variável vel_carro somada a duas vezes o valor da variável pisão_ac!

Velocidade(pisão_ac) = vel_carro + pisão_ac x 2

Como escrevemos uma Função matemáticamente? • Um carro diminui sua velocidade conforme o

motorista pisa no freio. Então: – Podemos dizer que a velocidade do carro É

FUNÇÃO inversa do “pisar” do motorista no freio, ou seja:

– Maior o “pisão”, menor a velocidade – Menor o “pisão”, maior a velocidade

– Ou seja, a velocidade do carro é igual a valor da velocidade da variável vel_carro subtraida de duas vezes o valor da variável pisão_fr!

Velocidade(pisão_fr) = vel_carro - pisão_fr x 2

Como escrevemos uma Função matemáticamente? • Um carro vai para direita ou esquerda

conforme o motorista vira o volante para esquerda ou para direita. Então: – Podemos dizer que a direção do carro É FUNÇÃO

direta do giro que o motorista dá no volante, ou seja:

– Motorista vira para direita, carro vai para direita – Motorista vira para esquerda, carro vai para esquerda

– Ou seja, a direçãodo carro é igual ao valor da variável vira. Se vira=esquerda, Direção =esquerda, se vira=direita, Direção=direita.

Direção(vira) = vira

Agora vamos aprender a usar o SCRATCH!


Documents

Introdução ao Desenvolvimento de Jogos · para pegar o objeto e levá-lo ao alvo? PRIMEIRA SOLUÇÃO 1. Vire 23 graus para esquerda 2. Vá pra frente 4 cm 3. Pegue o objeto 4. Vire