0
Web Apps on your TVCREATING CONTENT FOR THE OPERA TV STOREPatrick H. Lauke / Apps World / London / 29 November 2011
Web Evangelist at Opera
Opera – one browser on many devices
issues with web on TV
usability of “wild web”
discoverability
introducing theOpera TV Store
curated list ofTV-optimised web apps
based on Opera SDKbut a separate standalone product
distribution to different OEMs   no need for separate app submissions
built on web technologies
browser asuniversal platform
developing for TV
1. input mechanism2. display size3. performance
1. input mechanism2. display size3. performance
●    spatial navigation by default●    handle key events directly●    minimise text entry
blah.addEventListener("keypress", function(e) {  …  e.preventDefault();}, useCapture);
<!-- Optional script, provides keycode constants --><script src="http://tv.opera.com/js-api/api.js"></script>…<script>blah...
dont lose your focusa:hover { … }a:hover, a:focus { … }
opera.app.close()
1. input mechanism2. display size3. performance
●    large text and images●    large UI elements for interaction●    minimise scrolling
720×5761280×7201920×1080
1. input mechanism2. display size3. performance
●    hardware acceleration?●    avoid heavy JavaScript●    keep animations (JS/CSS3/etc) minimal●    space/memory extremel...
no magic bullet...
testing and debugging
Opera TV Emulator    opera.com/developer/tools
opera.com/dragonfly
dev.opera.com/tv
publish.tvstore.opera.com
$€¥₤
●    free to submit●    advertising (AdMarvel integration)●    subscription services●    payment API Q2-Q3
Opera TV Store launching at CES 2012
www.opera.com/developer   patrick.lauke@opera.com
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011
Upcoming SlideShare
Loading in...5
×

Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011

1,990

Published on

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,990
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
32
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Web Apps on your TV - Creating content for the Opera TV Store - Apps World 29.11.2011"

  1. 1. Web Apps on your TVCREATING CONTENT FOR THE OPERA TV STOREPatrick H. Lauke / Apps World / London / 29 November 2011
  2. 2. Web Evangelist at Opera
  3. 3. Opera – one browser on many devices
  4. 4. issues with web on TV
  5. 5. usability of “wild web”
  6. 6. discoverability
  7. 7. introducing theOpera TV Store
  8. 8. curated list ofTV-optimised web apps
  9. 9. based on Opera SDKbut a separate standalone product
  10. 10. distribution to different OEMs no need for separate app submissions
  11. 11. built on web technologies
  12. 12. browser asuniversal platform
  13. 13. developing for TV
  14. 14. 1. input mechanism2. display size3. performance
  15. 15. 1. input mechanism2. display size3. performance
  16. 16. ● spatial navigation by default● handle key events directly● minimise text entry
  17. 17. blah.addEventListener("keypress", function(e) { … e.preventDefault();}, useCapture);
  18. 18. <!-- Optional script, provides keycode constants --><script src="http://tv.opera.com/js-api/api.js"></script>…<script>blah.addEventListener("keypress", function(e) { … if (e.keyCode === opera.tv.VK_RED) { … } … e.preventDefault();}, useCapture);</script>
  19. 19. dont lose your focusa:hover { … }a:hover, a:focus { … }
  20. 20. opera.app.close()
  21. 21. 1. input mechanism2. display size3. performance
  22. 22. ● large text and images● large UI elements for interaction● minimise scrolling
  23. 23. 720×5761280×7201920×1080
  24. 24. 1. input mechanism2. display size3. performance
  25. 25. ● hardware acceleration?● avoid heavy JavaScript● keep animations (JS/CSS3/etc) minimal● space/memory extremely limited
  26. 26. no magic bullet...
  27. 27. testing and debugging
  28. 28. Opera TV Emulator opera.com/developer/tools
  29. 29. opera.com/dragonfly
  30. 30. dev.opera.com/tv
  31. 31. publish.tvstore.opera.com
  32. 32. $€¥₤
  33. 33. ● free to submit● advertising (AdMarvel integration)● subscription services● payment API Q2-Q3
  34. 34. Opera TV Store launching at CES 2012
  35. 35. www.opera.com/developer patrick.lauke@opera.com
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×