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

Set up the UI

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.

Develop AR experiences that use trackable targets in the environment

Absolute Beginner AR Development

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

Absolute Beginner AR Design

Create basic application interactions with Visual Scripting

Absolute Beginner Visual Scripting

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

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!

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

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 

Configure your AR development environment

Deploy your project to iOS or Android

Welcome to AR Development Quiz

Welcome to AR Development

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

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

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.

Beginner Mobile Optimization

 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

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.

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

95ec1e11-eed8-42ad-8f2b-ad87bd627999:6e290350ad9e

Overview

Disable the glasses’ mesh renderers

Create a custom event

Add the custom event to the button graphs

Test your update

Next steps

Zu-UnityLearn

Desarrollo de AR para novatos

Hammad_N

Visual Scripting para novatos

1.5.2.1.mp4

1.5.2.2.mp4

1.5.3.mp4

1.5.4.mp4

YouCut_20220809_170530389.mp4

In the previous tutorial, you built functionality for your app to display glasses based on the button that the user selects. However, the glasses’ meshes remain active even if the user selects another button — the glasses are displayed on top of each other.  

In this tutorial, you’ll do the following: 

Expand your graph functionality so that only one pair of glasses is visible at a time.

Learn how to use custom events to make your scripts more efficient.

Games

Desarrollar experiencias de AR con objetivos que se puedan rastrear en el entorno.

robinmitra

Crear interacciones para aplicaciones básicas con Visual Scripting

In the previous tutorial, you built functionality for your app to display glasses based on the button that the user selects. However, the glasses’ meshes remain active even if the user selects another button — the glasses are displayed on top of each other. In this tutorial, you’ll expand your graph functionality so that only one pair of glasses is visible at a time.

You’ve already learned that the Mesh Renderer: Set Enabled node can be used to control the visibility of a GameObject. In your main graphs, you used this node to enable the mesh visibility — now you'll use it to disable mesh visibility. 

Watch the video or follow the instructions below to disable the glasses’ mesh renderers: 

1.  In the Graph Editor, click and drag across all three sets of Find With Tag and Set Enabled nodes to select them as a group.

2.  Press Ctrl+D (macOS: Cmd+D) to duplicate these nodes and move them to one side of the original set so they aren’t overlapping any other nodes.

3.  Disable the Boolean on each of the new Set Enabled nodes (next to the purple circle icon).

You’re going to change the functionality of your script so that every time the user selects a button in your app, the mesh renderers of all the pairs of glasses are disabled. You can’t disable all the mesh renderers at once; you need to do this in a sequence. However, your visual script will run so quickly that it will appear as though all the mesh renderers are disabled at the same time. 

4.  Arrange your Find With Tag and Set Enabled node sets so they’re all on the same horizontal row. It doesn’t matter what order they are in, but keep the existing pairs of nodes together.

5.  Connect the flow output of the first Set Enabled node to the flow input of the second Find with Tag node.

6.  Connect the flow output of the second Set Enabled node to the flow input of the third Find with Tag node.

Next, you need to integrate this sequence into the other graph functionality.

The three sets of Find With Tag and Mesh Renderer: Set Enabled nodes duplicated in the Graph Editor. 

The three node sequences that disable mesh renderers now arranged and connected in a row.

The sequence of disabling all of the mesh renderers should occur right after the user selects a button, but before the graph looks for the correct mesh renderer to enable. Therefore, the functionality you just built should be placed between the On Button Click and Find with Tag nodes.

However, the new sequence is already longer than the other graphs you’ve built, and integrating it into each individual button graph will make the Graph Editor cluttered and harder to understand. Just as importantly, this sequence would be identical in all three graphs. In cases like this, rather than duplicating nodes over and over again, you can instead convert the sequence to a custom event. You can then call that event as a single node in your other graphs.

Watch the video or follow the instructions below to integrate a custom event into your node sequence: 

1.  In the Graph Editor, open the fuzzy finder and add a Custom Event node.

The Custom Event node requires one of two data type inputs: either a GameObject or a String. You’ll use a String to name the custom event, which will be used to call it in the next step.

2.  Set the String of the Custom Event node to “DisableRenderers”.

3.  Connect the flow output (arrow icon) of the Custom Event node to the flow input (arrow icon) of the first Find with Tag node in your sequence.

The node sequence that disables all glasses meshes should be inserted between the On Button Click and Find With Tag nodes for each button click sequence.

The Custom Event node named DisableRenderers connected to the beginning of the node sequence that disables all glasses mesh renderers.

You now have an event that can be called whenever you need it to run. To actually call it, you’re going to use an Event Trigger node:

1.  In the Graph Editor, open the fuzzy finder and add a Trigger Custom Event node.

You can think of a Custom Event Trigger node like a link. When this node is called, it will initiate the sequence of nodes in the custom event it’s associated with.

2.  In the string input on the Trigger node (orange circle icon), add “DisableRenderers”. Just like the Custom Event node, a Trigger node requires one of two data inputs. This data input must match the one associated with the custom event.

Important: The spelling and capitalization of DisableRenderers must be exactly the same in both the Custom Event and Trigger nodes. 

3.  Duplicate the Trigger node twice more.

4.  Disconnect the flow between the On Button Click node and the Find With Tag node in the first button graph by right-clicking on the flow output of the On Button Click node. 

Hint: Disconnect nodes by right-clicking on the connectors.

5.  Move the Get Variable and On Button Click nodes to make room for the Trigger node.

6.  Position the Trigger node in the space and then connect the flow output of the On Button Click node to the flow input of the Trigger node in the first graph.

7.  Connect the flow output of the Trigger node to the flow input of the Find With Tag node in the first graph.

8.  Repeat the previous steps for the remaining two button graphs.

The updated node sequences, now with a Custom Event Trigger node inserted into each sequence.

Now that you’ve implemented the new functionality for your app, you can test it:

1.  Select the Play button to test your changes to the app in the Unity Editor.

2.  Select each of the buttons and confirm that the glasses switch as expected.

3.  Select the Play button again to exit Play mode.

4.  In the Hierarchy window, select the GlassesGroup GameObject, and in the Inspector window, mark it as inactive.

6.  Open the Build Settings window (File > Build Settings).

7.  Make sure that your device is plugged in and then select Build and Run to build the app on your device.

8. The application will open automatically on your device. Now every time you select one of the UI buttons, the graph will disable all of the mesh renderers before enabling the one associated with the button you selected. Excellent!

Note: For a reminder of how to build to your device, you can review the process for Android or iOS.

The mesh switching functionality of the app is now complete! In this tutorial you learned how to create reusable groups of visual scripts called Events that you can call from multiple locations in your graphs. In the next tutorial, you’ll move on to building the material changing functionality for the glasses so the user can switch between the different colors of the glasses.

Update your graph to switch between glasses

1. Overview

2. Disable the glasses’ mesh renderers

3. Create a custom event

4. Add the custom event to the button graphs

5. Test your update

6. Next steps

Complete this tutorial