UFO project overview

Explore the Unity project

Begin the AR port

Selecting an orientation for your AR game

Enable the play area

Develop the AR UFO movement

Develop the AR UFO abduction action

Other AR considerations

Design your own AR app

In this Mission, you’ll port an existing desktop game to mobile and redesign it to be a fully functioning (and fun!) AR experience.

Research future AR use cases to prepare for developing new kinds of applications

Evaluate platform capabilities and limitations in order to determine whether or not a given feature will work

Absolute Beginner AR Design

Absolute Beginner AR Development

Optimize assets and application to meet mobile performance standards

Beginner Mobile Optimization

Create basic application interactions with Visual Scripting

Absolute Beginner Visual Scripting

In this learning experience, you’ll port an existing desktop game to mobile and redesign it to be a fully functioning (and fun!) AR experience. You’ll conduct research, create a design document, modify visual scripts, and regularly playtest your app. At the conclusion of this project, you’ll also design and create your own fully realized AR application.

AR experience design

Mobile AR Development

Mobile AR Development - Unity Learn

Ready to create AR experiences? In this learning pathway, you’ll develop AR apps compatible with iOS and Android devices!

Evaluate platform capabilities and limitations in order to determine whether or not a given feature will work.

Develop AR experiences that use trackable targets in the environment

Welcome to AR Development! In this learning Pathway, you'll create Augmented Reality (AR) applications that are compatible with iOS and Android devices. You’ll use Visual Scripting and Unity’s AR tools to develop a wide variety of engaging AR experiences. This pathway assumes a basic knowledge of Unity.

Welcome to AR Development

test

Configure your AR development environment

Deploy your project to iOS or Android

Welcome to AR Development Quiz

Get ready for AR development: explore the field, hear from experts, install essential software, set up a Unity project, and deploy a test project to your mobile device.

In these tutorials, you'll get ready for AR development. First, you'll learn about the field of AR and hear from established creators in the AR industry. Next, you'll download all required software to get started and configure a Unity project for AR development. Finally, you'll deploy a test project to your mobile device to make sure everything is working as it should.

Get started with AR

Set up a face tracking project

Add a face texture

Add accessories to your filter

Add animations to your filter

Add particle effects to your filter

Add post-processing to your filter

Submission: Ice cream company filter

Learn how to create a custom face filter app with fun textures, 3D models, particles, and effects. In the challenge, design a themed filter for an ice cream company.

In this mission you'll create your own custom face filter app that includes a wide variety of digital content. The face filter will include interesting textures, animated 3D models, dynamic particles, and post-processing effects. You'll also complete a challenge where you design a custom filter for an ice cream shop.

Create a basic face filter

Build a new scene with glasses

Set up the UI

Create a visual script to detect a button press

Turn on the glasses with buttons

Update your graph to switch between glasses

Configure one color button

Complete the color switching functionality

Save and load the glasses

Submission: Ocean-themed face filter

Create with AR: Face Filters Quiz

Expand on what you’ve learned with filters that add interactive elements. You’ll create an app for customizing and trying on glasses, then an ocean-themed face filter.

Now that you’ve created a basic face filter, you’re ready to develop your skills and work on a filter that involves interactivity. In this project, you will create your own interactive app that allows a user to select, customize, and visualize different pairs of glasses on their face.You will also complete a challenge where you design an interactive underwater scuba filter for an aquarium.

Create an interactive face filter

Create a new project for marker-based AR

Spawn an object on an AR Marker

Add a UI with rotation buttons

Add world space UI to your marker-based app 

Add spatial audio to your marker-based app

Submission: Bring art to life with AR

Add world space UI to your marker-based app

Learn to create marker-based AR apps, which make digital models appear over marker images in the real world. In the challenge, you’ll breathe life into a 2D work of art.

 app is an application that can recognize images (called markers) in the real world and then make content appear in the app. You may have seen applications that use this kind of technology to make AR content for movie posters, product labels, card games, and even business cards.

In this project, you’ll make a marker-based app with a user interface that lets the user control a 3D model, text, and audio.

Create a marker-based AR app

Set up a scene with plane detection

Detect the user’s touch

Detect when the user touches a plane

Instantiate the portal on a plane

Test the frame rate of the portal world

Limit the visibility of the portal world

Submission: AR friend

Create with AR: markers and planes Quiz

Make an app that detects flat surfaces and allows the user to spawn a portal on their floor or wall. Then complete a challenge to create an interactive character app.

In this project, you’ll create an AR app that makes use of plane detection technology. iOS and Android devices have the ability to detect flat surfaces — or planes — in your physical environment. This includes horizontal planes like the floor or a table, and vertical planes like the walls. 

You will create an app where the user will be able to tap on a plane in order to place a portal onto it. This portal will be a window into a virtual 3D environment that the user can peer into and explore. 

You will also complete a challenge where you design an app that allows the user to place a character on a table and interact with it.

Create a plane detection AR app

3c7ff5fd-abaf-41df-88dc-a2508db85fef:d61474e96b39

Overview

Review the Manage Beam Script Machine

Evaluate UI options for the abduction action 

Create a UI button

Reconfigure beam input for buttons

More things to try 

Next steps

Zu-UnityLearn

AR Real Driving 2.0 Official Trailer

Cosmic Frontline AR - Lead epic galactic battles!  | Official Trailer

AR-3.7-07-beam-button-script-demo.mp4

AR-3.7-09-beam-button-working_1.mp4

AR-3.7-10-success-sound_1.mp4

AR-3.7-11-delay-buttons_1.mp4

