# What is Kivisense Try-on
## **About Kivisense Try-On**
As the increase of the number of businesses that choose augmented reality(AR) to enhance the interface experience, which will bring an immersive shopping experience to customers and increase their buying confidence.
Kivisense Try-On emerged for the business that want to add AR experience to their online stores. You can create your AR scene for shoes with Kivisense Try-On and embed it to your website and App. The Kivisense Try-On will bring a better experience for your customer and boost the sales for your brand.
## **Create your Try-On scene for shoes**
### Quick Embed Your (Virtual Try-on)VTO in 1 Minute, 3 Easy Steps
1\. Create Your VTO Scene: Use Kivisense to make your VTO scene and get your QR code or link.
2\. šØš±Add the QR Code or VTO Button: Put the QR code on your website or add a button with the link. šš»
3\. Try It On: Users can click the button or scan the QR code with their phone to try it on! š²
SCAN TO TRY
sample link 1:
sample link 2:
Sign up now for a free trial! ā³š Create your scene, links, and QR codes for your website with our [easy video guide](https://tryon.kivisense.com/blog/shopify-vto-setup-guide/). Need help with 3D modeling? Feel free to[reach out to us](https://form.jotform.com/241082568677164)! š
Scroll down to learn more about integration details.
{% embed url="" %}
## **Constraints of AR Try-On for shoes**
The AR Try-On algorithm for shoes adapt almost all medium and high smartphones introduced within these couple years.
Please note: some smartphone with low performance can not run the AR Try-On program smoothly because AR Try-On algorithm requires some essential performance on mobile devices.
### **Order the customization service**
If you want to get a further AR try-on experience to conform to your brand style, please connect us by ****.
# Create scene
## Add the scene title
The scene title will be displayed on the title bar on the home page
## Add the product link
On the try-on preview page, there is a "Explore More" **button** at the bottom of this page. If do not add a link to this **button** it will default jump to the website:
If you add a link to this **button** it will jump to the link you added.
## Add the product SKU
SKU is used for you to distinguish products, generally the information of the Reference, style and item number.
## Upload shoes model
The shoes model needs to be exported in a glb format file according to the requirements of the specification about model posture.
{% hint style="info" %}
The left shoe and the right shoe need to be exported separately.
{% endhint %}
{% hint style="info" %}
It is recommended that the model file size needs as small as possible to reduce loading time and get more performance.
{% endhint %}
Learn to export shoes models in the AutodeskĀ® MayaĀ®
{% embed url="" %}
Also, click the below link to download the example models to test.
{% embed url="" %}
## Upload the product thumbnail
The product thumbnail in the circle box will be used as a shoe photo at the bottom of the try-on preview page. And the thumbnail will be displayed in the scene list.
\
You need to upload a thumbnail with **520x520** pixel **.**
## Select the applicable mask model
In the real world , when looking at the shoes we are wearing, we can not see the whole shoes from some angles. Masks use this theory to simulate the experience that the shoes may be covered during try-on.
**Kivisense Try-On** has preset some **obj masks** to adapt the different common scenes.
#### 1. The mask for low top shoes
#### 2. The mask for high top shoes
#### 3. The mask for nude shoes
To the special scenes, you can upload you preferred obj mask to the plaform to adapt your scene.
## Preview and parameters settings
After the scene is successfully created, there are two QR codes that can be scanned on the mobile phone or copy the links and open them on the browser directly.
### Preview
The link that you can preview or publish your scene.
### Set model transform parameters
{% embed url="" %}
# Set model parameters adjustment during try-on preview
{% hint style="info" %}
In some special situations, there are a lot of factors will impact the experience of try-on. Hence, we introduced the parameters adjustment function to help our users get a better Try-On experience.
{% endhint %}
We can take the real try-on experience as a reference based on the current style or the same type shoes. For example:
* The pointed shoes will be longer than the toe position
* The sole of high heel is lower than that of the foot
* ...
What parameters can be adjusted for perfect effects and how to do it? Please read the below article .
## Exporting from other applications
First of all, it is highly recommended that you properly export the shoes model according to our standard posture to be compatible with our platform and components.
{% embed url="" %}
The definition of the XYZ axis is the basis for parameters settings. As shown in the picture above, after the model is correctly exported, the three-dimensional coordinates are defined as follows:
* The X-axis is the red coordinate that represents the width of the shoes from left to right
* The Y-axis is the blue coordinate that represents the length from shoes toe cap to heel
* The Z-axis is the green coordinate that represents the height from vamp to sole
## **Detailed Instructions for Parameters**
Next, we will explain in detail which parameters can be edited and the corresponding adjustment effects.
### **Adjust the position**
Respectively take the X, Y, and Z axes as horizontal lines and move along them.
Below is the position of moving the X-axis:
The following shows the position of moving the Y-axis:
Here is position of moving the Z-axis:
### **Adjust the rotation**
Respectively take the X, Y, and Z axes as horizontal lines and rotate around them.
Below is the angle of rotation of the X-axis:
The following is the angle of rotation of the Y-axis:
Here is the angle of rotation of the z-axis:
### **Scale**
As mentioned above, the X, Y, and Z axes represent width, length, and height, respectively, and then adjust them as needed.
The below shows the adjustment of X-axis lengthļ¼
The following is the rotation of Y-axis length:
Below is the rotation of Z-axis lengthļ¼
You can adjust the width, length and height synchronously, as shown in the button below. If adjusted separately, be sure to ensure a normal shoe shape.
**Please kindly note that the adjusted data is equal to the current data multiplied by (1+ Step value), which means that when resizing, it scales based on the current data, rather than simply increasing or subtracting it.**
> These are the three parameters that can be adjusted. You can adjust a certain axis of a parameter according to the actual situation.
For example, the try-on effect of this sneaker is shown in the image below, and you can adjust the following parameters for better effects.
* Increase the size of the shoes so that it covers the foot
* Increase the X-axis rotation value so that the 3D model is at the same level as the shoes you are wearing
* Reduce the Z-axis height so that the sole of the model is at the same level as that of your real shoes
Here is an example of parameter adjustment. You can optimize the try-on effect based on your actual situation.
## **Adjustment Object**
When setting parameters, the shoes model and masks are both the adjustment objects and share the above adjustment parameters. The shoes model is selected by default.
### Shoes model
The program will automatically mirror the parameters of the left and right shoes so you don't have to distinguish between them.
### Mask
In fact, when we view the shoes we're wearing, there are certain angles where we can't see. A mask works on this principle, meaning it simulates a situation in which a shoe might be obscured during the virtual try-on.
As shown in the picture above, the insole and heel can't be seen from the current perspective, so the shoes in AR should also be simulated in this way.
Before adjusting, you first need to select the adjustment object as āMaskā. When selected, a new button will prompt you to switch between āShow the Maskā or āHide the Maskā.
The corresponding effects are as followsļ¼
Then adjust the mask parameters step by step according to the actual situation. Please note that the shoes should be intact without any damage during adjusting, and the obscuration needs to be simulated as much as possible.
We prefer to display the mask first, then hide the mask and check the effect after the parameters adjustment. You can do it according to your preference.
## **Step-size Unit**
The step value is the unit in which the limit can be adjusted accordingly by clicking on the "+" or "-" once. The larger the step value, the greater the limit of adjustment.
Hope this tutorial can help you easily and quickly adjust a perfect AR try-on effect.
# Export shoes model from other applications
### Use AutodeskĀ® MayaĀ® to export models in .fbx format
Additionally, we support the models from other 3D modeling applications with .fbx format.
In this video, we just use AutodeskĀ® MayaĀ® as an example and you can use the same method to export your models from AutodeskĀ® 3ds MaxĀ® and Blenderā¢ as well.
{% embed url="" %}
{% embed url="" %}
{% hint style="info" %}
**The unit of models should be set in centimeters**
{% endhint %}
In order to give users a reference, we have given a set of example models of shoe boxes, left shoes, right shoes, and masks (mainly adjusting the initial position of the shoes, the length and rotation value of the shoe box), and uploading them to the platform Finally, you can have a better default fitting effect.
Click the link to download the sample model:
{% embed url="" %}
You can upload the sample model as shown below to see the effect:
Shoe model upload:
Mask file upload:
You can also refer to this set of models and place other shoes into this shoe box to adjust the initial position. I hope everyone can achieve the ideal try-on effect\~
### Use AR Model Editor to export models in glb format
{% embed url="" %}
# Implement Virtual Try-on with iframe Tag
### Quick Embed Your (Virtual Try-on)VTO in 1 Minute, 3 Easy Steps
1\. Create Your VTO Scene: Use Kivisense to make your VTO scene and get your QR code or link.
2\. šØš±Add the QR Code or VTO Button: Put the QR code on your website or add a button with the link. šš»
3\. Try It On: Users can click the button or scan the QR code with their phone to try it on! š²
SCAN TO TRY
sample link 1:
sample link 2:
Sign up now for a free trial! ā³š Create your scene, links, and QR codes for your website with our [easy video guide](https://tryon.kivisense.com/blog/shopify-vto-setup-guide/). Need help with 3D modeling? Feel free to[reach out to us](https://form.jotform.com/241082568677164)! š
Scroll down to learn more about integration details.
Through the \