Difference between revisions of "Project1S20"

From Immersive Visualization Lab Wiki
Jump to: navigation, search
(Due Dates)
(Project (100 Points))
 
(23 intermediate revisions by 2 users not shown)
Line 3: Line 3:
 
In this first programming project you need to create a simple Whack-a-Mole game for your smartphone with your VR viewer.
 
In this first programming project you need to create a simple Whack-a-Mole game for your smartphone with your VR viewer.
  
The idea of the game is to find the highlighted sphere among a 2D array of spheres, and click on it. The player has one minute to click on as many highlighted spheres as possible.
+
The idea of the game is to find the highlighted sphere among a 2D array of spheres, and click on it. The player has 15 seconds to click on as many highlighted spheres as possible.
  
 
==Due Dates==
 
==Due Dates==
Line 9: Line 9:
  
 
Milestone #1: Fri, April 10 - Students should have a built and run an application on their chosen platform with a basic scene by now.
 
Milestone #1: Fri, April 10 - Students should have a built and run an application on their chosen platform with a basic scene by now.
 +
 
Milestone #2: Fri, April 17 - Students should have finished their scene and gaze interaction system and be working on core gameplay features
 
Milestone #2: Fri, April 17 - Students should have finished their scene and gaze interaction system and be working on core gameplay features
  
==Project Description (100 Points)==
+
==Project (100 Points)==
  
