Development Guide
User Manual: Pdf
Open the PDF directly: View PDF 
.
Page Count: 17
| Download | |
| Open PDF In Browser | View PDF |
Development guide for the Igniter Bee augmented reality mobile application Author: Devon Wijesinghe Date: 17th January 2018 Igniter Bee 2 Table of Contents Introduction ...................................................................................................................... 3 How to use the Application?.............................................................................................. 3 Technologies used ............................................................................................................. 4 Architecture of the application (augmenting a 3d object) .................................................. 5 UI of the application .......................................................................................................... 6 Adding a new image target to Vuforia ............................................................................... 7 Adding a new 3d model ................................................................................................... 10 Downloading 3d model from Tinkercad .................................................................................... 10 Creating asset bundle ............................................................................................................... 11 Uploading to the S3 bucket ...................................................................................................... 16 AR application development guide Igniter Bee 3 Introduction Igniter Bee is a monthly subscription to develop creativity and innovativeness of child around the globe. Every month, 2 activities are delivered to the subscribers’ doorstep. A pack contains one physical maker activity and one computer programming guide. When the child does the physical maker activity, he /she might find it difficult to visualize the what the end product of the activity should look like by look only at a 2D image. Igniter bee AR application is a possible solution to this. The child will be able to download this mobile application from the Android Play store or Apple App store, and view the model he/she has the create in a 3D manor. Furthermore, the child could use the app to access the tutorial related to a specific activity in the app it self. How to use the Application? The user will be provided with an image target along with the pack he/she receives. To view the 3d model, the user simply has to open the AR camera in the app and point at the image target. The image related 3d model will be augmented n top of the target image After the 3d image is augmented on the target, a button will appear in the button of the screen. This button can be pressed to view the tutorial related to the specific activity Note : The mobile should be connected to the internet in order to open and use the AR camera. If not the following pop up will be shown. AR application development guide Igniter Bee 4 Technologies used Unity: Used to develop the mobile application (UI + Logic using C# scripts). Vuforia library: This is used to make a 3D object augment on top of an image target and for cloud recognition of image targets. AWS S3 Bucket: S3 bucket is used to store asset bundles (compressed 3D objects). And also used to store the html tutorials Tinkercad: This is used to create 3D models Android/ IOS SDK: To build the project to run on a specific platform. AR application development guide Igniter Bee 5 Architecture of the application (augmenting a 3d object) AR application development guide Igniter Bee UI of the application AR application development guide 6 Igniter Bee 7 Adding a new image target to Vuforia What is needed: 1) A png or jpg/jpeg image (Your target image) 2) A .txt file containing the name of the object (metadata). This metadata name is really important (Will will look at in the future pages of this guide). To add image targets, you have to: Step 1- Login to your vuforia developer portal. Link : https://developer.vuforia.com/license-managerAdding a new 3d model Step 2- Go to develop tab AR application development guide Igniter Bee 8 Step 3- After you login, go to the target manager tab and select your cloud database from the databases section and click on it. Step 4- Click the Add Target button AR application development guide Igniter Bee 9 Step 5- You will get a pop up window, select the image target.png/.jpg/.jpeg and the metadata.txt file from your local storage. You can give any width and any name for the image target. Then click the add button(Your target image will get uploaded) You can view the added targets , as shown in the screenshot below: AR application development guide Igniter Bee 10 Adding a new 3d model Downloading 3d model from Tinkercad Step 1- Login in to Tinkercad account and click on the model u made and click download for 3D printing. Link: https://www.tinkercad.com/ Step 2- Download it ad an .OBJ file You will get a zip file in your downloads, unzip it to get a folder like this containing two files: *We will use this folder later on in this guide AR application development guide Igniter Bee 11 Creating asset bundle After you clone the project from Github, there will be a folder called “Asset bundle creator project” Step 1- Open that folder and u will find a unity project name “CreateBundles”. Open it in Unity. You should see a screen like this: Step 2- On the bottom left, you will see a file structure, with Assets as the root folder (refer the screen shot above). Click on the ‘Prefabs’ folder Step 3- If there are any folders inside the prefabs folder, right click and delete them all Step 4- Drag and drop the folder you got from Tinkercad , inside the Prefabs folder. AR application development guide Igniter Bee 12 Step 5- Rename the .obj file to the EXACT name you gave in the image target metadata ( the name in the .txt file which was uploaded to Vuforia along with the target image) Step 6- Click on the .obj file and a panel showing the object will appear on the bottom right, as show below: AR application development guide Igniter Bee 13 Step 7- On the bottom of the panel shown above , there will be a label called ‘AssetBundle’. And there will be two drop drops next to it. Click on the first drop down, and select ‘new’ and type ‘model’ or if it is already available, just select ‘model’ Step 8- Then click on the second drop down and click new and type the EXACT name of the object (.obj that u renamed) AR application development guide Igniter Bee 14 Step 9- After that is done, click on the ‘Assets’ on the top tool bar and select the option at last which says ‘Create the AssetBundles’ Step 10- Then you have right click the ‘AssetBundle’ folder on the bottom left file structure and click ‘Reveal in finder’ AR application development guide Igniter Bee 15 You will get four files (or more if there a files in the folder already) like show below. Step 11- Select the file which has the name model.nameOfTheObject ONLY. The other files will not be used. The selected file can be copied to a accessible location in the local storage (eg :desktop) , because it needs to be uploaded to a AWS S3 bucket AR application development guide Igniter Bee 16 Uploading to the S3 bucket Step 1- Login to AWS console and go to the s3 buckets section Step 2- Select the ‘ar-app-objects’ bucket from the list Step 3- Click the upload button and upload the single file (asset bundle) you selected (saved to the desktop) in the previous part of this guide. Make sure you make the file PUBLIC to everyone. You can view all the uploaded asset bundle now: That’s it : ) AR application development guide Igniter Bee 17 For any inquiries Email: wdevon99@gmail.com Facebook: https://www.facebook.com/wdevon99 Mobile: 0779141958 AR application development guide
Source Exif Data:
File Type : PDF File Type Extension : pdf MIME Type : application/pdf Linearized : No Page Count : 17 PDF Version : 1.4 Title : Microsoft Word - Development guide for the (Autosaved) (Autosaved).docx Producer : Mac OS X 10.12.6 Quartz PDFContext Creator : Word Create Date : 2018:01:17 08:10:17Z Modify Date : 2018:01:17 08:10:17ZEXIF Metadata provided by EXIF.tools