top of page
錨點 1

R&D AR EXPERIENCE DESIGN

2021 Happy New Year AR Experience

2021 Happy New Year AR Experience

This is the AR holiday experience I created to celebrate the new year 2022.

I started working on this project all by myself, had a lot of fun while modeling, rigging, animating, and creating the AR prototype.

This experience was first been tested on the Apple Reality Composer, to help me better understand the model scale I want to build and simulate the user experience.

After showing the prototype internally to my coworker, I'm lucky enough to get support from the developers! It also helped me to communicate with Bluecadet's amazing developers easily in visual.

With the developers' help, we put this AR experience on to 8 walls, and made it become a web-based AR experience!
So people don't need to pre-download any software. All you need to do is to click the link or scan the QR code, and, (o゜▽゜)o☆[tada!] you can check this AR on your own cellphone!

BC qr-01.jpg

If you like to try this experience.

Please use your cellphone to scene the QR code in this image, and you should be led to a web page to open up this AR experience.

I hope you will enjoy it :)

I started this project by creating the sketches.

After picking out my favorite sketch, I sent my concept idea, sketch, and rough time estimate to my manager to get their approval.

Screen Shot 2022-01-23 at 5.01.35 PM.png
Screen Shot 2022-01-23 at 4.53.25 PM.png
SKETCH-01.jpg

Because I have already drawn out the sketch and listed out all the things I need to create for the experience, the model creation and texturing part productions are very smooth.

Here are some WIP photos:

PROGRESS-01.jpg
PROGRESS-02.jpg

However, I did meet some problems when I start applying the rigs to my gingerbread men.

The 3D software I'm using is Blender (super powerful, but I'm new to it.)

When I tried to use "auto rig" to rig my gingerbread man, it became a monster mesh.

$RHZME7H.jpg
$RKQ1X6Z.jpg

By searching around the online tutorials, and checking my own model, I finial fingered out the reason why the mesh will get messed up.

     - My gingerbread man's pose is NOT a T-pose.

     - I add too many layers to the gingerbread man but didn't tell the system, which part belongs to which rigging area. So It's hard for the system to know how to paint weight to the mesh.

After knowing where the issues are, I grouped all the points to different areas and painted weight manually.

After solving the Rigging problem, the next step is to do the animation.
Because at this point, the developers I know are still super busy, I have to plan out the worse case: do the whole project on my own.

So when I start thinking about the animation, I need to think out a way that minimizes the "coding " part. That way, even if I end up having to do some coding by myself, I can still finish it using the very basic coding knowledge I have.

The final solution I thought out is:

Create 2 parts of the animations, 1 for the beginning loading, and another one is a "party mode "loop.

Screen Shot 2022-01-23 at 5.40.54 PM.png
Screen Shot 2022-01-23 at 5.40.25 PM.png

Here is the finished loop animation:

While doing the 3D build-up in Blender, I'm also trying to test the model and animation on my cell phone using Reality Composer.

So I can experience the model shape, scale, and animation by myself, and adjust them on time.

Small Scale Test

Large Scale Test

Hight Test

After showing the prototype internally to my coworker, I'm lucky enough to get support from the developers! It also helped me to communicate with Bluecadet's amazing developers easily in visual.

With the developers' help, we put this AR experience on to 8 walls and made it become a web-based AR experience.

Then I shared this will other designers in my company, to use their fresh eyes to help me find the problem users may have while using this AR.

Screen Shot 2022-01-23 at 5.57.07 PM.png

After almost a month's production time, I and my teammate finally finished creating the new year AR experience before the holiday!

Image from iOS.jpg
bottom of page