Difference between revisions of "Project2W21"

From Immersive Visualization Lab Wiki
Jump to: navigation, search
(Collisions (10 Points))
 
(53 intermediate revisions by one user not shown)
Line 1: Line 1:
=Homework Assignment 2=
+
=Homework Assignment 2: Covid Testing=
 
+
UNDER CONSTRUCTION
+
  
 
'''Prerequisites:'''
 
'''Prerequisites:'''
Line 9: Line 7:
 
* GitHub Repo (accept from [https://classroom.github.com/a/ar_khXbo GitHub Classroom link])
 
* GitHub Repo (accept from [https://classroom.github.com/a/ar_khXbo GitHub Classroom link])
 
* No VR equipment is required
 
* No VR equipment is required
 
<!--
 
  
 
'''Learning objectives:'''
 
'''Learning objectives:'''
  
* Wayfinding
+
* Creating wayfinding aids: signs, landmarks, map, pointer
* Image Plane Techniques
+
* First person view
 +
* Analog joystick simulation
 +
* Collision detection
 +
* Staying on the ground
  
 
'''Overview:'''
 
'''Overview:'''
  
In this project you are going to need to implement a simple game on social distancing. A deadly disease (much deadlier than COVID-19) has spread throughout the world and kills anyone who is within less than 6 feet (~2 meters) from an infected person that is not wearing a mask. The game is played in first person view in a 3D environment. People randomly spawn in front of the player, walking slowly towards them. The player's goal is to stare at them long enough for them to get reminded to put their mask on. If the person does not put their mask on before they get within 6 feet (~2 meters) from the player, the player gets infected and loses the game.
+
The scenario of this project is the following: Tessa is a freshman computer science student at UCSD. Because of Covid, she has never been to the campus before. In a few days she wants to visit her grandparents. To make sure she has not contracted the Coronavirus, she scheduled a time slot for a walk-up Covid test at the Price Center. Her friend dropped her off at the CSE building. Her test appointment is in 5 minutes, so she has no time to lose. Luckily she brought her brand new and stylish Apple AR glasses, into which she entered the destination: Price Center Ballroom West (see picture below).
  
Our TA Haoqi created a demo video for you: [[Media:CSE165W21-Project1-Demo.mp4|Social Distancing Demo]]. The buildings in the background are optional.
+
[[Image:PriceCenterBallroomWest.jpg|300px]]
  
We are going to give an introduction to this project in discussion on January 11th at 4pm. The due date for the project is Sunday, January 24th at 11:59pm.
+
To help her find the way you need to program wayfinding aids into the AR glasses, as well as set up wayfinding aids in the environment.
  
==1. Building the 3D Scene (30 Points)==
+
We are going to give an introduction to this project in discussion on January 25th at 4pm. The due date for the project is Sunday, February 7th at 11:59pm.
  
The only visible elements of your scene are going to be the infected people that are approaching the player, and the masks they put on when the player is successful at staring at them.
+
==Implementation==
  
We are looking for the following things in this part:
+
===Campus Model (10 Points)===
  
* Choose a 3D model from the Unity asset store that represents an infected person. (5 points)
+
Use this [http://www.calit2.net/~jschulze/tmp/engineering-campus-small.zip UCSD campus model] as the setting for your Unity application. The unit size is one inch, so you have to scale the model to match Unity's unit size, in order for the campus to show up life sized. Load it into your application along with the ground texture (which is part of the model).
* Also choose a 3D model for a face mask that you can put on the infected person. (5 points)
+
* Resize both to match your application's scale. Note that 1 unit in Unity equals 1 meter. (5 points)
+
* Create a collision box where the infected person's head is (or the collision box can cover the whole person). (5 points)
+
* Position the player in the scene so that the player is facing the spawn points in '''first person view'''. (10 points)
+
  
The figure below shows a '''top-down view''' of the 3D environment you are creating.
+
===Wayfinding Aids (60 Points)===
  
[[Image:project1-schematic.jpg|300px]]
+
Implement the following wayfinding aids:
  
==2. Gameplay (70 Points)==
+
'''In the environment:'''
 +
{| border="0" cellspacing="0"
 +
|- valign="top"
 +
| * Along the way from the CSE building, place at least '''five''' "Covid Testing" signs with an arrow to help pedestrians find the Price Center Ballroom. For inspiration for what these signs can look like, google "direction signs". The signs can all be of the same style or different styles. The signs need to be installed in a physically feasible way (e.g., they cannot float in the air, but need to be attached to buildings or a sign post). (10 points)
 +
| [[Image:CovidTestingSign.jpg|180px]]
 +
|- valign="top"
 +
| * Place at least '''one''' landmark along the way. The simplest would be to place this [[Media:bear_quads.zip|Warren Bear model]] in the courtyard between the CSE building and Atkinson Hall. Scale it to a reasonable size for a landmark. (10 points)
 +
| [[Image:BearPhoto.jpg|180px]]
 +
|}
  
* Start a timer to keep track of how long the player survives. (5 points)
+
'''In the AR glasses:'''
* Every few seconds, spawn a new infected person in one of the two spawn points (randomly selected). (5 points)
+
{| border="0" cellspacing="0"
* Have the infected person walk slowly along their walking trajectory. The person doesn't have to move their legs. (5 points)
+
|- valign="top"
* Draw 'crosshairs'/a 'reticle' (e.g., a small sphere) in the center of the screen, indicating the player's viewing direction. (10 points)
+
| * Display a mini map of the campus with current location and destination highlighted (e.g., by differently colored spheres) in forward up orientation in the top right corner of the screen. The map needs to remain in forward up orientation while Tessa walks to the Price Center, so it needs to be rotated accordingly. The current location also needs to be updated to Tessa's actual current location. (20 points)
* Allow the player to turn their head (i.e., the camera) with the mouse: support both left/right rotation and up/down tilt of the camera. (10 points)
+
| [[Image:Minimap.jpg|180px]]
* Change the color or shape of the crosshairs/reticle when it intersects an infected person's head. At this point also start a 2 second timer. You don't need to display the timer. (10 points)
+
|- valign="top"
* Once the 2 second timer is up, render a mask on top of the person's face. (5 points)
+
| * Display an arrow pointing to the destination ("as the crow flies") in the top left of the screen. This arrow can rotate in the plane of the screen, or in 3D space. It needs to constantly update to point to the Price Center Ballroom West. Feel free to use [[Media:arrow-cgtrader.fbx|this 3D arrow model]], or any other of your choice. (20 points)
* Detect when each infected person gets within 6 feet (~2 meters) from the player. If the person is not wearing a mask at this point, stop the game and display text such as: "You Survived <n> seconds." Show this message for a few seconds, then restart the game. (10 points)
+
| [[Image:NavigationArrow.jpg|180px]]
* Let the person keep walking until the de-spawn point, then destroy the game object. (5 points)
+
|}
* Tweak the game parameters (e.g., speed of the infected, frequency of newly appearing infected, size of collision box, sensitivity of mouse control of viewing direction) to make the game hard enough to be a challenge, but not too hard to be frustrating. (5 points)
+
 
 +
===Travel: Walking Around the Campus (30 Points)===
 +
 
 +
====Motion (20 Points)====
 +
To allow Tessa to walk around, implement a simulation of an analog joystick with the mouse:
 +
* Movement starts when the user clicks anywhere on the screen and holds the mouse button down: this mouse location is the starting point and needs to be memorized.
 +
* From this starting point, when the user drags the mouse to the right (while holding the button down), Tessa turns to the right. The more right the mouse is dragged, the faster the turn. Do the equivalent for mouse movement to the left of the starting point.
 +
* From the same starting point, when the user drags the mouse up on the screen, Tessa walks forward. The further up the mouse is moved, the faster Tessa walks. Allow walking backwards when the mouse is dragged down.
 +
* When the user lets go of the mouse button, the motion stops immediately.
 +
* The user always walks in the direction they're facing, and the user always faces the direction they're walking in.
 +
* Strafing (moving sideways) is not possible with this method.
 +
 
 +
====Collisions (10 Points)====
 +
 
 +
Turn the ground plane, as well as the buildings between the CSE building and the Price Center into colliders that cannot be traversed.  
 +
Make sure Tessa can't walk through buildings by checking for collision with the building colliders.
 +
 
 +
Also make sure Tessa stays on the ground wherever she goes (will not start floating above it or sink into it).
 +
 
 +
'''Notes:'''
 +
* Tessa should start at the main entrance of the CSE building, facing away from the building. The user of your application should see a first person view of what she sees (i.e., you do not need to have a visual representation of Tessa).
 +
* The destination is the Price Center Ballroom West. This is the ballroom at the top of the stairs next to the Amazon shipping center by the bookstore. To reach the destination, Tessa does not need to walk up the stairs (they are not part of the campus model anyways). It is sufficient that she reaches the Price Center courtyard.
 +
* Tessa does '''not''' need to get near or touch the signs or landmarks along the way. They are just "decoration" in the environment, meant to help Tessa find the way. But she can completely ignore them if she finds her way without them.
 +
* If you have played Roblox on the Ipad: The joystick interaction is just like the left thumb controller. Except that it's first person view.
  
 
==3. Extra Credit (Up to 10 points)==
 
==3. Extra Credit (Up to 10 points)==
  
* Add a [https://docs.unity3d.com/560/Documentation/Manual/HOWTO-UseSkybox.html '''Skybox'''] to your scene. You are free to use textures of your own choice. (5 points)
+
* Add a '''game mode''' to your simulation: display a stop watch on the screen. Start the stop watch when Tessa leaves the CSE building, stop it when she gets to the Price Center Ballroom. Show the current time along with the best run (since start of the app) and restart the game. (5 points)
* '''Trigger indicator''': add a visual indicator (no text) showing how long the user has stared at a person and how much longer they need to do it (5 points). Examples:
+
* Implement '''teleporting''' as an alternative to walking: when the user clicks on a location on the screen, Tessa teleports there. To be able to take turns and go back, you also need to implement a way to change the viewing direction: this could be done with the mouse while pressing the right mouse button (other ways are also acceptable). (5 points)
**Radial widget: [[Image:radial.png | x100px]]
+
* Implement '''flying''' as an alternate travel mode: switch into this mode with a keyboard key. In fly mode, use the mouse to set the direction (pitch and yaw) and keyboard keys to set the speed (no roll motion). (5 points)
**Slider widget: [[Image:slider.png | x100px]]
+
**Hexagons:      [https://www.youtube.com/watch?v=uTH9NCxNvZI Hexagons]
+
  
If you have your own ideas for extra credit, email us (TAs and/or instructor). If we approve additional extra credit options, we'll add them here.
+
'''Notes:'''
-->
+
In your demo video, make sure you mention what keyboard keys you're using for the additional functionality. Or add a readme.txt file to your submission with instructions for how to use the extra credit functionality. (We might need to run your executable and try out your extra credit functions ourselves.)
  
 
=='''Submission Instructions'''==
 
=='''Submission Instructions'''==
  
Once you are done implementing the project, record a video demonstrating all the functionality you have implemented.
+
Once you are done implementing the project, record a video demonstrating all the functionality you have implemented by showing Tessa walking from the CSE building to the Price Center Ballroom.
  
 
The video should be '''no longer than 5 minutes''', and can be substantially shorter. The video format should ideally be MP4, but any other format the graders can view will also work.
 
The video should be '''no longer than 5 minutes''', and can be substantially shorter. The video format should ideally be MP4, but any other format the graders can view will also work.
  
 
While recording the video, record your voice explaining what aspects of the project requirements are covered.
 
While recording the video, record your voice explaining what aspects of the project requirements are covered.
 +
 +
Make sure your mouse cursor is shown in the video.
  
 
To create the video you don't need to use video editing software.  
 
To create the video you don't need to use video editing software.  
Line 91: Line 117:
 
** Example 4: The base project is complete and I did '''z''' for extra credit.
 
** Example 4: The base project is complete and I did '''z''' for extra credit.
 
* '''Executable:''' Build your Unity project into a Windows .EXE file or the Mac equivalent and upload it to Canvas as zip file.
 
* '''Executable:''' Build your Unity project into a Windows .EXE file or the Mac equivalent and upload it to Canvas as zip file.
* '''Source code:''' Upload your Unity project to GitHub: either use the Unity repository initialized from [https://classroom.github.com/a/ar_khXbo GitHub Classroom] or any GitHub repository that you might set up on your own. Make sure you use the [[Media: UnityGitignore(Unzipped_it_into_root_of_unity_project).zip | .gitignore]] file for Unity that is included in the repo so that only project sources are uploaded (the .gitignore file goes in the root folder of your project). Then submit the GitHub link to [https://www.gradescope.com/courses/227179 Gradescope] by using 'Submission Method: GitHub', along with your Repository link and the respective GitHub branch. ('''Note''': GitHub Classroom is only for starter code distribution, not for grading. Since we don't have any starter code for HW1, you can set up your '''own''' repo with Unity .gitignore file we provided and submit to gradescope too.)
+
* '''Source code:''' Upload your Unity project to GitHub: either use the Unity repository initialized from [https://classroom.github.com/a/xk_KOV7p GitHub Classroom] or any GitHub repository that you might set up on your own. Make sure you use the [[Media: UnityGitignore(Unzipped_it_into_root_of_unity_project).zip | .gitignore]] file for Unity that is included in the repo so that only project sources are uploaded (the .gitignore file goes in the root folder of your project). Then submit the GitHub link to [https://www.gradescope.com/courses/227179 Gradescope] by using 'Submission Method: GitHub', along with your Repository link and the respective GitHub branch. ('''Note''': GitHub Classroom is only for starter code distribution, not for grading. Since we don't have any starter code for HW1, you can set up your '''own''' repo with Unity .gitignore file we provided and submit to gradescope too.)
  
 
In Summary, submit to Canvas with 1. Video and 2. Zipped Executable files (.exe, .dll, etc.), and submit to Gradescope with 3. Source Code.
 
In Summary, submit to Canvas with 1. Video and 2. Zipped Executable files (.exe, .dll, etc.), and submit to Gradescope with 3. Source Code.

Latest revision as of 11:43, 2 February 2021

Contents

Homework Assignment 2: Covid Testing

Prerequisites:

Learning objectives:

  • Creating wayfinding aids: signs, landmarks, map, pointer
  • First person view
  • Analog joystick simulation
  • Collision detection
  • Staying on the ground

Overview:

The scenario of this project is the following: Tessa is a freshman computer science student at UCSD. Because of Covid, she has never been to the campus before. In a few days she wants to visit her grandparents. To make sure she has not contracted the Coronavirus, she scheduled a time slot for a walk-up Covid test at the Price Center. Her friend dropped her off at the CSE building. Her test appointment is in 5 minutes, so she has no time to lose. Luckily she brought her brand new and stylish Apple AR glasses, into which she entered the destination: Price Center Ballroom West (see picture below).

PriceCenterBallroomWest.jpg

To help her find the way you need to program wayfinding aids into the AR glasses, as well as set up wayfinding aids in the environment.

We are going to give an introduction to this project in discussion on January 25th at 4pm. The due date for the project is Sunday, February 7th at 11:59pm.

Implementation

Campus Model (10 Points)

Use this UCSD campus model as the setting for your Unity application. The unit size is one inch, so you have to scale the model to match Unity's unit size, in order for the campus to show up life sized. Load it into your application along with the ground texture (which is part of the model).

Wayfinding Aids (60 Points)

Implement the following wayfinding aids:

In the environment:

* Along the way from the CSE building, place at least five "Covid Testing" signs with an arrow to help pedestrians find the Price Center Ballroom. For inspiration for what these signs can look like, google "direction signs". The signs can all be of the same style or different styles. The signs need to be installed in a physically feasible way (e.g., they cannot float in the air, but need to be attached to buildings or a sign post). (10 points) CovidTestingSign.jpg
* Place at least one landmark along the way. The simplest would be to place this Warren Bear model in the courtyard between the CSE building and Atkinson Hall. Scale it to a reasonable size for a landmark. (10 points) BearPhoto.jpg

In the AR glasses:

* Display a mini map of the campus with current location and destination highlighted (e.g., by differently colored spheres) in forward up orientation in the top right corner of the screen. The map needs to remain in forward up orientation while Tessa walks to the Price Center, so it needs to be rotated accordingly. The current location also needs to be updated to Tessa's actual current location. (20 points) Minimap.jpg
* Display an arrow pointing to the destination ("as the crow flies") in the top left of the screen. This arrow can rotate in the plane of the screen, or in 3D space. It needs to constantly update to point to the Price Center Ballroom West. Feel free to use this 3D arrow model, or any other of your choice. (20 points) NavigationArrow.jpg

Travel: Walking Around the Campus (30 Points)

Motion (20 Points)

To allow Tessa to walk around, implement a simulation of an analog joystick with the mouse:

  • Movement starts when the user clicks anywhere on the screen and holds the mouse button down: this mouse location is the starting point and needs to be memorized.
  • From this starting point, when the user drags the mouse to the right (while holding the button down), Tessa turns to the right. The more right the mouse is dragged, the faster the turn. Do the equivalent for mouse movement to the left of the starting point.
  • From the same starting point, when the user drags the mouse up on the screen, Tessa walks forward. The further up the mouse is moved, the faster Tessa walks. Allow walking backwards when the mouse is dragged down.
  • When the user lets go of the mouse button, the motion stops immediately.
  • The user always walks in the direction they're facing, and the user always faces the direction they're walking in.
  • Strafing (moving sideways) is not possible with this method.

Collisions (10 Points)

Turn the ground plane, as well as the buildings between the CSE building and the Price Center into colliders that cannot be traversed. Make sure Tessa can't walk through buildings by checking for collision with the building colliders.

Also make sure Tessa stays on the ground wherever she goes (will not start floating above it or sink into it).

Notes:

  • Tessa should start at the main entrance of the CSE building, facing away from the building. The user of your application should see a first person view of what she sees (i.e., you do not need to have a visual representation of Tessa).
  • The destination is the Price Center Ballroom West. This is the ballroom at the top of the stairs next to the Amazon shipping center by the bookstore. To reach the destination, Tessa does not need to walk up the stairs (they are not part of the campus model anyways). It is sufficient that she reaches the Price Center courtyard.
  • Tessa does not need to get near or touch the signs or landmarks along the way. They are just "decoration" in the environment, meant to help Tessa find the way. But she can completely ignore them if she finds her way without them.
  • If you have played Roblox on the Ipad: The joystick interaction is just like the left thumb controller. Except that it's first person view.

3. Extra Credit (Up to 10 points)

  • Add a game mode to your simulation: display a stop watch on the screen. Start the stop watch when Tessa leaves the CSE building, stop it when she gets to the Price Center Ballroom. Show the current time along with the best run (since start of the app) and restart the game. (5 points)
  • Implement teleporting as an alternative to walking: when the user clicks on a location on the screen, Tessa teleports there. To be able to take turns and go back, you also need to implement a way to change the viewing direction: this could be done with the mouse while pressing the right mouse button (other ways are also acceptable). (5 points)
  • Implement flying as an alternate travel mode: switch into this mode with a keyboard key. In fly mode, use the mouse to set the direction (pitch and yaw) and keyboard keys to set the speed (no roll motion). (5 points)

Notes: In your demo video, make sure you mention what keyboard keys you're using for the additional functionality. Or add a readme.txt file to your submission with instructions for how to use the extra credit functionality. (We might need to run your executable and try out your extra credit functions ourselves.)

Submission Instructions

Once you are done implementing the project, record a video demonstrating all the functionality you have implemented by showing Tessa walking from the CSE building to the Price Center Ballroom.

The video should be no longer than 5 minutes, and can be substantially shorter. The video format should ideally be MP4, but any other format the graders can view will also work.

While recording the video, record your voice explaining what aspects of the project requirements are covered.

Make sure your mouse cursor is shown in the video.

To create the video you don't need to use video editing software.

If you can't make any screen recorder work, just hold your phone in front of the screen and record with a steady hand.

Components of your submission:

  • Video: Upload the video at the Assignment link on Canvas. Also add a text comment stating which functionality you have or have not implemented and what extra credit you have implemented. If you couldn't implement something in its entirety, please state which parts you did implement and expect to get points for.
    • Example 1: I've done the base project with no issues. No extra credit.
    • Example 2: Everything works except an issue with x: I couldn't get y to work properly.
    • Example 3: Sections 1, 2 and 4 are fully implemented.
    • Example 4: The base project is complete and I did z for extra credit.
  • Executable: Build your Unity project into a Windows .EXE file or the Mac equivalent and upload it to Canvas as zip file.
  • Source code: Upload your Unity project to GitHub: either use the Unity repository initialized from GitHub Classroom or any GitHub repository that you might set up on your own. Make sure you use the .gitignore file for Unity that is included in the repo so that only project sources are uploaded (the .gitignore file goes in the root folder of your project). Then submit the GitHub link to Gradescope by using 'Submission Method: GitHub', along with your Repository link and the respective GitHub branch. (Note: GitHub Classroom is only for starter code distribution, not for grading. Since we don't have any starter code for HW1, you can set up your own repo with Unity .gitignore file we provided and submit to gradescope too.)

In Summary, submit to Canvas with 1. Video and 2. Zipped Executable files (.exe, .dll, etc.), and submit to Gradescope with 3. Source Code.