top of page

Botlab

Sponsored by National Robotic League(NRL)

Academic Project

Instructor: Mike Christel, John Dessler

Time Span: 12 weeks, May 2019

Contribution: Research, Interaction Design, Prototyping

Team Members: Meng Wan, Jehan Sandu, Trisha Surve, Kangyan Li, Guanghao Yang

Overview

AN AR COMBAT ROBOTICS SIMULATION EXPERIENCE ON TABLET

BotLab is a capstone team project sponsored by National Robotics League(NRL). We have been tasked with developing a tablet-based experience with AR integration to involve more audience getting interested in combat robotics and NRL's training program. This experience will be targeted towards middle school aged 11-14 and will serve as an introduction to the battle bots.

ETC-Logo-wNewCMU-8.28 (2).png
nrl_logo.png

OUR CHALLENGE

Make people get interested in combat robotics

Our Client NRL hopes us to design and build an engaging application with AR integration in 12 weeks which could attract people to get into their program or become a partner as much as possible, which means this project has a large range of target audience.

 

HOW TO DEFINE OUR SUCCESS

1221.png
botlab-title.jpg

Design Process

2232.png

Demo 

Due to the production period scope, we were able to build a mid-fidelity demo based on our design in 7 weeks. Thanks to all team members making this happened, especially our solo programmer👨‍💻

frame.png

Design Pillars

Based on our research and ideation, we have 3 design pillars leading us to reach our final project goal. We were building a combat robotic simulation AR experience as a vertical slice of NRL program for promotion.

pillars.png

Target Audience

We came to Cornell Middle school to have our preliminary research. What we want to get from this research is we want to figure out which part is the most exciting moments for kids during the design and building process.

Persona Color #1.jpg
Persona Color #2.jpg

User Journey

BALANCE "LEARN" AND "FUN"

As an experience including educational purpose, especially designed for kids, the interest curve and pace should match with their features really well. For our preferred future, the kids who play with Botlab would really enjoy the time they spend and also have takeaways in combat robot and manufacture field.

Journey Map Style #3_1x.jpg
The whole experience could be divided into 6 phases: onboarding, showcase room, bot selection, customization, movement testing and battle, which covers almost all kinds of activities inside of NRL program. 

Key Screens

frame.png

Splash screen

Using the brand color gold and blue of our client NRL, we made this title screen as the beginning of the whole experience, which also includes the NRL promotion info besides the entry of experience.

 

Onboarding

It's helpful to use conversational UI to as a medium to:

  •  immerse users into the context

  •  request their access of camera

  •  guide user to set up AR world

I also made a sex-neutral robot standing aside, which make the interface more vivid.

frame.png
Onboarding2.jpg
Onboarding3.jpg

Use conversation to present the context and tips.

Also ask for camera access.

onboarding4.jpg

A transition screen from 2D interface to AR interface.

onboarding5.jpg

Lead users to get into next phase experience.

At the first stage, users go into the showcase room of Botlab. We present 3 classic battle bots which are the required knowledge inside of NRL series courses as pre-build bots options.

 

Showcase - selection

showcase3.jpg
showcase2.jpg
frame.png

The three prebuild bots are spinning by themselves in a showcase room and waiting user make a choice with tapping on it.

The enemy info is also present in this scree- real winner of 2017 NRL national competition battle.

When users move closer to the bots, all the buttons will disappear and the bot will open up and show the interior structure.

Users could use the reticle in the center to point on different components, the info of that part of components will pop up with name, function description and parameter info.

 

Apr-08-2019 18-36-53.gif
frame.png
showcase4.jpg
showcase5.jpg

After tapping one bot, it will come closer to the user and spin automatically towards the user with components name tags floating around.

If user approaches the virtual bot, it will open up. The system will remind user that moving back and forth to trigger different states.

Apr-08-2019 20-52-16.gif
frame.png

Encourage movement

We detect the distance from bot to user and trigger the bot animation.

Similarly, if the user steps back, the bot will close up and all the 2D UI elements will come back on the screen. We use motion of UI elements as a metaphor of "exploration" mode.

Before the battle, users have opportunities to customize their bot within different kinds of components with up to 3 materials. To learn about components with different components and select the right material are also the gist of NRL program.

Apr-08-2019 21-04-18.gif
frame.png
showcase7.jpg
showcase8.jpg
showcase9.jpg

1. User select one component type from the menu on the right side.

2. User chooses one specific component with an effect of that component highlighted.

3. Clicking one component, the list of available materials will pop up.

Apr-08-2019 21-33-16.gif
frame.png

Battle

The battle is also a significant phase inside of NRL competition. After customization, users could bring their bots to battle with the winner WildaBeast- an AI bot. To follow the interest curve, we made the first round of battle as an easy mode for users to win and the second round as a difficult one.

battle2.jpg
battle1.jpg
testing.jpg

1. Before the battle, the user needs to pass the movement testing to get familiar with control and weapon.

2. The control system is in the vertical middle of the screen, which is the most comfortable for the target audience to hold.

3. After winning the first round, the user is leading to come back to showcase room preparing for the next round.

Process Documentation

Preliminary Research

We came to Cornell Middle school to have our preliminary research. What we want to get from this research is we want to figure out which part is the most exciting part for our target audience.

IMG_3939.JPG
IMG_3972.JPG

Secondary Research

In this time, we invited the expert in the bot-manufacture field and tried to have an in-depth background knowledge. Joe won NRL competition four times and he is good at design battle bots. We got lots of really valuable input from them about the bots-building process and interior placement of each components.

IMG_4063.jpg
IMG_3488.JPG

Ideation

Takeaways

1. Design for user's environment

223Artboard.png

With 3 main using scenarios, we delivered a design solution like above. The using environments are noisy and distracted so we didn't look forward to the whole experience as a purely "learning process". Following the features of environments, we decide to make the whole interest curve as a fast-paced combination of movement and peace.

For the educative goal, we take advantage of reality space to make kids moving and we believe this design decision on proximity to virtual objects could make kids get more immersive into the experience and also create a "wow" moment.

2. Encourage User's Movement

Enlight924.JPG
IMG_0164.JPG

“That's so cool!”

“See? I'm holding it!”

bottom of page