Quick Yahoo! Blueprint Tutorial

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

2 comments

Comments 1 - 2 of 2 previous next Post a comment

Post a comment
Embed Video
Edit your comment Cancel

18 Favorites

Quick Yahoo! Blueprint Tutorial - Presentation Transcript

  1. BLUEPRINT Quick Development Tutorial Mobile Monday Silicon Valley @ Yahoo!, December 1 Markus Spiering
  2. I want to build stuff. Today. • Platform Overview • Blueprint Language Concept • Steps to (Widget-) Success BLUEPRINT
  3. BLUEPRINT the mobile platform Yahoo! Blueprint Apps 3rd Party Blueprint Apps Blueprint language specification Infrastructure Runtimes SDK Gallery Yahoo! Go Developer Tools Monetization Mobile Apps Reference Analytics Mobile Sites Tutorials
  4. Blueprint Language: What’s that exactly? XML mark-up language, based on X-Forms No scripting or procedural code Provides rich mobile core features and services EASY! BLUEPRINT
  5. Blueprint XML: Create a Page! Creating a simple “Hello World” mobile application with Blueprint XML is as easy as: <page> <content> <module> <header layout=\"simple\"> <layout-items> <block class=\"title\">MoMo @ Y!</block> </layout-items> </header> <block>Hello World!</block> </module> </content> </page> BLUEPRINT
  6. Blueprint XML: Create a nicer Page! Use Placards to enhance your design with pre-defined layouts using block elements and images <page> <content> <module> <header layout=\"simple\"> <layout-items> <block class=\"title\">MoMo @ Y!</block> </layout-items> </header> <placard layout=\"card\"> <layout-items> <image resource=\"...blueprint.png\" /> <block>Hello World!</block> <block class=\"subtext\"> Blueprint @ MoMo </block> </layout-items> </placard> </module> </content> </page> BLUEPRINT
  7. Blueprint XML: Create a Map! Even complex controls like a mobile map can be easily defined in Blueprint XML. <map> <center> <latitude>37.3919</latitude> <longitude>-122.0302</longitude> </center> <map-zoom>6</map-zoom> <map-mode>map</map-mode> <map-showtraffic>false</map-showtraffic> <map-point> <location> <latitude>37.392916</latitude> <longitude>-122.033934</longitude> <street>810 Del Rey Ave</street> <city>Sunnyvale</city> <state>CA</state> <zip></zip> </location> </map-point> </map> BLUEPRINT
  8. Blueprint Control: Location Blueprint makes it easy to create location-based services by providing the user’s location to the developer/publisher. <location-chooser ref=\"origin\"> <label>From:</label> </location-chooser> <location-chooser ref=\"destination\"> <label>To:</label> </location-chooser> Locations can be retrieved by manual input from the user or automatically, via GPS or cell- tower data, on platforms and devices that support these services. BLUEPRINT
  9. Creating Blueprint Services: What do I need? Any web-server Use any scripting language Use any existing publishing tools Return Blueprint! BLUEPRINT
  10. Building Mobile Widget 1 Download the Blueprint SDK BLUEPRINT
  11. Building Mobile Widget 1 Download the Blueprint SDK Blueprint SDK includes • Blueprint Documentation • XML Schema definitions • Templates to get started • Mobile Widget Sample Code • PHP helper class (blueprint.php) BLUEPRINT
  12. Building Mobile Widget 2 Develop your Widget Widget Request HTTP Request Yahoo! Server Widget Content Blueprint (XML) Your 2. Create static/ Web Server dynamic pages to return Widget Blueprint Submission 2 3. Create your application Application package and Package submit 3 BLUEPRINT
  13. Building Mobile Widget Data flow Mobile Phone Yahoo! Server Your Server Request entry point User opens HTTP request to Widget publisher Widget URI specified in config.xml Includes language and location headers Blueprint page returned Includes Content-Type header; may include cache-control headers; may include cookies for Widget publisher (Cookies stored on Yahoo! Widget content returned server) User requests new data Request new content HTTP request … BLUEPRINT
  14. Building Mobile Widget Interfacing with Yahoo! Servers Content Type for Blueprint Services: Content-Type: application/x-ywidget+xml Use only the UTF-8 character set. Using Cookies: Your server can set/retrieve cookies exactly as if you are serving HTML instead of Blueprint markup. The cookies are stored on Yahoo! servers Cache Control: Wherever possible, Blueprint pages are cached on the user’s device. To control caching, use the following standard HTTP headers when serving pages: Cache-Control, ETag, and If- None-Match. Only these headers affect caching BLUEPRINT
  15. Building Mobile Widget Interfacing with Yahoo! Servers Internationalization and Localization: When Yahoo! Mobile application server sends a page request, the request may contain several HTTP headers, including: Accept-Language RFC 4646/4647 language code (Example: Accept-Language: en-US) Geo-Country ISO 3166 country or UN M.49 region code (Example: Geo-Country: CA) You can use the information in the headers to decide what content to return. BLUEPRINT
  16. Building Mobile Widget 3 Package your Widget Application Package is a zip file containing • config.xml • Application metadata, including the URL for your web server • gallery.xml • Information for the widget gallery • Image Files • Includes icons and screen shots (for the gallery) BLUEPRINT
  17. Building Mobile Widget 4 Upload your mobile Widget • http://mobile.yahoo.com/developers/test/upload • Package the widget files into a zip archive • Upload the .zip file BLUEPRINT
  18. Building Mobile Widget 5 Test your mobile Widget 1. Yahoo! Go Emulator: http://mobile.yahoo.com/go/tryit (Note: External links won’t work) 2. Web Browser http://devtest.m.yahoo.com (Note: GPS and cell-ID won’t work on desktop browser) BLUEPRINT
  19. Building Mobile Widget 6 Publish your mobile Widget • http://mobile.yahoo.com/developers/submit/upload • Please test your widget before publishing • It may take 1 week for the approval process BLUEPRINT
  20. Widgets Development Process Summary 1 Download the Blueprint SDK 2 Develop your Widget 3 Package your Widget 4 Upload your mobile Widget 5 Test your mobile Widget 6 Publish your mobile Widget BLUEPRINT
  21. Get Numbers: Blueprint Analytics The new Yahoo! Blueprint Analytics page uses a Flash module to display the following data: unique devices, page views, average page views per unique device. Each item is available on a daily, weekly, and monthly basis as well for all supported regions worldwide. Blueprint Analytics is available from the Developer’s Dashboard page at: http://mobile.yahoo.com/developers/manage. BLUEPRINT
  22. Links & Support Get the SDK • Download the SDK http://mobile.yahoo.com/developers/download Get Help! • Yahoo! Tech Group http://tech.groups.yahoo.com/group/yhoomobiledevelopers • Read the Blueprint Blog http://mobile.yahoo.net/developer/blog BLUEPRINT

