Week 12 – 15.12 Office Scene Design & Dev

Player Flow

When the game starts, the user sits at their desk and, while observing their surroundings, Teams notifications from the boss pop up on the computer screen. The notification explains the task information for the game protagonist designer, which is to use AI to generate 300 posters. When the user tried to move the mouse and click the generate image button fo the Stable Diffusion, the computer malfunctioned and the screen started flashing, causing the designer to be sucked into the screen.

Teams notifications from the boss
 Mouse Interactions
Being pulled into the screen 1
Being pulled into the screen 2

Key Interaction and Technical Implementation

Mouse Interaction

The main interaction in this office scene is the mouse interaction on the desk. Firstly, the basic grasping of mouse objects is achieved using the grasping component in the meta xr interaction SDK. Then use the One Grab Translate Transformer script in the meta xr interaction SDK to restrict the mouse’s movement range to the desktop.

In order to control the cursor on the screen by moving the mouse, I use AI to write a cursor controller script to obtain references between the mouse object and the cursor object on the screen. When the mouse moves, the cursor on the screen will also move accordingly. This script is only enabled when the mouse is gripped by hand, saving performance.

Mouse interaction
Mouse interaction technical implementation
Mouse interaction technical implementation

Portal Transition to Digital World

The transition from the office reality scene to the virtual Windows digital world is crucial in this scenario. In order to make transitions more natural and seamless between scenes, I use portal transitions in VR. When the user moves the mouse, the transition will be triggered.

Firstly, the computer screen will start flashing, indicating that the designer’s computer has encountered an error. Then, the wallpaper on the computer screen turns into a 3D world, with large characters of 0s and 1s flying out from it. Finally, the user is sucked into the screen and automatically moves to the virtual scene on the screen, regardless of their position.

Portal transition to digital world 1
Portal transition to digital world 2

The portal of the computer screen itself is implemented using a stencil layer, and all objects in the Windows digital world scene on the computer are labeled as stencil layer tags. At the same time, a depth only layer material is used to filter out all objects in the office, and a stencil layer is used to control the display of only objects in the Windows virtual world. In this way, users can see the 3D virtual world inside the screen through the computer screen.

I wrote a VR Portal Teleporter script using AI to control the movement of users during the teleportation process. When the portal transition starts, regardless of where the user is, it will be moved towards the position of the computer screen. When user collide with screen objects, objects in the hidden real office world and objects in the virtual Windows digital world achieve scene transformation.

 Portal transition technical implementation
Unity Animation
Unity State Machine

Environmental Interactions

In addition to key interactions, I have also added some environmental interactions to the office environment, such as using VR controllers to pick up objects on the desktop.

Environmental Interactions

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *