Creating AR scenes in 30 minutes with no coding

Working with Augmented Reality is now effortless — thanks to Apple’s Reality Composer

AR is moving forward in huge strides — you can now have an AR tiger in your bedroom, thanks to Google. I wanted to find out if I could make more such AR experiences on my own. My research led me to Apple’s Reality Composer.

Apple claims that “Anyone can quickly prototype and produce content for AR experiences. Reality Composer lets you build animations and interactions on iOS and Mac to enrich your 3D content.”

I decided to give it a whirl, to see how it works. I made the setup below in less than 30 minutes. I was quite impressed by how quick it was to prototype with, so I wanted to document a quick start for those interested in trying it out.

Setting up the Earth and Moon in my bedroom

In this tutorial, we’ll figure out how to create an AR scenario in the GIF above. It can be made on a computer or phone, and can be run on your iPhone or iPad to view it in real-time.

The scenario, in this case, is our very own blue planet with a moon orbiting around it in real-time. So, here goes.

1. Download Reality Composer & Xcode

• Download the Reality Composer app on your iOS device so we can view or make our scene there.
• Check if you already have Xcode. If not, download Xcode from here. The latest version at the time of writing this article is Xcode 11. It includes everything we need, including ARKit and RealityKit. Be warned though, it can take up to 17GB after expanding the ZIP file, so make sure you have enough space on your disk. If you don’t have a Mac or don’t want to download Xcode, you can follow the exact same steps on the Reality Composer app on your iPad or iPhone.

This tutorial will be for the Desktop/laptop version since we need external 3D models. This requires Xcode but you can also follow along on your phone. The steps remain the same.

2. Getting the Earth and Moon 3D models

You can create your own 3D models on a software like Blender or Cinema4D, but it’s way easier to get some models online for prototyping purposes. Google Poly is a great website for getting free to use models.

Earth: https://poly.google.com/view/88CP80Kgb-u

Moon: https://poly.google.com/view/9OPocAqXM0u

Click on Download and select USDZ. It is important to choose USDZ format as that works natively with Reality Composer.

(You can skip this step if you’re on the phone, and emulate this with two spheres instead.)

3. Setting up a new Reality Composer file

Alright, so once we have Xcode and our 3d models, let’s set it up.

1. Open Xcode. From the menu, select Xcode > Open Developer Tool > Reality Composer
2. Select Horizontal to set the scene up on the floor. You can also explore other options for walls, or anchor a scene to an image and so on. You should see a basic scene set up with a cube at the centre. You can try moving it around with the mouse across any of the axes. Have a look at the right sidebar — here you can change properties like position, rotation, scale, material, and physics. You can play around with these settings to see how it changes the cube.

Creating a new file

4. Importing the Earth and the Moon

1. We won’t be needing the cube since we already have our 3D models, so let’s get rid of that by selecting it and hitting Delete.
2. Drag and drop the Earth from your downloads to the Reality Composer file. You’ll see that it’s HUGE, because well, it’s the Earth. So let’s scale it down from the right sidebar. Remember, the sizes correspond to real-life sizes.
3. We can now do the same with the Moon. Drag it into the file, and size it down. We can also move it around so it looks like it is orbiting around the Earth. Now adjust the Earth and Moon so they’re not too far off the ground (less than a meter) so it is easy to view on your phone.

(If you’re on your phone, go to the “+” icon on the top, and add a sphere for the Earth, and then another for the Moon. You can also give them colors from the “Look” tab)

Importing the Earth and Moon

5. Getting the Moon to orbit around the Earth

Now comes the exciting part. Let’s give the scene some motion.

1. Click on Behaviour in the top toolbar. This lets us create various different scenarios based on user input, or just otherwise too.
2. You should see a section pop up from the bottom. Here, we can create our own behaviours. Click on the “+” icon next to Behaviours to create a new one.
3. We can now add a Trigger for our animation. I want the animation to start as soon as the scene starts, but you can try playing around with other triggers too.
4. Next, let’s select our Action Sequence. Click on the “+” next to it, and select Orbit, since that is the behaviour we want in our scene.
5. You can now select your Affected Objects, which are the objects which will be affected by this motion. In this case, it is the moon. Select it then click on Done.
6. Next, let’s choose the Center around which the Moon will rotate. That’s going to be the Earth of course, unless a big meteor strikes it. So click on Choose next to the Centre option. Select the Earth and click on Done.
7. Now you can select a duration for how long you want it to last, and the number of revolutions the Moon should do around it, and viola, that should be it! I’ve kept around a minute and a half, with 10 revolutions, but you can play around with it.
8. Test your animation by clicking the Play icon on the top toolbar. This will play your animation inside Reality Composer. If it looks good, awesome! If not, try going through the steps or the video again to see if you missed anything.

Optional step: Try getting the Earth and Moon to rotate around their own axes using Behaviours.

Getting the Moon to orbit around the Earth

6. Viewing the animation in our “real” surrounding

What even is real anymore, amirite? Let’s view our AR app IRL 🌍🌚.

1. Save your file (if you haven’t done already). Now, share it via AirDrop via File > Share > AirDrop and receive it on your iPhone/iPad. If you already have the Reality Composer app installed, you should see it pop up there.
2. Open up the file you just received. Click on AR at the top to see your surroundings using the phone camera. You have to move the camera around a bit so it understands where a floor or horizontal surface is, so it can show the AR scene there.
3. Soon enough, the Earth and Moon should pop up! You can now click the Play icon at the top and see the orbiting motion happen in real life.

Playing the scene live!

Debugging & next steps

1. Debugging: If you can’t see the Earth and Moon after moving the camera around it might not be positioned well. Even if it is too large or small, you can always edit the position, scale etc. on the phone itself! That’s right, most of the things we just did, they can be done on the phone too, which I think is incredible. Play around with the properties, and have fun.
2. For the next steps, you can try out different triggers and action sequences. Try launching a rocket from the Earth to the Moon, or a meteor strike on Earth with a tap of your finger. Of course, the use of this can be modified to fit any prototyping needs, which is what this is built for. The best thing is, you have all this within reach, either on your phone or laptop.
3. Try exploring various triggers and animations. There are loads of variations and scenarios you can create for any prototyping need, or just for fun.

Thanks for reading! Would love to hear your thoughts on the article and if it was easy/hard to follow. All suggestions welcome! If you would like to see more of my work you can find see my portfolio, Instagram, Twitter, or follow me here on Medium. 🙌 You can also reach me at ahujasid@gmail.com.

Don’t forget to tag me if you end up using this tutorial!