Using beacons to open boxes and tag plants in a greenhouse!

1. GETTING PHYSICAL
WITH THE BEACON-
ENABLED WEB
J E N L O O P E R
D E V E L O P E R A DVO C AT E , T E L E R I K
@ J E N L O O P E R

2. $WHOAMI
Ph.D. … in Medieval French
Retrained!
Programmer14 yrs+
ladeezfirstmedia.com, thinglearn.com
Now DevRel@Telerik

3. THE CHALLENGE
•Craft a magnetic cultural experience
•Do no harm
•Zero entrance barrier
•Use bleeding-edge tech
The bleeding edge

4. WHAT ARE MUSEUMS DOING NOW?
Ain’t no school like the old school…

5. BUT THEY ARE FLIRTING WITH
TECHNOLOGY!

6. WHAT ARE MUSEUMS DOING NOW?
Musée de Cluny (Paris) - QR installation

7. WHAT ARE MUSEUMS DOING NOW?
MOMA (NYC)

8. WHAT ARE MUSEUMS DOING NOW?
Musée Nissim de Camondo (Paris)

9. WHAT ARE MUSEUMS DOING NOW?
Metropolitan Museum (NYC)

10. WHAT ARE MUSEUMS DOING NOW?
Metropolitan Museum (NYC)

11. WHAT’S WRONG WITH THESE
APPROACHES?
I do not want your stupid app
I will not use this siloed crap.
I do not like them, Sam-I-am.
I do not want this mobile spam!
(Thanks,Techcrunch)

12. THERE MUST BE A BETTER WAY!
To not maintain an app
A scalable tech solution
Flexibility
No/minimal downloads
An active/immersive experience
Something to take away
Allegra at the
Phillips
Collection,
Washington DC
A museum wants:
A visitor wants:

13. TREASURE
BOXES
A N E W C O N C E P T

14. BEACON-ENABLED TREASURE BOXES

15. PHOTON-DRIVEN TREASURE BOXES

16. BUT I THOUGHT BEACONS ONLY SENT
OUT UUIDS?

17. LEVERAGE THE PHYSICAL WEB

18. LET’S MAKE A TREASURE BOX!

19. CONFIGURE A PHOTON

20. CONSTRUCT AN INTERNAL BOX LATCH

21. FINAL LATCH CONSTRUCTION

22. CONFIGURE A BEACON

23. INSTALL BEACON INTO BOX

24. BUILD A WEB SITE TO CONNECT
TO THE PHOTON

25. FLASH CODE TO THE PHOTON
setPosition function makes
the servo arm change
position

26. CONNECT WEBSITE TO PHOTON VIA
PARTICLE.IO API
var dataToPost = {
params:140,
access_token:access
};
$.ajax({
url: 'https://api.particle.io/v1/devices/’+device_id+'/setPosition/',
type:'POST',
data:dataToPost
}).done(function() {
toastr.success("The box has been opened!");
}).fail(function() {
toastr.error("Sorry,there was a problem opening this box");
});
Tell Photon how far to move
the servo arm, give access
token to Photon
Post to the Particle API to
tell the Photon to move

27. NOW, SET UP YOUR VENUE*
*ASSUMES YOU HAVE PERMISSION
• Connect Photon to the venue’s wifi
• Connect treasure box to power
(cord or battery)
• Set up box near target exhibit
• Educate visitors on how to
experience it on their devices

28. THE RESULT!

29. CHALLENGES

30. MAINTAINING A FLEET OF BOXES
•Breakage
•Power issues (battery and external power)
•Memento maintenance
•Maintaining beacons (battery issues)

31. MAINTAINING A WEB PRESENCE
•Security issues
•Scaling your site to support multiple boxes

32. WHAT’S NEXT?
• Bluz.io could simplify the Photon integration (Bluetooth
+ Battery + Photon all in one)
• Content management of a web presence to support
entire cultural site
• Android integration!!
• More browser support

33. LET’S PLAY!
Download Chrome and enable the physical web.
Make sure bluetooth is on, and find the box!
@jenlooper
http://www.ladeezfirstmedia.com
Telerik DevRel @telerik
jen.looper@telerik.com