Today Layar, Metaio and Wikitude, together with the OGC (Open Geospatial Consortium) announced that there will be a demonstration of interoperability between the three browsers of our companies during the upcoming Mobile World Congress. What does it mean and is it important?

Say you’re someone hosting a big festival and are thinking “wouldn’t it be great if I could help the visitors to my event find their way using AR?”. The most popular apps for location-based AR are Layar, Junaio (by Metaio) and Wikitude. So currently you’re going to have to choose a platform and an app for your visitors to download. Or you can make three versions of your AR experience so that it will work with all three apps. Not really the ideal world for creating content for AR.

Actually already more than 4 years ago, Peter Meier (CTO of Metaio), Martin Lechner (CTO of Wikitude) and myself started meeting on a regular basis as part of the AR Standards Community. We knew that if AR was to become an important medium for connecting the physical world to the digital world, it would depend on content publishers being able to create massive amounts of content. And for that to happen, you have to make content publishers’ job easy. That is what standards are for. And one day there will be a standard in this industry. Christine Perey, the founder of the AR Standards Community, has been advocating this right from the early days of the AR Browsers in 2009. She did a great job at pushing Peter, Martin and myself to actively pursue that goal.

There isn’t yet a standard for AR. The ARML 2.0 draft specification proposed by OGC is a first small step towards such a standard, but we’re not there yet. All the companies in this industry are still innovating at a pace that makes it difficult to settle on a common language and common standard in a short period of time.

So during the fall of 2013, again with Christine holding the carrot and stick to ensure progress, we started working on a more pragmatic approach: Rather than having to finalise a standard and support it in our browsers, we (Metaio, Wikitude and Layar) decided to see what it would take to make our browsers interoperable: content made for Junaio should be displayed in Layar and Wikitude and vice versa. Seac02, also an AR browser and platform maker, joined the technical discussions. In January this year we agreed on a technical specification on how to realize interoperability. 

The past few months Stefan Misslinger from Metaio —- replacing Peter who apparently didn’t want to do the nitty-gritty work :-) —- Martin and myself collaborated to achieve this: interoperability between our apps for geo-located content. I quote Martin: 

“I think it’s fair to say that our companies never worked as close together as over the last couple of weeks :-) Was great to see that we can achieve what we wanted to achieve!”

Is this the end goal? No, of course not: Interoperability is still pretty limited. We only support a very basic set of common features. For AR to really become a mass medium, we need to go much further: support interactivity, vision-based content, 3D, etc…

It’s been great working together like this with Stefan, Peter and Martin. Even though we’re competitors, we all want the same: To see a world where AR becomes common place, where content providers populate our physical world with digital content and where end-users can see all of it with one app.

Below is a detailed look at Layar API v.7.1 from Layar CTO Dirk Groten.

We just released new versions of Layar for both the iOS and Android platforms, going from version 7.0.x to 7.1. The release notes for end-users mention only a few minor fixes, so this wouldn’t seem to justify a version update. Behind the scenes, however, this is a major update which includes support for the new API v7.1. 

So exactly what did we introduce with the new API?

• Support for HTML widgets - Objects can now have content type text/html, meaning that HTML content can be rendered directly in AR.
• Slicing of reference images - Reference images can be linked to other reference images, so that when one reference image is recognized and tracked, content placed on the linked reference images will also be shown.

Reference Image Slicing

When, as a content provider, you upload a page to augment using the Layar Creator or via the Layar Publishing site, we will generate a feature binary file for your image which contains the unique tracking features of your image. 

When the user points his phone to your page, we’ll recognize it first server-side, send the corresponding feature file to the phone and then match the features with the camera image, allowing us to display content at the right position on top of the page.

This works fine if a relatively large number of features can be matched. In other words, the user needs to hold his phone in such a way that a significant part of the page (more or less half is needed) is in the camera view. So what if the user holds his phone closer to the page in order to better see the content? If there aren’t enough features to match, we’ll lose track of the image and the augments will disappear. 

That’s why we’ve introduced what we call “slicing.” By slicing the reference image into smaller pieces, we can extract more features for each part and therefore match enough features even if the user holds his phone close to the page. The trick here is that features are not scaling-invariant, i.e., just extracting more features on the larger image wouldn’t have done the job (except creating a larger file to download which we want to avoid). 

So now every page you upload using the Layar Creator will automatically be sliced where appropriate. The device will load features for the entire page but also for parts of the page so that when the user zooms in, tracking is still retained. 

Try it out! You’ll see that you can now hold your phone much closer to the page and still see the content appear with Layar v7.1.

For Layar developers hosting their own layers, we can’t apply the same trick, because we don’t know where the content is placed and we want to avoid randomly generate additional feature files that users have to download to their device. The slicing API however does allow some neat tricks, like being able to fully track all sides of a box simultaneously, but that will be the subject of another blog post very soon.