Just like the movement, the abduction mechanic of the game in the desktop version uses the keyboard. To make the game compatible with mobile devices, you’ll redesign the abduction mechanic.

In this tutorial you will do the following:

Evaluate options for the abduction mechanic

Reconfigure the UFO abduction Visual Script to work with your redesign

Build AR projects to mobile devices

You’ve started the work of adapting the UFO game for your AR port, but there’s still one more key part of functionality to adjust. The game still uses the Spacebar key for abducting sheep, which will not work for mobile AR. 

In this tutorial, you’ll adjust the UFO’s abduction action to work in AR, so that players can complete the game.

Similarly to the UFO movement functionality, the Manage Beam Script Machine makes use of On Keyboard Input Event nodes for both up and down input detection: 

When the Spacebar key is down, the UseBeam custom event is called and the usingBeam Boolean is set to true. 

When the Spacebar key is up, the StopBeam custom event is called and the usingBeam Boolean is set to false.

These two keyboard input nodes will need to be replaced for your game to work in mobile AR.

The Fire/Release beam grouped Script Graphs in the Manage Beam Script Machine.

Since the user will always want easy, reliable access to the beaming action, a big button in screen space might be the best option.

For example, look at screen space controls to drive the cars in AR Real Driving - Augmented Re. They’re located in easy-to-reach locations for the user’s thumbs and are always available.

You could also have the user activate an object by touching on the object itself, which in this case would be the UFO. In Cosmic Frontline AR, for example, you have to touch the planets that you want to attack or defend. 

There are so many different ways to make this interaction work. For this example, we will show you the steps to create a screen space button, but you will have an opportunity to implement a different solution at the end of the tutorial if you want. 

Follow these instructions to create a button that will control your UFO sheep abduction beam: 

1.  Add the Gameplay prefab into the scene temporarily so that you can preview your UI changes.

2. In the Hierarchy, create a new UI Button GameObject as the child of GameCanvas (organized under Gameplay > MeshParent). Name the new GameObject "BeamButton".

3. Design your button using the properties in the Image component, the Button component, and the TextMeshPro - Text (UI) component. You can preview your button in Game View, even though the camera will be positioned in the ground.

4. In the Rect Transform component, use the Anchor Presets menu and the Position properties to position the button somewhere convenient on the screen. 

5.  To save the changes to the Gameplay prefab, select the Gameplay GameObject, then in the Inspector window select Overrides > Apply All. 

Important: You must apply the changes to the Gameplay prefab or you will lose the new functionality you just implemented when the prefab is spawned into the scene.  

A new UI button added to the Hierarchy as a child of the Game Canvas.

The beam button placed on the lower right of the screen.

The Rect Transform anchor presets of the BeamButton set to the lower right corner.

Applying the changes to the Gameplay prefab via the Overrides option in the inspector window.

The beam button may look good, but it still won’t actually function. You’ll use the same process for converting keyboard input to pointer input that you used for the directional buttons. 

Watch the video or follow the instructions below to modify the Manage Beam visual script:

1.  Expand the Gameplay prefab GameObject and select the UFO GameObject. 

2.  In the Inspector window, locate the Manage Beam script graph and select Edit Graph. 

3.  In the Blackboard, create a new Object variable of the Button type named “beamButton”, and use the object picker to add your tractor Beam Button.

4.  Navigate to the Fire/Release beam section of the graph editor

5.  Add the new beamButton variable to the far left of the graph editor.

6.  Add an On Pointer Down and On Pointer Up event node where the On Keyboard Input Event nodes are located. 

7.  Delete the On Keyboard Input Event nodes. 

8.  Connect the On Pointer Down node to the UseBeam Custom Event Trigger node.

9.  Connect the On Pointer Up node to the StopBeam Custom Event Trigger node.

10.  Connect the beamButton variable to both On Pointer nodes.

11.  To save your changes, select the Gameplay GameObject, then in the Inspector window select Overrides > Apply All. 

12. Deactivate the Gameplay prefab from the scene, then build and test your application again. The beam button should now work, making your game fully functional! You can also test the beaming functionality in the Editor. 

If you want to further develop your skills, explore new concepts, or improve your project, check out some of the optional activities below. Each activity is identified as being either Easy, Medium, or Difficult so you know what level of difficulty to expect.

These activities are entirely optional, so if you’re not interested, no problem — just skip this step. 

We do recommend attempting at least one of them in order to get the most out of this learning experience, however. Good luck!

Easy - Add sound or visual effects to the abduction action

The actual beaming action is a very satisfying interaction. There’s a nice loud noise, the screen color changes — it’s very obvious. When a sheep is actually abducted, on the other hand, the sound just stops. There’s no difference between dropping a sheep and abducting one, so it’s hard to tell what has happened. 

You could add a satisfying, positive sound or particle effect when a sheep is successfully abducted, or add a negative effect when a sheep dropped. 

Right now, the directional buttons and the beam button are already visible before the UFO even enters the scene. Users might be confused when they try to press these buttons, but nothing happens. For a clearer user experience, the buttons should only become visible after the UFO gets into position. 

Congratulations! This is a major milestone. You have now replicated all of the key functionality from the original desktop game in your AR port and the application is fully functional. As an AR designer, though, your work is not yet finished. In the next final tutorial related to this UFO game port, you will consider other AR-specific design decisions to improve the user experience. 

Develop the AR UFO abduction action

1. Overview

2. Review the Manage Beam Script Machine

3. Evaluate UI options for the abduction action

4. Create a UI button

5. Reconfigure beam input for buttons

6. More things to try

7. Next steps

Complete this tutorial