---
title: 3 Tips for Creating Amazing WebAR Experiences with Sky Effects
description: Create immersive WebAR experiences with 8th Wall Sky Effects. Learn tips for seamless world-building with augmented skies. Get started with our helpful resources now.
image: https://info.nianticspatial.com/hubfs/Screen%20Shot%202023-03-20%20at%201.23.31%20PM.png
---

![placeholder_200x200](https://static.hubspot.com/final/img/content/email-template-images/placeholder_200x200.png "placeholder_200x200")

## [3 Tips for Creating Amazing WebAR Experiences with Sky Effects](https://info.nianticspatial.com/blog/3-tips-for-creating-amazing-webar-experiences-with-sky-effects)

 Create immersive WebAR experiences with 8th Wall Sky Effects. Learn tips for seamless world-building with augmented skies. Get started with our helpful resources now.

[8th Wall Sky Effects](https://www.8thwall.com/blog/post/95505174942/introducing-sky-effects) gives developers tools to augment the sky and create new worlds with WebAR. To help you get started, we’ve compiled a few tips for creating engaging and seamless WebAR experiences.

**Tip 1: Have a focal point**

Sky Effects without a focal point can be overwhelming and cause users to quickly pan around, making the transition between the real world and the virtual world more noticeable. Keep users focused on a specific area or entity, and further blend the worlds by applying a shader to the camera feed.

![fpbp](https://info.nianticspatial.com/hs-fs/hubfs/fpbp.png?width=263&height=496&name=fpbp.png)

**Tip 2: Use remote authoring**

The A-Frame Inspector is a powerful tool that helps to precisely position content in the sky. Quickly find precise position values using A-Frame Inspector's visual transform tools and scene viewer, instead of iterative coding and testing.

To get started, add the sky-remote-authoring component to the <a-scene> after xrlayers, or manually remove all xr components from the scene (xrweb, xrextras-loading, etc). 

![rabp](https://info.nianticspatial.com/hs-fs/hubfs/rabp.png?width=512&height=450&name=rabp.png)

Open the inspector (<ctrl> + <alt> + i) and click play. Position an entity and copy the transformations (position, rotation, etc) to the entity in your 8th Wall project code.

**Tip 3: Use pivot entities**

To rotate an entity around the camera, make it a child of an empty pivot entity:

<a-entity id=”santa-pivot”>

  <a-plane id=”santa” position=”0 10 -10”></a-plane>

</a-entity>

![unnamed](https://info.nianticspatial.com/hs-fs/hubfs/unnamed.gif?width=434&height=480&name=unnamed.gif)

\[pivot entity is visualized with the green box\]

Applying rotation to the pivot entity will rotate the children around the user at a fixed distance. Pivot entities can also be helpful for positioning planes which always face the user.

**More tips and resources**

Use these tips in your next project to create memorable experiences that users will love. To learn more about using 8th Wall and Sky Effects, read through the [documentation](https://www.8thwall.com/docs/web/#xr8layerscontroller) and check out the [sample project](https://www.8thwall.com/8thwall/empty-sky). 

We can’t wait to see what you create!

![Evan Carlson](https://info.nianticspatial.com/hs-fs/hubfs/evan%20(2).png?width=100&height=100&name=evan%20(2).png)

#### Written by [Evan Carlson](https://info.nianticspatial.com/blog/author/evan-carlson)

Developer Support Engineer