HTML Widgets

The other big change in 7.1 is the added support for text/html augments. Up to now, all you could place in AR were static objects (images or 3D objects). If you hosted your own layer you could make them seem dynamic by generating them on-the-fly on your server. Our API allowed you to replace a POI with another, for example to give a dynamic effect when a user clicked on a POI.

With the support of HTML, we make it much easier for you to create dynamic content. The content of the object is fetched live from the URL you specify when it needs to be rendered and in the same way can be updated live when the user interacts with it. Some examples:

• Show the live tennis match scores on top of a page about a particular player. When clicking on the scoreboard, a full-screen view is opened showing detailed stats about the match.
• Display the latest tweet with hashtag #layar: every user pointing his device at the page will see the most recent tweet about Layar. You can script your object to automatically refresh and if a new tweet is posted, replace the content to reflect the latest tweet.
• Create a rating widget that you place on every article in your printed catalog. Users can rate an article and see the average rating for all users, all live.
• Let users swipe through different images of the same couch placed on top of an image of a living room. A simple image carousel does the trick.

The documentation for the new API can be found here. All you have to do to create an HTML widget is to specify a URL for the HTML content to be fetched and specify the pixel size of your widget. That’s it. Layar will open a little web view at the location specified and render your HTML content inside it. 

What’s important to keep in mind is the following:

• The background is transparent, unless you specifically set a background color in your CSS. This way, you can place multiple elements in one page that seem to be independent of each other. E.g. use this to place a button that controls another part of the page, like a ‘dress up’ button that when clicked will make a dress appear on top of a model on the page.
• Whenever content is loaded for the entire page (e.g. a link is clicked that would cause a page reload), that content will be loaded in full-screen mode rather than within the HTML widget. This makes it easy to create a widget with dynamic content linking to more detailed pages that should be browsed normally
• We have full support for Javascript. So if you want to load content dynamically inside your widget, use AJAX calls and replace elements in the DOM tree with new elements. For example, you let users vote within the widget, post their vote and replace the content of the widget to show the current voting once the vote has been cast.

As a Layar Developer, you can start experimenting with HTML widgets now. Just download the latest versions of Layar for iPhone or Android to try it out. We’re curious to hear your findings, especially since we’re a bit dependent on iOS and Android native support of HTML as to what can be done and what cannot. 

What’s Next?

HTML Widgets in Layar Creator

HTML widgets are now supported in our app, but it’s not yet possible to place them using the Layar Creator. We’ll add that very soon! You’ll be able to just drag-and-drop your “viewport” to the page you want to augment, enter the URL of the HTML to be rendered in the widget and directly preview the content on top of your page. It doesn’t get much simpler than that!

It’ll be easy enough to place an HTML widget using the Layar Creator, but someone still needs to do the programming to create useful and appealing content. For Layar developers, this is a great opportunity to create a library of widgets that others can use. 

The following is a blog post from Layar’s Dirk Groten.

Layar has had an exciting year since the introduction of Layar Vision last summer. Since then, we’ve made quite a few changes to our app and to the publishing platform. We changed the user interface to focus more on Layar Vision in 6.1 and added AR video in 6.2. We also introduced the Layar Creator, an easy tool to create content for Layar Vision, and we introduced a new app for user-generated AR, Stiktu. 

We haven’t always announced these changes much in advance, leaving our content creators in the dark about our future plans and commitments to them. Let me change this and give you a heads-up about what you can expect from us in the coming months.

Layar 7.0

The next version of the Layar app, Layar 7.0, will solve a number of issues our users are currently having:

• By separating Vision from Geo (location-based with POIs) layers we can switch off a few sensors when using vision AR. That way you won’t be bothered anymore by requests to switch on your GPS or to wave your phone in a figure-eight pattern due to compass interference when just viewing augmented content on top of printed materials.
• We’ll make it clearer to users that there are two sides to our app: Vision and Geo. We’ll open up in Vision (scan) mode like in Layar 6.2 but it will be clearer how to find the Geo layers. And we’re adding instructions to explain these two modes.
• We’re changing the UI drastically on Android to comply better to the Ice Cream Sandwich UI guidelines (Android 4.x), allowing the app to behave more like a native Android app.
• There are two API changes in Layar 7.0: In the getPOI request you’ll receive all images that were recognized instead of just one, and you can specify actions to share content specifically on Facebook or Twitter.

Let me emphasize that we are committed to continue supporting Geo layers in Layar. We strongly believe that geo-location and location-based content have an important role to play in AR now and in the future.

We will continue adding features for layer developers, both for Geo and Vision AR. When we introduced AR video in Layar 6.2, it was supported for both Vision as well as for Geo layers.

