This document discusses creating web apps for the Opera TV Store by addressing issues with the usability of web apps on TVs. It introduces the Opera TV Store as a curated collection of TV-optimized web apps based on the Opera SDK but as a separate product from Opera for distribution to different TV manufacturers. It provides guidelines for developing for TV, such as accommodating large input mechanisms and displays, minimizing text entry and scrolling, using large elements, and optimizing for performance. It also discusses testing and resources for publishing to the Opera TV Store.

1. Web Apps on your TV
CREATING CONTENT FOR THE OPERA TV STORE
Patrick H. Lauke / TV Hackfest / London / 26 October 2012

2. issues with web on TV

3. usability of “wild web”

5. discoverability

7. introducing the
Opera TV Store

9. curated list of
TV-optimised web apps

10. based on Opera SDK
but a separate standalone product

11. distribution to different OEMs
no need for separate app submissions

14. built on web technologies

18. browser as
universal (meta)platform

20. developing for TV

21. 1. input mechanism
2. display size
3. performance

22. 1. input mechanism
2. display size
3. performance

24. ●
spatial navigation by default
●
handle key events directly
●
minimise text entry

25. blah.addEventListener("keydown", function(e) {
…
e.preventDefault();
}, useCapture);

26. blah.addEventListener("keydown", function(e) {
…
if (VK_RED == e.keyCode) { … }
…
e.preventDefault();
}, useCapture);

27. don't lose your focus
a:hover { … }
a:hover, a:focus { … }

28. 1. input mechanism
2. display size
3. performance

30. ●
large text and images
●
large UI elements for interaction
●
minimise scrolling

31. 720×576
1280×720
1920×1080

32. 1. input mechanism
2. display size
3. performance

33. ●
hardware acceleration?
●
avoid heavy JavaScript
●
keep animations (JS/CSS3/etc) minimal
●
space/memory extremely limited

34. no magic bullet...

35. testing and debugging

36. Opera TV Emulator
opera.com/developer/tools

37. opera.com/dragonfly

39. dev.opera.com/tv

40. publish.tvstore.opera.com

42. dev.opera.com/articles/view/testing-your-app-inside-the-opera-tv-store

45. dev.opera.com/tv
patrick.lauke@opera.com