Download Unity and do a Unity tutorial. Learn how to make Unity apps for smartphones and build an app (any app at this point) that runs on your smartphone. (10 points)
+
Download Unity and do a Unity tutorial. Learn how to make Unity apps and get an app working (any app). (10 points)
  
 
We recommend this [https://drive.google.com/drive/folders/19zzHKyfQR75XGAFv-ElS-w5LQDKzcdBD?usp=sharing tutorial from our edX course CSE 190x].
 
We recommend this [https://drive.google.com/drive/folders/19zzHKyfQR75XGAFv-ElS-w5LQDKzcdBD?usp=sharing tutorial from our edX course CSE 190x].
Line 21: Line 22:
 
Here are step by step instructions for it:
 
Here are step by step instructions for it:
  
* Create a thin box that you use as a wall as the backdrop of your application. The wall's height should be approximately equal to your vertical field of view.
+
* Create a thin box that you use as a wall as the backdrop of your application. The wall's height should be approximately equal to your vertical field of view. (10 points)
* Take a picture of your surroundings (indoor or outdoor) with your smartphone and import it into Unity as a texture asset.
+
* Take a picture of your surroundings (indoor or outdoor) with your smartphone and import it into Unity as a texture asset. You are welcome to creatively process the image with an image processing tool. (10 points)
* Paste the picture onto the wall so that it faces the user.  
+
* Paste the picture onto the wall so that it faces the user. (5 points)
* Create and place a 3D array of 5x5 = 25 spheres in front of the wall. Each sphere should be the size of a tennis ball (0.07 meters '''diameter'''), and the balls' center points should be 0.14 meters apart from each other.
+
* Create and place a 3D array of 5x5 = 25 spheres in front of the wall. Each sphere should be the size of a tennis ball (0.07 meters '''diameter'''), and the balls' center points should be 0.14 meters apart from each other (horizontally and vertically). (15 points)
* Create C# code to highlight a random sphere in a different color.
+
* Create C# code to highlight a random sphere in a different color. (5 points)
* Create a cursor (eg, small sphere, line, etc) to allow the user to select a sphere by pointing their head at it.
+
* Create a cursor (e.g., a line, small sphere snapping to closest object, etc.) to allow the user to select a sphere by pointing their head at it. (15 points)
* Start the game when the user pushes the action button. This should start a 1 minute timer, which does not need to be displayed visually (see extra credit).
+
* Start the game when the user pushes the action button. This should start a 15 second timer, which does not need to be displayed visually (see extra credit). (5 points)
* When the user clicks the button on the viewer, check if they hit the highlighted sphere and if so draw a copy of the sphere above or off to the side of the play area as a counter for how many spheres have been hit.
+
* When the user clicks the button on the viewer, check if they hit the highlighted sphere and if so draw a copy of the sphere above or off to the side of the play area as a counter for how many spheres have been hit. (10 points)
* Un-highlight the selected sphere and highlight a different one.
+
* Un-highlight the selected sphere and highlight a different one. (5 points)
* Repeat the above until the timer is up. Then highlight all spheres at once.
+
* If the user clicks on a sphere other than the highlighted one, the click should be ignored. (5 points)
 +
* Repeat the above until the timer is up. Then highlight all spheres at once. (5 points)
 +
 
 +
Here's a mock-up of what the game could look like:
 +
 
 +
[[Image:project1-mockup.jpg|500px]]
 +
 
 +
Once you are done implementing the project, try to get it working on your phone with your VR headset. This part is optional.
 +
 
 +
Finally, record a video off the screen while you play the game from start to finish. Make sure you include a shot of your final score. Upload the video to Canvas by the deadline. Also, add a comment stating which parts of the project you got done or didn't get done.
 +
 
 +
To create the video you don't need to use video editing software, but you should use software to capture your screen to a video file. To record off your desktop computer, we recommend [https://obsproject.com/ OBS Studio], which is available free of charge for Windows and Mac. For smartphone recording these tips may be useful:
 +
* On Iphones screen recording should be easy [https://support.apple.com/en-us/HT207935 with these instructions].
 +
* Newer Samsung Galaxy phones with the Game Tools feature have a built-in screen recording mode that is disabled by default. Find out [https://www.androidcentral.com/how-use-game-tools-samsung-galaxy-s7 here] how to enable and use it.
 +
* The [https://play.google.com/store/apps/details?id=com.rsupport.mvagent Mobizen Screen Recorder app] should work on any Android phone. The free version comes with a watermark, which is acceptable.
  
 
==Extra Credit (Max. 10 Points)==
 
==Extra Credit (Max. 10 Points)==
Line 36: Line 51:
 
Options for extra credit are:
 
Options for extra credit are:
  
* Display text in the app:
+
* Display text in the app (10 points):
 
** Instead of displaying the score as a number of spheres, display the number of "whacked moles" as text within the VR environment.  
 
** Instead of displaying the score as a number of spheres, display the number of "whacked moles" as text within the VR environment.  
 
** Display a message prompting the user to start the game
 
** Display a message prompting the user to start the game
 
** Display a countdown timer that shows the remaining seconds in the game
 
** Display a countdown timer that shows the remaining seconds in the game
** Display a message that the game is over, along with the number of correctly clicked spheres. (10 points)
+
** Display a message that the game is over, along with the number of correctly clicked spheres.
 
* Instead of (or in addition to) highlighting the sphere that is to be clicked on, wrap a picture of a mole around it as a texture (5 points), or find (5 points) or create (10 points) a 3D model of a mole and load it instead of the spheres (10 points).
 
* Instead of (or in addition to) highlighting the sphere that is to be clicked on, wrap a picture of a mole around it as a texture (5 points), or find (5 points) or create (10 points) a 3D model of a mole and load it instead of the spheres (10 points).
 +
* Add sound effects to your game (5 points).
 
* New game play: come up with a game that also involves clicking on things but is more fun than the homework project. (up to 10 points)
 
* New game play: come up with a game that also involves clicking on things but is more fun than the homework project. (up to 10 points)

Latest revision as of 10:25, 14 April 2020

Contents

VR Whack-a-Mole

In this first programming project you need to create a simple Whack-a-Mole game for your smartphone with your VR viewer.

The idea of the game is to find the highlighted sphere among a 2D array of spheres, and click on it. The player has 15 seconds to click on as many highlighted spheres as possible.

Due Dates

Project due date is Sun, April 19 @ 11:59 PM PST

Milestone #1: Fri, April 10 - Students should have a built and run an application on their chosen platform with a basic scene by now.

Milestone #2: Fri, April 17 - Students should have finished their scene and gaze interaction system and be working on core gameplay features

Project (100 Points)

Download Unity and do a Unity tutorial. Learn how to make Unity apps and get an app working (any app). (10 points)

We recommend this tutorial from our edX course CSE 190x.

Use Unity to develop a VR application for your smartphone which implements a simple Whack-a-Mole inspired game.

Here are step by step instructions for it:

  • Create a thin box that you use as a wall as the backdrop of your application. The wall's height should be approximately equal to your vertical field of view. (10 points)
  • Take a picture of your surroundings (indoor or outdoor) with your smartphone and import it into Unity as a texture asset. You are welcome to creatively process the image with an image processing tool. (10 points)
  • Paste the picture onto the wall so that it faces the user. (5 points)
  • Create and place a 3D array of 5x5 = 25 spheres in front of the wall. Each sphere should be the size of a tennis ball (0.07 meters diameter), and the balls' center points should be 0.14 meters apart from each other (horizontally and vertically). (15 points)
  • Create C# code to highlight a random sphere in a different color. (5 points)
  • Create a cursor (e.g., a line, small sphere snapping to closest object, etc.) to allow the user to select a sphere by pointing their head at it. (15 points)
  • Start the game when the user pushes the action button. This should start a 15 second timer, which does not need to be displayed visually (see extra credit). (5 points)
  • When the user clicks the button on the viewer, check if they hit the highlighted sphere and if so draw a copy of the sphere above or off to the side of the play area as a counter for how many spheres have been hit. (10 points)
  • Un-highlight the selected sphere and highlight a different one. (5 points)
  • If the user clicks on a sphere other than the highlighted one, the click should be ignored. (5 points)
  • Repeat the above until the timer is up. Then highlight all spheres at once. (5 points)

Here's a mock-up of what the game could look like:

Project1-mockup.jpg

Once you are done implementing the project, try to get it working on your phone with your VR headset. This part is optional.

Finally, record a video off the screen while you play the game from start to finish. Make sure you include a shot of your final score. Upload the video to Canvas by the deadline. Also, add a comment stating which parts of the project you got done or didn't get done.

To create the video you don't need to use video editing software, but you should use software to capture your screen to a video file. To record off your desktop computer, we recommend OBS Studio, which is available free of charge for Windows and Mac. For smartphone recording these tips may be useful:

  • On Iphones screen recording should be easy with these instructions.
  • Newer Samsung Galaxy phones with the Game Tools feature have a built-in screen recording mode that is disabled by default. Find out here how to enable and use it.
  • The Mobizen Screen Recorder app should work on any Android phone. The free version comes with a watermark, which is acceptable.

Extra Credit (Max. 10 Points)

Options for extra credit are:

  • Display text in the app (10 points):
    • Instead of displaying the score as a number of spheres, display the number of "whacked moles" as text within the VR environment.
    • Display a message prompting the user to start the game
    • Display a countdown timer that shows the remaining seconds in the game
    • Display a message that the game is over, along with the number of correctly clicked spheres.
  • Instead of (or in addition to) highlighting the sphere that is to be clicked on, wrap a picture of a mole around it as a texture (5 points), or find (5 points) or create (10 points) a 3D model of a mole and load it instead of the spheres (10 points).
  • Add sound effects to your game (5 points).
  • New game play: come up with a game that also involves clicking on things but is more fun than the homework project. (up to 10 points)