1Jewelpark AG App

Android Appfor jewelry visualisation

based onunique Augmented Reality

experience

Link to website:http://www.deleklub.dk/html_customized/JewelparkPage/index.html

Download Jewelpark App:https://drive.google.com/open?id=1SWaUeAjzLKT6ePxv3qABxB-yiqBEobkq

Download Catalog:https://drive.google.com/open?id=1JaBdRRQ-RkqidJttb2mwULo2SJtR1MV2

Olga Batrakova

2Jewelpark AG App

Olga Batrakova

KEA / Multimedia Design / 3-d semester Interactive 3D E17

3Jewelpark AG App

Content:

4 – Goal of the project4 – The Double Diamond Approach5 – Desk research and comparative analysis5 – Target Group6 – Persona7 – Paper prototype8 – Persuasive design9 – How to create Augmented Reality App? 9 – About Vuforia

10 – Jewelry Catalog Page with the image target

11 – Materials

12 – Light

13 – Code in C#

13 – Audio Source

14 – Lean Touch Asset

14 – Conclusion15 – Sources

4Jewelpark AG App

Goal of the projectThe goal of the project is to create an AR Android App for jewelry visualisation that gives our potential customers new unique user experience and allow them to look at the particu-lar jewelry more presizely and in more detail.

Jewelry marketing strategies often rely on expensive catalogues with impeccable pho-tography of rings, bracelets, necklaces, earrings and such. However, the customers would feel much better if they knew this particular jewelry design suited them. They could look at the particular ring in three dimensions, from different sizes, scale it and see the play of light on the diamonds.

Using augmented reality allows us to bring virtual objects to the real world. In this way, a marker-based augmented reality app for smartphone owners can turn all items of catalogs into 3D animated models. In jewellery it’s all about presentation and showcases. People only have to point their mobile devices onto the showcases.

The Double Diamond Approach

In my UX Research I use the Double Diamond approach in order to understand customers’ problems and find creative ways to solve their problems. Using two different types of think-ing - divergent (think broadly) and convergent (think narrowly) - is an effective way to find the right solution.

5Jewelpark AG App

Desk research and comparative analysisAt the beginning of the project I made a desk research in order to find similar concepts already existing in reality. The table below helped me to understand what functionality my app should have.

Target GroupWomen between 25 and 55 years old with big interest in jewelry in general, new design tendencies and technologies; active users of smartphones and SoMe.

Name Link Visual Design

User friendly

Architecture Functionality

Shop4Rings http://tryon.guru/jewel-ry#aboutapp

modern ja simple and clear

clear

TryLive for Eye-wear

http://www.trylive.com/demos

modern ja simple and clear

clear

Pandora Jew-elry

https://play.google.com/store/apps/details?id=net.pandora&hl=en

modern ja simple and clear

clear

TOUS Jewelry http://www.tous.com/

modern ja simple and clear

clear

6Jewelpark AG App

Persona / Anne MøllerAge: 45 years

Employment: Municipal employee

Residence: Bagsværd

Marital status: Married and have a son of 18 years

Goals / needs

Anne has always been interested in high quality design and jewelry in particular. She likes to go to art exibitions, she uses her smartphone to make photos and communicate on SoMe. Recently Anna discovered IKEA AR App for interior planning, and she thinks that is great.

Likes

• Simplicity and intuitivity in digital solutions

• She has almost everything on her mobile device - payments, messengers, books etc.

• Likes to have a possibility for shopping research - compare colors, textures, try all possi-ble combinations.

Dislikes

• Dependency of her smartphone.

• Having to buy jewelry for herself - that is not so romantic. Sometimes she would prefer if her husband ‘surprises’ her with a gift of a ring or a bracelet.

Anne is looking forward to create a wish-list for her husband in order to ‘help’ him not to make a mistake in making such surprise. My App should help her to make this wish-list.

7Jewelpark AG App

Paper prototype

8Jewelpark AG App

Persuasive designIn my design solution I used persuasive design principles. An example is ‘Add to Cart’ but-ton in the App. Persuasive design supports the company’s business goals. It is a technique used to change people’s attitudes or make them perform certain actions.

What is Augmented Reality?Augmented Reality is a fast growing technology with a lot of possibilities for the future market. Augmented reality is often compared to virtual reality, but in fact they are two different technologies. Augmented reality is creating a virtu-al layer on top of reality. It could be scanning the barcode of a package with your phone or tablet and have the product appear in front of you like a hologram. In other words: You are inserting something virtual into the real world.

“Augmented reality is increasing in popularity with both Apple and Google releasing their own AR developer kits.

AR superimposes virtual objects in the world around us enabling us to mix reality with fic-tion in images viewed on a smartphone, tablet or through special goggles.

