Sword Art Online VR UI

Unity 3D -- C#

▚ Project summary:

In this project I wanted to re-create the UI from sword art online for the HTC-Vive!

I wanted to gain more experience with using external hardware, specifically VR hardware. I chose to use the HTC-Vive because of the extensive mobility and easy to use Unity extensions.

For this project, I mainly focused on implementing a already existing UI design from a specific serie I used to watch. By doing this, I would be able to focus on the implementation instead of coming up with a good design. 

Making sure everything works properly regarding VR interactions with Unity Canvas UI was a fun challenge. 

▌Specifications:

Released: September 2017
Project type: Personal project
Platform: PC, Windows
Time spent on project: 1 week
Engine and Tools: Unity - C#

▌My contributions:

○ Full UI asset creation and implementation
○ All feature programming and UI interaction
○ All HTC-Vive custom interaction and custom handling (using unity inbuilt VR support).
○ Simple object interaction and item inventory system (VR focused).

▌Project goals:

○ Learn more about how to realize a VR game using Unity.
○ Improve my skills in writing C#.
○ Implement a fully working replica of a popular UI design, for a VR game environment. 

Project Github Link

▚ Details:

For the basic UI features, I created a working button interaction system, which would highlight the pressed interactive button and enable the right referenced sections. When pressing another UI button/section. The system disabled the previously selected UI sections and opened up sub UI sections. 

This was made in mind, to support many different sub UI items to be opened for each button.

To recreate the UI functionality from the series, I mainly wanted to replicate 3 key features that are shown in the well known series. 
First, I implemented the enable/disable UI with a controller touch swipe. 
Making a custom swipe recognition was done by checking the changed touch coordinate under a specified timeframe. This was then used to disable or enable the UI. 

I Implemented the menu to have two specific orientation modes. the first makes the full UI canvas follow my sight, and the second mode makes the full UI canvas stand still in open space, Using the last view to world position. 
The second (world placement mode), helped with being able to properly interact with interactables from the world, while not having the UI constantly in your view. 

The last implemented feature was a small inventory feature, where Items could be added to the player's inventory. This inventory could then be seen through the interactive UI sub items (which was a working scrollable list, using VR controller as input).

▚ Closing thoughts:

I learned a lot from this project, and although not finished, I was able to gain experience using external VR hardware, gain more experience writing C# and gain more experience creating working and interactive UI systems.

Project Github Link