Industry Sponsored Project • AR Game • UI/UX

BragiCreating Augmented Reality game to expand consumer base

Time

Apr. 2021 - Aug. 2021

Tools

Figma, C4D, Spark AR, Protopie, Adobe premiere

Team

Collaborated with Simian He

Responsibilities

AR Product Designer. I was actively involved in all the processes of this project.

Project Summary

Bragi is the 3D-printed customized glasses company that tailors the glasses frame through 3D face scanning and 3D printing to provide accurate optical corrections and comfortable and light wearing experiences for users. Their service channel mainly depends on cooperative off-line stores, which is difficult to achieve rapid user growth.

For this project, I helped create the whole service strategy. We designed an AR game to convey the value of the brand and their products to potential customers, and establish a connection between online experiences and offline retail stores.

01. overview

01. overview

01. overview

01. overview

01. overview

01. overview

[ What’s Tales AI and what did I do for this project? ]

The Problem
HMW expend Bragi's consumer awareness and engagement in an interesting way?

Story books have long served as a way to expose children to limitless creativity and teach them the moral ethics of the world while building vocabulary and encouraging conversation and engagement. Unfortunately, these stories lack involvement (not personalized) and creativity that can be helpful in the growth and development of children.

Solution
An online AR game to expand the market and connect customers and offline-stores.

01. Began the Journey and choose an eyewear.

The layout design is based on common non-professional design tools, making map editing easy to start.

02. Know benefits of Bragi’s eyewear and get coupons through the game.

The layout design is based on common non-professional design tools, making map editing easy to start.

03. Check the sprites you have and choose one to release

The layout design is based on common non-professional design tools, making map editing easy to start.

04. Link to offline eyewear stores

The layout design is based on common non-professional design tools, making map editing easy to start.

02. Research & Ideation

02. Research & Ideation

02. Research & Ideation

02. Research & Ideation

02. Research & Ideation

02. Research & Ideation

[ How did we find the problem and define the design scope? ]

Context
The Business of BRAGI

Bragi is the 3D-printed customized glasses brand of Nanjing Jianjie Intelligent Technology Co., LTD.It tailors the glasses frame through 3D face scanning and 3D printing to provide more accurate optical corrections and more comfortable and light wearing experiences for users.

Value Propositions

Key Partners - Eyewear retail stores

Customer segmentation

Eyewear retail stores are Bragi’s most important sales parterners. Customers could access Bragi’s custom services on the terminals built in those offline stores. Each sale of a Bragi’s frame would bring proceeds to the retailor from three main aspects:1. Sales commission from Bragi; 2. Lenses sold with the frame; 3. Optometry and assembling services.

People who prioritize optical comfort and mechanical stability of eyewear are our targeted consumers.They are most likely to pay for custom frames or other prescription glasses.

Problem Space
BRAGI‘s service channel mainly depends on cooperative off-line stores, which are not controlled by BRAGI, so it’s difficult for them to expand the market.

According to the analysis of Bragi's existing business model, it can be found that:

1. Bragi has a single service channel for customers, and the online and offline experiences are incoherent.
2. It is difficult to accumulate and precipitate consumers, and it is difficult to achieve fission and secondary sales.

DESIGN STRATEGY
Rebuilding channels to establish a closed-loop of customer experience

Our team focuses on the online experience that could convey the values of Bragi’s products, enhance customers’ engagement, expand to potential customers, build up brand awareness and customers’ advocacy.

User Research
A survey about engagement and brand awareness

Purpose - To know consumers’ understanding of 3D-printed eyewear and the brand of BRAGI.

Since we have limited knowledge of consumers, sending out a survey allows us to collect data from a broader range of people. Therefore, we first conducted a questionnaire about eyewear to investigate consumers' pain points and Bragi's product. By analyzing 585 effective responses, we find the following critical information:

Persona
Define our target users

In order to expand engagement and brand awareness, our design should focus on those who have the largest potential to spread, instead of those who actually need to purchase eyewear. So our target users should be active social network users who have the personality of sharing.

Ideation
Challenges we’ve met...

How to let more people know about custom 3D-printed eyewear?
How to deliver the value of custom 3D-printed eyewear?
How to improve the brand recognition of Bragi?

After brainstorming, we generated following ideas. We want to design an AR game that can be easily spread by users, through which users can have fun, know more about Bragi, and understand the benefits brought by 3D-printed eyewear.

Why we choose AR?

Design Prompt
We can design an AR game that can be easily spread by users, through which users can have fun, know more about Bragi, and understand the benefits brought by 3D-printed eyewear.

Case Study
What are the characteristics of widely circulated games?

After compairing several popular games, we concluded that they have following common traits:

03. Experience Design

03. Experience Design

03. Experience Design

03. Experience Design

03. Experience Design

03. Experience Design

[ How did we find the problem and define the design scope? ]

Wireframes
The general online experience

Based on the research and our idea, we draw wireframes of the main interfaces and made a low-fi prototype to visualize the whole experience journey.

Game Design
How to play the game?

Based on the research and our idea, we draw wireframes of the main interfaces and made a low-fi prototype to visualize the whole experience journey.

Responding to BRAGI's pros

User Flow

Scene & elements design

To make consumers know more about 3D printed eyeglasses. Help the Bragi company build brand trust, the design of the scene is based on the process of the production of eyeglasses in Bragi’s factory.

The shape of eyewear is inspired by Bragi’s logo. Based on the technology of 3D-Printing, Bragi can realize fresh and innovative eyewear designs. So, the design of virtual eyewear tends to look different from common eyeglasses.

04. Prototyping & Testing

04. Prototyping & Testing

04. Prototyping & Testing

04. Prototyping & Testing

04. Prototyping & Testing

04. Prototyping & Testing

[ How did we find the problem and define the design scope? ]

PROTOTYPING & USER TESTING
Rapid prototype

We designed an interactive prototype via Spark AR. By using the face tracker in this platform, we explored several interactions, including tapping, waving heads, raising eyebrows, open the mouth and etc.

User Feedbacks

1. The gift package is very attractive, users may share and play this game to win coupons, so can increase the importance of gift packages.
2. The game is funny, but it’s a bit easy, cause there are not many obstacles.
3. It is inconvenient to wave hands while holding the smartphone, so this interaction should be replaced by another one.

Interaction design
Core Interactions

Considering users feedbacks, we finally build and iterate following AR interactions:

1. Wave the head to change glasses

2. Move the head to drag glasses through obstacles

Users have several chooses of eyewear, they can wave heads to change the eyewear they like at the beginning of the game.

Obstacles are at the top and bottom of the screen, and they will move from right to left. Users should move their heads to drive the glasses to move through obstacles.

3. Open the mouth to eat gift packs

4. Raise eyebrows to pull the glasses

Gift packs will appear randomly. The user needs to open her/his mouth and eat the gift pack. And then, the gift pack will disappear.

The glasses will slide off randomly, and the screen will become blurred. The user needs to raise eyebrows to drag the glasses. Then, the glasses will return to previous position and the screen will become clear.

05. Final Design

05. Final Design

05. Final Design

05. Final Design

05. Final Design

05. Final Design

[ How did we find the problem and define the design scope? ]

Final Delivery
User‘s journey from discovering to spreading

Next Project
FireVizVR