AMPD has been architecting high-performance computing infrastructure for nearly two decades. They aim to bring the VR Battle Arena: Mortal Blitz game to North America.
Working with AMPD, SKonec Entertainment, and Greenstone Business Service Ltd, our team developed a turnkey solution aimed at optimizing the process of implementing VR gaming setups in Esports events and arcades. The goal was to improve the experience for operators of Battle Arena reducing both the time and technical knowledge required during setup.
The second part of this project is to create and conduct user tests for the installation of the software, as well as a gameplay demo, providing suggested design changes to our clients.
*Additional project details under NDA.
My Roles
UI/UX, Graphic Designer & Video Editor
Designed software interface and conducted user testing.
Synthesized and analyzed testing data for further iterations.
Created a series of diagrams and storyboards for interfaces and features.
Created instructional and promotional videos.
Software Used
Application Walkthrough
Solution
There are two major parts to our solution. It is an Integration software which intuitively optimizes:
Hardware deployment process. (A detailed setup guide).
A new software that can manage installation, operation and game managing.
Personas
Mainly arcade operators who have some knowledge of hardware and software. They will not have a lot of people to help set up.
When using personas for product design, as opposed to marketing, I find it best to create two primary personas. Because this is a B2B product, I decided to create two personas who the product was tailored to. it would also satisfy most of the requirements of our clients.
Part 1: Hardware deployment process
For this phrase, we are focusing on the hardware setup. SKonec has given us a PDF of the physical setup guide in Korean. First, we have to translate the guide to English. We used google translate and a native Korean friend to help us. After the translation, we decided to record a time-lapse video of our first setup and record all the problems we encounter. Everyone on our team has the knowledge of setting up computers, but none of us have set up a multiplayer VR game with 4 HTC Vives before, so this is also a challenge for our team. We are very lucky that CDM was able to give us the Hangar space we needed to set up the 20x20ft play area for our project. All the equipment was provided by AMPD and CDM. The only thing we couldn’t get ahold of was the Truss, but we decided to go with what materials and equipment we have to test.
Part 2: Software Installation/Validation/Operation
This part is broken into two sections: Hardware Optimization and Software Optimization.
a. Hardware Optimization
We started with the Korean setup PDF guide that SKonec have sent us. We looked into different types of installation guides from digital (eg. printer installers) to physical guide (eg. IKEA product building guides).
Our setup guide was inspired by IKEA’s installation instruction books. We compared the difference between the Korean VR Setup guide and IKEA’s guide. The major difference is that the Korean VR Setup instructions use images to explain instead of diagrams. I decided that we can implement 2D diagrams in our new installation guide.
Our New Guide:
In English (Originally only in Korean).
Systematic Procedure with detailed and clean Illustrations.
Create overviews for each section so the operators can look at the setup before going into each detailed part.
Hardware Connection: First our software needs to show the operator how to connect all the hardware and set up the space needed for the game. This shows the step by step installation guide.
Testing Hardware (Diagnostics): This needs to pair the player computers with the server computer. The diagnostics show if the hardware is connected and running.
Game Setup: This is when the operator installs the game and manage the games
Client Setup: This is where the configurations and analytics go.
Features
Installation & Troubleshooting Setup Guides
Remote Deployment & Operation
Real-Time System Monitoring & Diagnostics
Game Management & File Optimization
Web ready for different devices
Wireframe & Prototypes
User Interface Design
For the application user flow, we want to make sure they can navigate around easily. We separate the whole procedure into 3 main sections: Installation guide, diagnostics, and game management. There are other elements such as icons on the right to indicate if the computers are connected or not.
First, we decided where the main tabs should go, on the left or top. Other elements are placed according to the main tabs. Here are all the elements:
Main Tabs: the core steps include Installation Guide, diagnostics, and game management.
Installation Guide: The whole guide of setting up the hardware, play area, and the game. This goes into the Installation Guide tab.
Diagnostics: This gives the details of all the client computers and HTC Vives that are connected. This is in the diagnostics page.
Game Installation: Install the game easily and manage the game from the server computer with simple button clicks.
Full-screen Views: this is when users click to see all the screens
Prototype
With the two wireframes created (shown above). We asked a few users to click through and give some feedback. The following are the major implementations:
They like the menu on the left more.
The icons indicating each computer are good.
Suggestion of hover over the computer icons to give a small update of that computer.
Black background is not a good idea for the installation guide. Prefers white/lighter one.
Clean and detailed installation diagrams.
On Top of the prototype testing, we also have playtesting for the physical setup. Our Client was happy to bring their partners and clients to come test out our setup.
High-fidelity Prototype
After creating wireframes and flowcharts, I went into creating the mockups. With interactive product design, I prefer not to treat the visual design stage as the end of the design process. This is because interaction, device, animation, and physical context also plays an important part in the finishing of the final product design.
User Testing
I conducted a user test with the mockups. The test consists of tasks that the user has to click through. After the tests, they are asked to rate the tasks' difficulty level, a few questions asking for their thoughts and suggestions.
After the user test with the digital mockup, we rewarded them with a few rounds of playing the VR game at our physical setup. It was a huge success, even our client would bring their partners and clients to test out our setup. We also got some in-game feedback from the playtests. By the end of all the user tests, we provided the collected feedback and suggestions to SKonec for their game development.
Unexpected Challenges & Limitations
A huge part of this project relies on the physical setup of the game. Due to COVID-19, we had to adjust and conduct user testing remotely. The main limitation we had was that we couldn't test the full physical setup due to COVID-19. Therefore, the truss installation guide was not changed from the original Korean guide other than translating it from Korean to English. We try to use our own experience we gained from setting up the other parts to further refine the guide on that section.
Personal Growth
We worked hard to finish the development in only 4 months! We even accomplished the stretch goal of developing a functional game deployment & management software within the given time frame.
I had the opportunity to meet people from the ESports and Game industry. To have the chance to showcase this project was a great experience. Our client was very happy with our final product and brought in their potential clients to test our setup. Receiving good feedback and seeing how this project is a good step to open the VR experience in arcades in North America is a huge gain to our knowledge and experience.
Want To Get In Touch?
Drop me a line anytime at the email below and I'll get back to you as soon as I can!
