How to build a Wack-A-Mole VR Game with A-Frame

How to build a Wack-A-Mole VR Game with A-Frame

  • English
  • Game Development
  • Mobile VRMobile VR
  • (608)
  • Project length: 1h 59m

A Whack-A-Mole game is a game where the player whacks moles that come up from the ground. In some old arcades, they also had these. They are pretty fun. In this project, we will be implementing a game like that in WebVR with the A-Frame framework.

Overview

Project Introduction:

A whack-a-mole game is a game where the player whacks moles that come up from the ground. After the game begins, the moles will be popping up from their holes randomly. The objective of the play is to hit the moles and make them go back into their holes, which constitutes the score. The faster the whacking is done, the higher will be the player’s score. The game is fun to play! In this project, we’ll be implementing a game like that in WebVR using the A-Frame framework. We’ll cover all the details (such as resources, tools, languages) that are required to build an interesting whack-a-mole VR game.

What are the requirements?:

To ensure you grasp the concepts in this project faster, you need to have basic skills in the following:

  • HTML/CSS/JS
  • Node.JS
  • Basic Knowledge of the terminal

Who is the target audience?

  • Developers who want to learn about the VR technology
  • Learners who want to know about futuristic trends and technologies
  • VR enthusiasts who want to know how to integrate the technology into their applications
  • Anyone who wants to learn how to build amazing virtual reality products

What will you learn after finishing this project?

  • How to integrate virtual reality design techniques in your application
  • How to use the open source A-Frame framework for creating immersive VR experiences
  • How to use the ubiquitous JavaScript programming language to create VR applications

When are the streaming sessions (streaming schedule)?

All Sessions will be pre-recorded

Project Outline

Session 1: Environment Setup

  • Install Dependencies
  • Setup Webpack
  • Run web server
  • Run A-Frame example

Session 2: World Design

  • Place the holes
  • Place the moles (rodents)
  • Render Hammer in Player View

Session 3: Whack a mole core mechanics

  • Programmatically have rats pop up and down
  • Add Score Keeper Text
  • Animate Hammer when the mole is hit

Session 4: Finishing up the game

  • Add Game Timer
  • Present the user with the moles he hit after the timer finishes
  • Add ability to reset the game/timer and start again.

Reviews

Average rating

5(608 Reviews)
  • Avatar

    sergeimali1

    6 months ago

    VR can be quite confuzing, but watching this guy explain it gets very simple.

  • Avatar

    edwardmunch1

    6 months ago

    I've been trying to improve my VR skill, so here I am. Great tutorial.

  • Avatar

    sigurdfrost

    6 months ago

    VR games are the future, lets learn making them now