Setting Up a Collaborative AR Platform with WordPress, FeedGeorge, and Layar

For this year’s ASTE session I’ve been looking into easy, inexpensive ways to build platforms that support collaborative, geotagged augmented reality projects. It is a mouthful to say it that way, but the important characteristics of these platforms is that they are easy for a relatively non-technical person to set up, that they support contributions from a group, and also store information about a topic that can be placed on a map and visualized using an augmented reality browser like Layar. These solutions must also be free (as in beer).

One such solution can be implemented using WordPress, a plugin called FeedGeorge, and Layar. To get started with these tools there is a bit of signing up and configuration that must be done at the beginning, but once things are set up, creating geotagged posts requires much less overhead. There are four primary steps that will get you started.

1. Install & Configure FeedGeorge
2. Create and configure a Layar layer
3. Create your geolocated posts
4. Test and Publish your layer

Install FeedGeorgeAR

The purpose of these instructions is to walk through the steps of installing and configuring the FeedGeorgeAR plugin, setting up a new layer in Layar, and finally, geotagging your posts in WordPress so that they can appear in your Layar layer. After you’ve added all of your POIs (points of interest) as WordPress posts, you will be able to test your Layar layer and submit it to be published for the public.

1. To get started, click on Plugins, then click on the “Add New” link and search for FeedGeorge. You will see to plugins in the search result. Install FeedGeorge Augmented Reality plugin. Activate the plugin.

2.   After the plugin is activated, go to FG Augmented Reality -> Settings, which you will find in the bottom of the left sidebar. Here you will see red text at the top of the page, informing you that you must get an API Key to run FeedGeorge. No problem! Simply follow the link provided.

3. A window will pop up, prompting you to sign up for the FeedGeorge API. Fill out the remainder of the form. Your web site should already be filled in for you. Click the “Sign Up” button when you have finished.
4. A small window should popup with an API Key for you to copy. Copy the key text.

Back in WordPress, paste the API Key text you just copied into the FeedGeorge API Key box (under the red text), then “Update Options”.

5. Now You need to create a new layer, which is where you will post your POIs, in the Geolocation Layer screen. Click the “Geolocation Layer” link in the left sidebar to get there.

Type a layer name in the box, select the radius you want to cover, then click the “Add New Layer” button. (Search radius: Far: <2,000 meters; Medium: <500 meters; Near: <10 meters)

Create and Configure Your Layer in Layar

1. Go to the Layar web site and login in (assuming you have already created a developer account with them).

2. Once logged in, follow the “My Layers” button in the upper-right corner of the window.

3. Create a new layer by clicking the “Create a new layer” button.

 

• Layer name: Must be all lowercase, start with a letter, be unique, and may contain numbers, but no spaces or special characters. This cannot be changed
• Title: Can only be 18 characters long
• Short description: A 60-character description. This appears as the layer title in Layar
• Publisher name: This appears as the content publisher/owner in the Layar catalog
• API endpoint URL: This is why you just copied from the   WordPress plugin.
• Layer Type: Generic 2D
• Layar Vision: Do not enable

Click “Create Layer” when you’re finished filling out the information for your layer.

4. Layering & Indexing: Create Thumbnails for your layer. They appear in search results and in the app. More attractive-looking buttons mean users will be more likely to click into your layer.

Complete the rest of the information about your layer. Adding a long description and keywords will help make your layer more findable in search.

Change your layer to the latest version of Layar.

 

5. Look & Feel: Use the example linked in the upper-right corner to see exactly where the custom banners and colors will appear in your layer.

 

6. Set the Coverage area: After selecting the appropriate country, be sure and left-click (PC), or Command-click (Mac) to create your bounding boxes – if you do not, the boxes will not persist when you click “Save”. Just click, do not click + drag. You may have to wait for a few moments for a box to appear.

7. Filters: The filter values will almost always need to be increased. These values influence success of your POIs during testing. If your POIs do not return, increase the values.

 

8. Permissions: Set the publisher of your layer.

 

9. Additional Settings: Feel free to experiment with these. The “Take me there” option is very handy to have in-app.

 

That’s enough configuring of your layer for now. Let’s go back to your WordPress Dashboard.

Create Your Geolocated Posts

Now, you are ready to begin creating geolocated posts. These posts will contain the POIS (points of interest) that will appear in Layar. You can configure what sort of information you would like to associate with each POI in the Edit Post screen.

The first post is the hardest. I promise it gets easier!

1. Create a new post by going to Post ->Add New in the left sidebar of the WordPress Dashboard.

2. Items to specify in your post (see list below the following diagram):

1. Give your post a title
2. Add any post content you want to accompany the post on the site. This field will not be used for the Layar layer.
3. Create a new category for your layer and select it.
4. Create a tag for your layer
5. Drop down the “Select layer” options and select the title of your AR layer (this is used in Layar)
6. Select “Geolocation” to set lat/long coordinates for your post (this is used in Layar)
7. Type the address closest to the location you want to tag.
8. Drag/drop the marker once it is near the location. This creates the exact lat/long coordinates used in Layar.
9. Set a Featured Image

3. Click on the “Action” tab under Layar POI.

You can add actions for this content that will be available in Layar – for example:
(a) Link to other website
(b) Link to another layer
(c) Make a call
(d) Send an email
(e) Send a SMS

4. On the 2D/3D Images tab you can replace the default “marker’ with a 2D image by uploading image file (not more than mobile device’s screen size – e.g. 300×450 pixels). It’s optional to change the Size if the image is too big for the screen.

5. The last step is to add audio or video files to the content. There are two options for uploading the media

• Upload audio or video file from computer
• Insert Youtube video.

Insert YouTube video

Click on “Insert YouTube Video’ button. Copy and paste YouTube video URL (e.g. https://www.youtube.com/watch?v=20gkvAAwUag) in the form provided (make sure your URL isn’t HTTPS).

Click on “Add’ button before “Update/Publish’ the post.

6. Publish your post and continue creating posts to set your POIs.

Test Your Layer in Layar

After you’ve configured your new layer in Layar and made a few POIs on your WordPress site, you can start testing your Layar layer and request to be published so that anyone can view your POIs in Layar.

Testing your layer first helps to ensure your POIs are reaching Layar properly so that Layar publishes your layer faster.