Experts predict the AR market could be worth £122 billion by 2024”.

BBC News / 2 oct. 2017

http://www.bbc.com/news/av/technology-41419109/what-future-for-augment-ed-reality

9Jewelpark AG App

How to create an AR App?I used Unity 2017.3 to create my Augmented Reality App. In order to make it working it is important to install Vuforia plugin.

About Vuforia

https://library.vuforia.com/articles/Training/getting-started-with-vuforia-in-unity-2017-2-beta.html#betas

Vuforia is a software platform for creating Augmented Reality apps. Developers can easily add advanced computer vision functionality to any application, allowing it to recognize im-ages and objects, and interact with spaces in the real world. The Vuforia platform supports AR app development for Android and iOS devices.

Process:• Create Vuforia account

• Create a new Unity project (3D project set-up)

• Activate Vuforia in your project (Player Settings / “XR Settings”)

• Add an ARCamera

• Delete the default Main Camera after adding an ARCamera

• Import Vuforia License Key and image target database

• Project 3D Model on top of image target

• Install Android Studio and import Android SDK inside Unity

• Install JDK (Java Development Kit)

• Build and run the AR App

Model of the ring (.fbx) Image Targethttps://www.turbosquid.com/

10Jewelpark AG App

Jewelry Catalog Page with the image target

11Jewelpark AG App

Materials

Gem Shader Asset (for the diamond)https://www.assetstore.unity3d.com/en/#!/content/3

Basic Metal Texture Pack Asset (for the ring)https://www.assetstore.unity3d.com/en/#!/content/37402

12Jewelpark AG App

Light

Three point lighting

Three-point lighting is a very common lighting technique used in cinematography and photography. Three-point lighting is a very flexible technique and it can be used to illuminate the subject in an attractive way. Three-point lighting consists of three separate lights which can be used to control the lighting, shading and shadows of the subject.

The Key LightThis is the main light used on your subject.

The Fill LightThe purpose of this light is to fill in the shadows created by the key light, preventing them from getting too dark.

The Rim LightThis is used to separate the subject from the background.

KEYType: DirectionalIntencity: 10

RIMType: DirectionalIntencity: 2

FILLType: DirectionalIntencity: 4

13Jewelpark AG App

Code in C#

In order to make a rotation of the ring I used C# code that you can see below.

This script has to be attached to the particular Game object (in my case ‘Ring’ ) by clicking the button ‘Add component’ in Inspector.

Audio Source

How to create a new Audio Source:• Import your audio files into your Unity Project. These are now Audio Clips.

• Go to GameObject->Create Empty from the menubar.

• With the new GameObject selected, select Component->Audio->Audio Source.

• Assign the Audio Clip property of the Audio Source Component in the Inspector.

14Jewelpark AG App

Lean Touch Asset

In order to handle gestures (Scale in my case) I used Lean Touch Asset that you can see be-low.

https://www.assetstore.unity3d.com/en/#!/content/30111

Conclusion

My task is to propose a new AG Android App that gives the target group more visual infor-mation about a particular jewelry. Through the App a potential customer gets a possibility to look at the product from all angles, scale the product in order to see more details and estimate play of light on the diamonds. With other words my App can solve some of a cus-tomer’s problems when she has a lack of visual information about the particular jewelry.

I think that using paper catalogs in combination with Augmented Reality holograms will in-crease sales, because it looks really attractive, cool and funny for the target group –modern women from 25 to 55 years old.

15Jewelpark AG App

Sources• https://medium.com/seek-blog/design-thinking-101-the-double-diamond-ap-

proach-ii-4c0ce62f64c7 (Double Diamond Approach)

• http://fortune.com/2017/10/03/augmented-reality-ar-investments/ (Augmented Reality)

• http://www.bbc.com/news/av/technology-41419109/what-future-for-augment-ed-reality (Augmented Reality)

• https://www.youtube.com/watch?v=HnjbTytHH6U (Vuforia)

• https://www.youtube.com/watch?v=cCOLdX1JMo4&t=176s (Vuforia)

• http://www.secondpicture.com/tutorials/3d/three-point_lighting_in_3ds_max_01.html (Light)

• https://www.youtube.com/watch?v=qxWARUJwCAg (Lean Touch Asset)

• https://www.assetstore.unity3d.com/en/#!/content/30111 (Lean Touch Asset)

• https://www.assetstore.unity3d.com/en/#!/content/3 (Gem Shader Asset)

• https://www.assetstore.unity3d.com/en/#!/content/37402 (Basic Metal Texture Pack Asset)

• https://docs.unity3d.com/Manual/class-AudioSource.html (Audio)

• https://www.turbosquid.com/ (3D models)