Layar Events in New York and San Francisco

© 2010, Layar B.V.

How to develop layersMarc René Gardeya, CEO HOPPALA

www.hoppala.eu

Geocoded POIs

GPS Compass

Markerless Tracking

layer service

Layar App Layar Cloud Webspace

Architecture

Browser DNS / Proxy Webspace

HTML pages

Architecture

Browser DNS / Proxy

HTTP Request

HTTP Response

Webspace

HTML pages

Architecture

Layar App Layar Cloud

HTTP Request

HTTP Response (JSON)

layer service

Webspace

Architecture

Become a Layar Developer

Create a layer

Develop a layer service

© 2010, Layar B.V.

Become a Layar Developer

http://dev.layar.com

Create a Developer Account

Sign in with yourGoogle Account ID

Create a Publisher Account

http://www.layar.com

Link Accounts

http://www.layar.com

© 2010, Layar B.V.

Create a layer

http://dev.layar.com

Create a layer

http://mydomain.com/poi.php

mylayer

© 2010, Layar B.V.

Develop a layer service

<?php define( 'LAYERNAME', 'mylayer' ); $hotspots = array();

$response = array( 'hotspots' => $hotspots, 'layer' => LAYERNAME, 'errorCode' => 0, );

$json = json_encode( $response );

header( 'Content-type: application/json'); echo $json;?>

Basic layer service

http://mydomain.com/poi.php

{ "hotspots":[], "layer":"mylayer", "errorCode":0}

HTTP response (JSON)

Adding hotspots

<?php $hotspots = array();

$hotspot = array( 'title' => 'Restaurant Eberhard Ludwig', 'line2' => '', 'line3' => '', 'line4' => '', 'attribution' => 'Footnote', 'lat' => (int)(48.8 * 1000000.0), 'lon' => (int)(9.2 * 1000000.0) ); $hotspots[] = $hotspot;?>

Adding hotspots

World Geodetic System 1984

-Longitude +Longitude

+Latitude

-Latitude

Latitude/Longitude: 37.78 / -122.42

<?php $lat = $_GET['lat']; $lon = $_GET['lon'];

$hotspot = array( 'title' => 'Sticky POI', 'line2' => 'It sits right', 'line3' => 'next to you', 'line4' => '', 'attribution' => 'footnote', 'lat' => (int)($lat + 0.0005) * 1000000.0), 'lon' => (int)($lon * 1000000.0) );?>

Playing with coordinates

Adding actions

Go to website

<?php $hotspot = array( 'title' => 'Bäckerei Blank',

...

'actions' => array( array( 'label' => 'Go to website', 'uri' => 'http://www.hoppala.eu' ) ) );?>

Adding actions

Adding audio

<?php $hotspot = array( 'title' => 'Bäckerei Blank',

...

'actions' => array( array( 'label' => 'Play song', 'uri' => 'audio://mydomain.com/song.mp3' ) ) );?>

Adding audio

Adding video

...WINVOLVE...

<?php $hotspot = array( 'title' => 'Quiznos store',

...

'actions' => array( array( 'label' => 'Play video', 'uri' => 'video://mydomain.com/video.3gp' ) ) );?>

Adding video

Auto trigger

Muzar.org

<?php $hotspot = array( 'title' => 'Splinter Cell',

...

'actions' => array( array( 'label' => 'Play video', 'uri' => 'video://mydomain.com/explosion.3gp', 'autoTriggerRange' => 5, 'autoTriggerOnly' => true ) ) );?>

Auto trigger

Berlin Wall 3D

<?php $hotspot = array( ...

'dimension' => 3, 'object' => array( 'baseURL' => 'http://mydomain.com/', 'full' => 'mymodel.l3d ', 'size' => 20 // tell client before loading model ), 'transform' => array( 'angle' => 0, 'rel' => FALSE, 'scale' => 10 // upscale model ) );?>

Adding 3D models

3D Model Converter

Berlin Wall 3D

© 2010, Layar B.V.

More immersive experiences

POI interaction

Background actions

Moving POIs

Flexible refresh rate

Place POIs

Action on entire layer

Happy easter!Looking forward to see you again!

HOPPALA Goes Easter

Focus on user experience

UI Customization

Oscillate

Rotate

Texture animation

Animations

Quiznos 3D animation

...WINVOLVE...

© 2010, Layar B.V.

Don‘t feel like coding?

© 2010, Layar B.V.

Layar CMS in the cloud

www.hoppala.eu

© 2010, Layar B.V.

Thank you!Marc René Gardeya, CEO HOPPALA

www.hoppala.eu

www.layar.com/create