Development (Basic)
In order to experience the entire app creation process, loading the character model files and rendering the character file in the app will be demonstrated by a given instruction. Participants can make their own app with a simple sequence of operation, and source coding work will be minimized for this simple version of code lab. Based on this simple version of code lab, the character file import process will be learned and users can make their own app with AR Emoji SDK after this code lab work-through.
Step 1: Create a Unity sample project
Run Unity and create empty 3D sample project
Step 2: Configure the Settings
-
Build Settings
a. File -> Build Settings
b. Platform -> Android
Specific package name and keystore is necessary for testing. In the next steps, it’s explained in detail.
-
Player Settings -> Other Settings -> Identification -> Package Name
Set the Package Name to
samsung.com.fileprovidersample
-
Player Settings -> Publishing Settings
Browse keystore :
fileprovidersample.jks
a. Add keystore with browser (Included Docs folder of
GettingAREmoji.unitypackage
)b. Keystore password :
123456
c. Key
-
Alias :
keyalias
-
Password :
123456
-
Step 3: Import sample app package (GettingAREmoji.unitypackage)
-
Import package
Run
GettingAREmoji.unitypackage
, then Import -
Check imported sample application
a. Assets -> Scenes -> GettingAREmojiSample Scene
b. Click Canvas
Step 4: Import glTF Importer package to load AR Emoji model in Unity (GLTFImporter.unitypackage)
- Import package
Run GLTFImporter.unitypackage
, then Import
- Check imported packages
Step 5: Integrate glTF Importer to sample application
-
Go to sample scene
a. Click Assets -> Scenes ->
GettingEmojiSample.unity
b. Click Canvas
c. Check ButtonBehaviour (script) in Inspector
-
Define GLTFComponent in your application
a. Open Assets -> Scripts ->
ButtonBehaviour.cs
b. Define
glTFComponent
public class ButtonBehaviour : MonoBehaviour { public Button m_connectBtn; public Button m_getListBtn; public Button m_getFileBtn; public Button m_getPreviewBtn; public Text m_Text; public RawImage m_Image; public UnityGLTF.GLTFComponent gLTFComponent;
c. Confirm GLTF Component property appears in inspector (compare to Step 1)
-
Add
loadGLTF
api in your applicationa. Write below code in
OnClickLoadModel()
ofButtonBehaviour.cs
to load selected modelprivate void OnClickLoadModel() { m_Text.text = ""; m_Text.text = "OnClickLoadModel"; if (!isGetFile) { m_Text.text = "\nisGetFile : " + isGetFile + "\n"; return; } //add below code if (filePath != null) { StartCoroutine(gLTFComponent.loadGLTF(filePath)); } }
b. Write below code in
Start()
ofButtonBehaviour.cs
to attach the GLTF Componentvoid Start() { m_Text.text += "\nStart"; jc = new AndroidJavaClass("com.unity3d.player.UnityPlayer"); jo = jc.GetStatic<AndroidJavaObject>("currentActivity"); m_Dropdown.onValueChanged.AddListener(delegate { DropdownValueChanged(m_Dropdown); }); if (GameObject.Find("GLTFComponent")) { GameObject o = GameObject.Find("GLTFComponent"); //add below code gLTFComponent = o.GetComponent<UnityGLTF.GLTFComponent>(); }
-
Copy
GLTFComponent
prefab into your application to use GLTF Component property of Step 2a. Click Assets -> Prefabs
b. Drag
GLTFComponent
prefab to your Scene
Step 6: Build and run
- File -> Build Settings -> Build and Run
-
Launch sample application in device
a. Click Get List and confirm AR Emoji lists saved in device
b. Select one of them
c. Click Get Preview and Load Preview
d. Confirm the AR Emoji thumbnail is showing
e. Click Get File and Load Model
f. Confirm the AR Emoji model is showing
Step 7: Create your AR Emoji
If you want create your own AR Emoji, please make your AR Emoji with the following procedure.
-
Run Camera application
-
Click AR Emoji and the + button
- Take your selfie as guideline and choose your gender
-
Edit your AR Emoji
a. You can customize looks, clothes, or accessories of your AR Emoji
b. Press Next once you complete
-
Done and check your AR Emoji
a. Click Done button once you complete editing
b. Check your AR Emoji in Mask mode
c. Click Studio button and check your AR Emoji in AR Emoji Studio