We decided to stop supporting a mix of Vision and Geo in one layer due to the confusing message to end users who didn’t understand what to do. It is still possible to link from vision to geo and vice versa by using the layar:// URL scheme (intent) if you still need to mix the two experiences.

Layar 7.0 is scheduled for release in early August.

Support for HTML Augments in Layar 7.1

So after Layar 7.0, what’s next? HTML content! Our next release after Layar 7.0 will introduce support for HTML augments. You’ll be able to create dynamic AR content by using content-type text/html for your AR objects.

This enables a whole bunch of new experiences, where the content viewed in AR is dynamic because it’s directly being fetched from the web. Let me list a couple of features we’ll support in HTML objects:

• WebKit support of HTML, CSS and Javascript. Since we’re using WebKit to render the content, a large part of what you can do in the mobile browser (Safari and Chrome) can also be done in AR. 
• You’ll be able to set the CSS pixel width and height of the HTML augment. The actual size of the augment in AR will be based on the existing ‘size’ parameter, like for images. 
• You’ll have the choice to enable or disable direct user interaction with the HTML content. When enabled, the content will behave like in a normal browser. For example, if you make a poll the user can click ‘yes’ or ‘no’ in AR and directly see the result in AR. When disabled, user clicks are passed to the Layar app and the usual POI actions can be triggered. For example, you can display an up-to-date live score for a tennis match that shows a mobile page in full screen with more information when the user clicks on it.

And again this applies to both Vision and Geo layers. Layar 7.1 is scheduled for release in October. 

Layar Creator

Of course we are committed to continuously improve the Layar Creator and add features that make it even easier to publish AR on print.

• We will make it easier to add video augments to your print. Due to some technical limitations there are currently a couple of different ways to add video. We’ll simplify the flow so you don’t have to worry about the technology anymore.
• We’ll add more standard buttons. The email button, for example, was meant to let users share something via email, but didn’t allow you to use it for contacting you (pre-filling the recipient email address).
• Support for HTML in Layar means we can also start adding more dynamic types of buttons in the Layar Creator. 
• And we’re working on a way for publishers to claim exclusivity on their pages, so that you can be assured no one else can ‘hijack’ your page. This assumes you’re the exclusive copyright owner of all artwork on the page of course.

Features in the Layar Creator will be rolled out regularly in small updates, watch our Layar Creator newsletter to be informed about the dates.

So that’s what we’ve got planned for the rest of the summer. We’re excited to keep making progress and hope you’ll join us. If you’d like to provide feedback, please visit our contact form!

Here at Layar, we’ve always prided ourselves on our ability to provide the most comprehensive documentation and support for our developers out of any Augmented Reality platform. Today, we’re thrilled to announce another step toward making developing on the Layar platform easier than ever.

This week we launched a brand new environment to help developers find documentation about Layar. How to become a developer, how to make layers, how to implement the Player, Layar Vision help - it’s all there, and now it’s super easy to search and navigate.

The goal of the new environment is to make it easier for developers to find answers to any questions they have about Layar development. Notice the three headers “Browser & Platform,” “Player” and “Connect,” as well as the sidebar with collapsing drop-down menus. These have been arranged to make finding answers quick and easy.

The new documentation site is the perfect place to start if you have a question as a developer. Use the search functionality or navigate through topics in the sidebar. If you still can’t find your answer, head on over to our DevSupport environment and search the forums or submit a ticket there.

Our old documentation site, the PBWorks Wiki, has now been completely replaced by this new environment. Not only is the documentation now under a the roof of the Layar.com website, but the look and feel of the site are both now far more user friendly. We also have control over features and functionality, so let us know if you have any feedback or suggestions to make it even easier.

We hope you enjoy the new documentation page. Let us know what you think!

If you’ve followed some of our recent posts about Layar Vision projects (for instance, the LINDA. and Make Magazine promotions) then you may have come across the logo you see on the right. That’s the “View with Layar” logo. So what is it?

In essence, we encourage that developers and campaign managers place the icon on the images they are augmenting with Layar Vision content. This way, whenever you see the icon, you know there’s an extra experience to be viewed with Layar.

Augmented reality campaigns rely heavily on strong calls-to-action from products. We’ve created the “View with Layar” logo to help get users to pull out their phone and experience a new world of digital content. The logo draws the attention of the user and clearly directs them to interact with augmented reality.

We’ve recently updated the Layar Wiki (a tool mainly for developers) with additional information regarding the icon, and wanted to share some of those details with you here on the blog.

For developers using the icon, we ask that they make sure it is placed so that it is clearly visible to users and is not obstructed by anything else around it. Also, we ask that you do not alter the icon itself in any way, including changing the color or aspect ratio. For more guidelines, see the Wiki article mentioned above.

But all you need to know is that wherever you see the “View with Layar” icon, you can pull out your phone, fire up Layar and quickly view an interactive digital experience.