Augmented Reality

Workshop

Powered by

In partnership with

1. Make sure you’re logged into Snapchat

- If you don’t have Snapchat you can scan the QR Code to download it on your phone. snapchat.com/download
- Make an account, skip making a Bitmoji.
- Make sure you remember/find your log in credentials (username and password), it will be important later on. If you don’t remember your log in credentials you will need to either reset them now or make a new account. Please have them ready for later steps.
- When downloading Snapchat, make sure to give camera permissions.
- With you username ready, click on this link and fill out the form:
https://ar.snap.com/community-meetup/signin?utm_source=Meetup&utm_medium=ORGANICPLATFORM&utm_campaign=SnapAR_Summer23&utm_term=USA_0920&utm_content=AlwaysOn

2. Scan this QR Code to access the AR Lens

An AR Lens is like a special filter for your phone's camera. It adds cool digital effects or objects to what you see through your camera, making your photos and videos more fun and interesting. We will be using the AR Lens on Snapchat.

Scanning should open up Snapchat into the Augmented Reality Lens we will learn more about.

3. Once you have the filter open on your phone,

point it to the image below

You should see an image pop out.

Your are doing

great!

Now we’re going to

customize

the AR Lens.

4. Download Lens Studio on your computer

You can skip this step if you are using a borrowed device.

https://ar.snap.com/download

You may need to log in to your Snapchat account once Lens Studio has installed.

5. Download the project file

This file contains the Lens Studio AR project.

https://drive.google.com/file/d/1UpdzfRPwxJvAh9mLl_d7ZSnN3irREat-/view?usp=sharing

Once it has downloaded, open the folder.
Double click on ImageTrackerToronto.lsproj

Your Lens Studio set up should look something like this

6. Lens Studio (Snapchat) QR Code

In the top right corner click the arrow next to “send to all devices”

you should see the option to pair your Snapchat account

You should see a Snap QR Code in Lens Studio once you click “Pair new Snapchat Account”

7. Pair your phone to Lens Studio

With Snapchat open on your phone, scan the Snap QR Code in Lens Studio

8. Send the Lens to your device

To make sure that we are able to test any changes we make, we want to

make sure we can send the effect to our devices directly from Lens Studio.

Keep Snapchat open on your phone.
In Lens Studio, on the top right, click “Send to Snapchat”.
Once it sends, in Snapchat you should click on the tab that says ‘Your Lens is ready to preview!’.

9. Make sure the AR Lens works just like before

Point it at the image we are tracking again to make sure it works.

You will see this hint telling you to find the image just like before.

You are

Awesome!

Now when we make changes to the lens we’ll easily be able to test it on our own phones.

How can we share the AR experience with our friends?

We have to publish the lens to Snapchat.

10. In the top left corner of Lens Studio click on ‘Publish Lens’.

Publishing will allow us to make the experience available on other people’s phones.

If a dialogue box pops up, click proceed.

11. When the upload succeeds, we will get a message and the browser window should open automatically.

If the window doesn’t open automatically, the dialogue box will have a link you can click.

You will likely be prompted to log into your Snapchat account.

When the browser opens and you are logged in we will select any folder and submit this new Lens.

12. The Lens Details page is the final step to publish our AR Lens.

This page allows us to enter information to help people find the Lens.

We will type into Tags: #SSM23 and click on Add tag.

Then we will choose any category for Primary Category

and finally, we will click ‘Submit Lens’.

After typing #SSM23, remember to click on Add tag, this is helpful for us :)

After a few hours to a couple days you will actually be able to see the effect on the Lenses tab of your own account in Snapchat.

Woah!

You just created an AR effect anyone can use.

You just used the most advanced visual technology known to create something.

That’s cool…

Now that we know how to test our effects and how to upload them to Lens Studio,

let’s do some edits to the effect.

13. We can easily change a few of the visuals that are already in the project file.

In the object panel (left side), under Camera and Image Marker, we can change the following:

Background
Trees
NeonShape

14. We are going to change each of them, but will show just one example in this tutorial.

Make sure the images are in view in the viewport in the middle. You made need to pan to it.

To start off we will change the Trees object to a different image.

1. Click on Trees
2. On the right side, in the inspector panel, under ‘Image’ click on ‘Texture’. Right now it should be set to trees 1.
3. In the pop up, open the ‘Trees [Class]’ folder and click on ‘Trees2’.
4. In the inspector panel under ‘Transform’ we will set the ‘Y’ of position to ‘-5‘ to align the image in 3d space.