Mai, 12th 2010, PHP Usergroup Stuttgart

1. Mobile
Augmented Reality
Marc René Gardeya - - www.hoppala.eu

2. www.hoppala.eu
Marc René Gardeya, Founder and CEO

3. Mobile
Augmented Reality
What it is and how it works
Layar and PHP
Marc René Gardeya - - www.hoppala.eu

4. Augmented Reality
airtagging
optic internet
synthetic environment
Marc René Gardeya - - www.hoppala.eu

5. Marc René Gardeya - - www.hoppala.eu

6. It‘s been there before
Columbia University Computer Graphics and User Interfaces Lab
Marc René Gardeya - - www.hoppala.eu

7. What‘s so great
combines real and virtual
interactive and realtime
3D
Marc René Gardeya - - www.hoppala.eu

8. How it works
Camera
Screen
Location
Direction
Information
Layer developed by Hoppala
Marc René Gardeya - - www.hoppala.eu

9. Markerless
Tracking
gps compass
Marc René Gardeya - - www.hoppala.eu

10. Markerbased
Tracking
Marc René Gardeya - - www.hoppala.eu

11. Markerless Markerbased
works everywhere needs markers
only outside works inside
Marc René Gardeya - - www.hoppala.eu

12. Future
converging technologies
image recognition
standardization
Marc René Gardeya - - www.hoppala.eu

13. Marc René Gardeya - - www.hoppala.eu

14. Layar Open Platform
Brands & Content
Developers Users
Marc René Gardeya - - www.hoppala.eu

15. Worlds Largest Platform
500 layers published
2.000 layers in development
3.000 content creators worldwide
1.500.000 downloads
Android & iPhone
Marc René Gardeya - - www.hoppala.eu

16. Layar Distribution
Global preinstallation
Tens of millions of phones with Layar
preinstalled already in the shops
#1 in all markets except Japan (#2)
Marc René Gardeya - - www.hoppala.eu

17. Best practices
Marc René Gardeya - - www.hoppala.eu

18. City marketing
Layer developed by NAi / IN10
Marc René Gardeya - - www.hoppala.eu

19. Entertainment
Layer developed by AugmentReality
Marc René Gardeya - - www.hoppala.eu

20. Art
Chris Manzione: „Key element of our layer is that the objects are site-specific. This
is different than most other digital media that can be easily transfered and shared.
This requires the users presence and interaction with the site itself.“
Layer developed by Superimpose / VPAP
Marc René Gardeya - - www.hoppala.eu

21. Ubisoft‘s Splintercell
Layer developed by Muzar.org
Marc René Gardeya - - www.hoppala.eu

22. www.hoppala.eu

23. Easter Greetings
Place 3D easter eggs from web and mobile
Leave a message
for your friend
Happy easter!
again!
Loo king forward to see you
Layer developed by Hoppala
Marc René Gardeya - - www.hoppala.eu

24. Berlin Wall
Layer developed by Hoppala / Superimpose
Marc René Gardeya - - www.hoppala.eu

25. Marc René Gardeya - - www.hoppala.eu

26. Layar Architecture
Marc René Gardeya - - www.hoppala.eu

27. Basic webservice
<?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;
?>
Marc René Gardeya - - www.hoppala.eu

28. JSON Response
{
"hotspots":[],
"layer":"mylayer",
"errorCode":0
}
Marc René Gardeya - - www.hoppala.eu

29. Return Points of Interest
Marc René Gardeya - - www.hoppala.eu

30. Return Points of Interest
<?php
$hotspots = array();
$hotspot = array(
'title' => 'Restaurant',
'line2' => '',
'line3' => '',
'line4' => '',
'attribution' => 'Footnote',
'lat' => (int)(48.8 * 1000000.0),
'lon' => (int)(9.2 * 1000000.0)
);
$hotspots[] = $hotspot;
?>
Marc René Gardeya - - www.hoppala.eu

31. World Geodetic System 1984
Stuttgart
WGS 84 Latitude: 48.8
Longitude: 9.2
+Latitude
-Latitude
-Longitude +Longitude
Marc René Gardeya - - www.hoppala.eu

32. POI next to you
<?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)
);
?>
Marc René Gardeya - - www.hoppala.eu

33. Provide actions
Marc René Gardeya - - www.hoppala.eu

34. Provide actions
<?php
$hotspot = array(
'title' => 'Bäckerei Blank',
...
'actions' => array(
array(
'label' => 'Go to website',
'uri' => 'http://www.hoppala.eu'
)
)
);
?>
Marc René Gardeya - - www.hoppala.eu

35. 3D model
Marc René Gardeya - - www.hoppala.eu

36. 3D model
<?php
$hotspot = array(
...
'dimension' => 1,
'object' => array(
'baseURL' => BASEURL,
'full' => MODEL,
'size' => 20 // tell client before loading model
),
'transform' => array(
'angle' => 0,
'rel' => FALSE,
'scale' => 10 // make model 10 times larger
)
);
?>
Marc René Gardeya - - www.hoppala.eu

37. www.layar.com
Marc René Gardeya - - www.hoppala.eu

38. THANK YO U!
www.hoppala.eu
Marc René Gardeya, Founder and CEO