Tutorial spot-cloud
•Download as PPTX, PDF•
0 likes•446 views
This document provides a tutorial for creating interactive content using iBeacons and the Spot app. It outlines how iBeacon and Spot work, preparation needed like HTML5 knowledge and hosting, using the Spot Project Hub to create a beacon group and campaign with HTML5 content, and tips for developing the HTML5 content like using frameworks and handling mobile browser issues.
Report
Share
Tutorial spot-cloud
- 1. Tutorial for Creating interactive iBeacon content with HTML5 and Spot 2014.05.26 0
- 2. Confidential and Proprietary to KKlabs Inc. Overview • How iBeacon and Spot the App works • Preparation • Working with Spot Project Hub • Tips for HTML5 content for mobile
- 3. Confidential and Proprietary to KKlabs Inc. How iBeacon and Spot works
- 4. Confidential and Proprietary to KKlabs Inc. Preparation - Know how to write the code of JavaScript, CSS3 and HTML5 - Hosting space for your HTML5 contents and assets - An account of Spot Project Hub - (Optional) Spot the App installed on mobile device - (Optional) Spot Beacons
- 5. Confidential and Proprietary to KKlabs Inc. Working with Spot Project Hub Step 1. Login the Spot Project Hub Step 2. Create a beacon group, get beacons into a group Step 3. Create a campaign under the beacon group Step 4. Edit the campaign. Add a HTML5 content module into it. Step 5. Start to write the HTML5 content, include the spot_jsbelib.js Step 6. Test and simulate the change of beacon distances
- 6. Confidential and Proprietary to KKlabs Inc. Tips for HTML5 content for mobile - Utilize the internet resources and collaboration tool ex: http://caniuse.com http://jsfiddle.net/ - Adopt the front-end JavaScript library and framework ex: Bootstrap, Semantic-UI, ImpactJs and more - Handle mobile browser capability issue: known issue example: Android 4.4 – hardware accelerator not default enable in webview onOrientationChanged event not works well through iFrame
- 7. Confidential and Proprietary to KKlabs Inc. Thank you! 6