Computação Gráfica

Curso: Engeharia de Computação

Turma: Ensino Remoto Emergencial 2020

Conteúdo Prático para a Disciplina de CG usando WebGL

Introdução

Este conteúdo é baseado em outros conteúdos da internet com o Objetivo de auxiliar os Alunos do CefetMG na disciplina de Computação Gráfica

Algebra e Computação Gráfica

WebGL Prático

Bibliotecas Úteis

Trabalho Prático

Pré-Trabalho 22/01/2021 - 3 pontos

  • Aprender a utilizar a GitPages (https://www.alessiojr.com/disciplinas/conteudos/gitpages/)
  • Criar uma página introdutória para os trabalhos web
  • Fazer os tutoriais auxiliares de 1 a 3
  • No Git Page postar o tutorial que apresenta o quasdrado e o triangulo.

Pré-Fase 1 30/01/2021 - 3 pontos

  • Fazer os tutoriais auxiliares de 3 a 5
  • Postar na raiz da página web uma figura chamda pre-1.jpg que conterá a inspiraçào para a fase 1
  • Criar uma figura com representação Geométrica em 3D com movimentos
  • Posicionar as figuras de forma estática de forma a ficar semelhante à figura de inspiração

Fase 1 - 15/02/2021 - 15 pontos

  • Fazer os tutoriais auxiliares de 6 e 7
  • Adapte a figura escolhida, desenhando em 3D usando imagens geométricas, quadrados e retas de pelo menos 3 cores.
  • Terão que existir pelo menos 9 Objetos na tela.
  • Deve-se configurar a Camera deve se movimentar de acordo com o teclado ou mouse (Ou a cena deve ser alterada pelo teclado)
  • O Objeto deve ter pelo menos 2 movimentações absolutas e 1 relativas.
  • Deve haver pelo menos 1 textura.
  • Deve haver pelo menos 2 pontos de Luz.

Pré-Fase 2 21/02/2021( 5 pontos) Em Construcao

  • Escolher um jogo de inspiração
  • Postar na raiz da página web uma figura chamda pre-2.jpg que conterá a inspiraçào para a fase 2

Fase 2 30/03/2021( 25 pontos) Em Construcao

  • Faser o Jogo da Fase 2

Trabalhos Práticos

Aluno Inspiração Fase 1 Pré-Projeto Projeto
Abner
Kaizer (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Adriel
Araújo (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
André
Neves (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Felipe
Soares (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Gustavo
Silveira (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Habacuque
Boy (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Joao
Pina (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Karine
Morais (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Leonam
Teixeira (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Luan
Diniz (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Luidson
Juliao (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Luiz
Souza (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Matheus
Bicalho (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Maycon
Carvalho (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Pedro
Ribeiro
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Pedro
Jandre (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Robson
Nascimento (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg
Washington
Carvalhais (opens new window)
pre-1.jpg fase-1.jpg pre-2.jpg fase-2.jpg

Jogos com WebGL

Durante a disciplina você terá que desenvolver um pequeno jogo usando WebGl, abaixo temos 2 jogos de exemplo feitos no semestre passado.

Jogo Descrição
Frogger (Atari) Levar uma quantidade determinada de sapos ao outro lado do cenário, com a menor quantidade de passos possíveis.
Asteroids Guiar sua nave, destruindo asteroides que aparecem para obter pontos, e caso seja atingido, perde uma vida. Asteroides se dividem em 2 quando atingidos. Ao atingir o fim da tela o objeto e transportado para o lado oposto.
Apocalipse de meteoros Empilhar as peças que vão caindo e eliminar as linhas que se formam
Shinobi 3 Matar os inimigos, andar e não morrer, isso é viver, é aprender, hakuna matata
Berzek Sobrevivencia é o ponto forte, ande pelas salas detruindo todos os robos, mas cuidado com as paredes, elas podem te dar um leve choque.
Battle City - SuperTank O jogo consiste em guiar um tanque em um mapa, com vários outros tanques adversários surgindo aleatoriamente. Há uma "Águia" a qual representa a "vida" do jogador, quando esta atingida, o jogador perde. O jogador também pode perder caso os tanques adversários o atinjam.
Snake (cobrinha) - 3D O jogo da cobrinha em um ambiente 3D.
Flap Bird
Galaxian
Tomb of the Mask Saia do labirinto e salve sua vida!
Adventure (Atari 2600) Mini RPG com objetivo de passar a fase mantando os inimigos e saindo do lugar. contato com o inimigo perde vida.
River Raid (Atari ) O jogador controla um avião que sobrevoa um rio. A aeronave move-se verticalmente ao longo do rio, repleto de navios, helicópteros e aviões inimigos, com nível de dificuldade progressivo.
Pong O jogador controla uma paleta (barra vertical) no jogo movendo-a verticalmente no lado esquerdo da tela, e compete contra o computador ou outro jogador que controlam uma segunda raquete no lado oposto. Os jogadores usam suas paletas para acertar a esfera (bola) e mandá-la para o outro lado.
Freeway Activision Em Freeway , o jogador controla uma galinha que deve atravessar uma rodovia cheia de automóveis e de caminhões, com mais de seis pistas.
Pac-Man Coma todas as bolinhas espalhadas no estágio sem ser pego pelos fantasmas. Tudo num labirinto em três dimensões.
Dinossauro Chrome
Speed Ball A bola deve evitar os obstáculos em uma rota "infinita", escolhendo o caminho à esquerda ou à direita.
Bowling
Missile command Missile command tem a proposta de defender uma cidade do ataque de mísseis vindos do céu. O jogador usava, para tanto, uma mira brilhante.Com essa mira, o jogador tinha o poder de colocá-la em qualquer ponto da tela e, usando o botão vermelho do joystick, causar uma grande explosão, com raio de alcance suficiente para destruir os mísseis inimigos.

AFrame

  • https://github.com/wmurphyrd/aframe-physics-extras
  • https://wmurphyrd.github.io/aframe-physics-extras/examples/collision_response/
Last Updated: 2/2/2021, 12:15:17 PM