STY.MI



STY.MI introduces a playful AR experience through Snapchat Lenses, revolutionising fashion marketing by providing customers with a delightful, innovative, and informative method to discover a brand's product range. This transforms ordinary product catalogs into captivating 3D interactive experiences.
Group Members:
Mohamed Eleryan - Modelling
Nikolay Kolev - Programming
Yining Li - Visual Effects
Meghna Sonie - Modelling

Concept
  


(Why creating AR content for Branding?)

Design

Storytelling Design

      Character : the User 
          Try-on Clothes
       Scene: Dancing Hall
    Interact: Dance Moves


In terms of clothing style, we selected loose-fitting jackets and pants that can cover the user's own clothes. To make the project more engaging, we chose a dance scene to turn the environment into a dancing hall. Colour changes are triggered by dance movements to encourage user participation and promote the product. For accessibility reasons, we also included random colour switches.
AR Features



Personal Contribution


Timeline
24 - 30th Oct - Brainstorming, Research, Presentation
31st Oct - Pitch Practice 
1 Nov - 1st Pitch
9 Nov - Finalized the idea
14 Nov - 1st set of 3D models
18 Nov - 1st Particle effects according to outfit19 Nov - Technical Implementation
20,21 Nov - Testing, Changes and Demo Prep
22 Nov - 1st Demo
Till 1 Dec-  Brainstorming, ideation
5 Dec - New 3D models
7 Dec - New visual effects, technical implementation13 Dec - Final Pitch and Demo

Creating Process

In the creative process, I was mainly responsible for the scene visual effects. Our team's concept went through several major changes during the process. The first iteration of the creative part was also abandoned for the sake of overall effect. Below is the creative process for the final dance hall scene.
                    Final
          First iteration


After determining the dance movements as the main trigger for interaction, I began to conceptualize the composition of the scene. How can users feel the atmosphere of the dance hall on a limited mobile screen? Although the screen is flat, the immersion will be affected if the environment does not adapt to the three-dimensional space in which the user is located. Therefore, the placement of elements should fully reflect the sense of space.


Place a disco ball at the top of the user, and place a spotlight in front and behind. The light shining the ball will project onto the ground, adhering to real-world principles and also indicating the user's position in the flat plane. The disco ball was modeled in SketchUp, unnecessary faces were removed to reduce overall volume. The animation was created in Blender, with the rotation speed matching the ground projection, and then exported to a usable FBX format for Lens Studio.

The material of the ball uses reflective glitter from the built-in assets, originally intended to use Ray Tracing, but considering the size issue, and the light itself does not have IES functionality to display the beam feeling, this material can generate reflections according to the light, and can also achieve the effect in the rotating state.

         Rotating disco ball
                 Light beam
              Dots material
         Rotating projection
The light beam is also modeled in Sketchup, and the blend mode is changed to add to maintain transparency.

A plane with the same rotation speed as the disco ball is newly created in Blender, and the material is drawn in Photoshop, with the blend shape changed to add. In order to position the ground under the user's feet, a WorldObjectController is created using Device tracking.

Due to the requirements of other effects, there are two cameras in the scene: a regular camera and an Orthographic Camera. The left beam is located under the Orthographic Camera, while the right beam is under the regular camera, demonstrating spatial perception.

Walk-through Video