Building Your First Augmented Reality App

Share if the site was helpful

We’ve talked before about how influential augmented reality is going to be in the future.  What we didn’t mention is how easy it can be to take part in shaping that future.  Over the course of the next two posts we’ll show how to incorporate AR into an app, and when it’s all said and done we’ll be able to look at a virtual elephant in the real world.

It’s not too complicated as far as subject material goes, but there a couple steps involved so we’ll split this into two pieces: gathering our resources and then putting them into action.

Before we do any work though, let’s take a second to discuss the bigger picture of what we’ll be doing here.  If you’ve ever experimented with game development, then you’ve probably heard of Unity.  If not, then some things in this tutorial may seem a little confusing at first (but far from impossible!).  Unity is a development environment where developers can make 2D and 3D games, and we’ll be using it here to host our augmented reality app.  Click here to download Unity, and when you do make sure that you include the Android/iOS and Vuforia plugins.

We all know about Android and iOS, but odds are Vuforia is a new name.  Vuforia is a popular AR platform that allows us to use image targeting in our apps.  Essentially all we have to do is pick a 3D model and an image.  Vuforia will then root our 3D model to any images it sees in the real world.

For example, in this app we’ll be using a 3D model of an elephant made with Blender, and the image will be a $1 bill.  With this combination, any time our app’s camera finds a dollar bill in the real world, it will place the 3D model on top of it.  The result is the title image of this post.

Ok, that’s enough background.  Let’s jump into the actual set up.  Use the above link to download Unity if you don’t already have it, and then go to developer.Vuforia.com and create an account.  After you’ve made an account click on the develop tab and then click to create a new license key.  You can name this anything you want, but as you can see in this image I chose “VuforiaElephant” as my name.

After creating the license key you’ll be able to click on it and see a string of random characters representing it.  Copy and paste this value; we’ll be using it later in this tutorial. 

We create this license key so that our app in Unity will be able to connect to our Vuforia account.  Now for the second step we’ll need to do create a database inside of Vuforia to hold our dollar bill image.  Change your selection from License Manager to Target Manager and then add a new database.  I’ve named mine “DollarElephant”.  Inside of this database we’ll click “Add Target” to add a new target.  Pull any image of a dollar bill from Google images and add it here.  Then set it’s width value to 5 and give it a name (dollarTarget is just fine).

When you’re done with this click to download the database, and that’s everything we’ll need to do in Vuforia.  Before moving into Unity let’s also get the 3D model of an elephant we want to use.  Click here to download the elephant made by sagarkalbande (and feel free to try this out with a different model).  Save this file onto your computer and now let’s move into Unity.

If you’re feeling overwhelmed right now, don’t worry we’re not going to do much else in this first part.  For now let’s open Unity and create a new project named “VuforiaElephant”.  Go to “File”, then “Build Settings” and select Android as your Platform.  After making this change the little Unity cube should appear next to Android.

Finally inside of the Build Settings window click on “Player Settings” and a bar of options will appear on the right side of your screen showing setting options.  Open the tab that says “XR Settings” and check the box that adds Vuforia Augmented Reality to our project.  Go ahead and import the settings that Unity says it needs to add, and now we’re ready to start the fun stuff.

If you’ve made it this far down the blog, then good work sticking through the dry steps.  We created a Vuforia account, made a license key, and selected a dollar bill as our image target.  Then we downloaded our elephant 3D model and created a new project in Unity.

So now we just have to make the connection inside of our Unity app between the dollar and the elephant.  Stay tuned for the second part of this tutorial in the next few days and we’ll finish out the project so that everyone can have their own virtual elephant! Does app development have you completely lost? Check out Phonlab Android app development classes HERE

Learn How To Develop Android Apps

Share if the site was helpful

Coding is like printing your own money!!! 

Everyone has that one app idea that’s sure to be the next big thing, yet so many of these possibilities slip away unnoticed by the world.  The problem isn’t coming up with the idea, it’s crafting it into a tangible app people can download and share.   If you’ve been itching to turn an idea into reality and show the world what it’s been missing, then you’re in luck.

Phonlab’s newest course has officially been released, and to say we’re excited is an understatement.  The Android App Development course is designed to guide a student all the way from writing their first line of code ever to publishing apps on the Google Play Store.  We’ve built it to cover all the basics of Android while throwing in some snazzy features to make your creations more exciting for users.  By the end of the course you’ll not only be set up with the resources need to make a million-dollar app, but you’ll already have a portfolio of 5 apps to show off to family, friends, and potential employers.  

Here’s a quick rundown of the apps you’ll be building:

  1.  ScoreKeeper:  After learning about the basics of Java and XML this multi-sport score keeping app will show students how to build complex layouts.  Here we’ll make the jump to multiscreen apps with complex interactive layouts.  
  2.  SoundScape:  For app #2 students will learn how to include audio into their apps by building a soundboard with their own personal touches.  Audio’s not always a necessity in apps, but learning to include it can create a more immersive experience and really make your app pop.
  3.  NewsNet: In this app students will learn about this beautiful thing called the web and begin streaming live data into their apps.  We’ll consolidate articles from over 5,000 news sources into just one screen and learn some tricks the pros use to speed up development.
  4.  MyReads: Have you ever wanted to keep a log of every book you’ve ever read?  Well if so (and if not) app #4 of the course is centered around building a database for this very purpose.  We’ll learn about SQL, one of the most important languages in the data world, and learn how to share info between apps.
  5.  FireChat: In our 5th app students will build a group messaging app complete with social media incorporation by learning the syntax behind Android’s newest language Kotlin.  Kotlin has a bright future ahead of it, but online learning resources are currently few and far (Phonlab to the rescue!)

These apps are the bedrock of the education, but of course we want to set you up for success, so there are lots of other topics covered along the way.  These include how to use Github to build projects with a team of developers, and diving into the depths of object oriented programming.

Whether you want to learn as a (lucrative) career choice, or as a side hobby, there’s no better time to begin your journey, and we want to be by your side all the way.

Enroll Now At Phonlab