+ Blueprint BlogBlueprint Blog, 11 months ago

custom

6305 views, 18 favs, 22 embeds more stats

Presentation about Yahoo! Blueprint, the mobile pla more

More info about this document

© All Rights Reserved

Go to text version

  • Total Views 6305
    • 5484 on SlideShare
    • 821 from embeds
  • Comments 2
  • Favorites 18
  • Downloads 0
Most viewed embeds
  • 781 views on http://mobile.yahoo.net
  • 10 views on http://www.slideshare.net
  • 6 views on http://www.psicologia-distancia-gratis.org
  • 3 views on http://log.mijndertstuij.nl
  • 2 views on http://ihny.blogspot.com

more

All embeds
  • 781 views on http://mobile.yahoo.net
  • 10 views on http://www.slideshare.net
  • 6 views on http://www.psicologia-distancia-gratis.org
  • 3 views on http://log.mijndertstuij.nl
  • 2 views on http://ihny.blogspot.com
  • 2 views on http://psicologia-distancia-gratis.org
  • 2 views on http://feeds2.feedburner.com
  • 1 views on http://209.85.135.104
  • 1 views on http://203.208.37.104
  • 1 views on http://209.85.227.132
  • 1 views on http://209.85.173.132
  • 1 views on http://www.ss-office.org
  • 1 views on http://www.blogger.com
  • 1 views on http://surf.googlemashups.com
  • 1 views on http://atif.unaldi.org
  • 1 views on http://olad24.blogspot.com
  • 1 views on http://209.85.229.132
  • 1 views on http://test.visualcv.com
  • 1 views on http://feeds.feedburner.com
  • 1 views on http://static.slideshare.net
  • 1 views on http://66.163.168.225
  • 1 views on http://myusualstuff.blogspot.com

less

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

Cancel
File a copyright complaint
Having problems? Go to our helpdesk?

Categories