Real benefits of HTML5 gamesJuha PaananenCEO & Co-Founder, Non-Stop Games        * Formerly known as GamesMadeMe
About	  Me	  •  Always	  loved	  computer	  games:	  some	  of	  my	     favorites	  •  Worked	  previously	  at	  Nokia	 ...
•  HTML5	  focused	  games	  company	  •  Founded	  as	  GamesMadeMe:	  www.gamesmademe.com	                              ...
About	  this	  talk	  HTML5	  basics	  State	  of	  HTML5	  games	  Benefits	  of	  HTML5	  for	  games	  What	  we	  learn...
HTML5?	  •  Official	  definiAon:	  http://www.w3.org/TR/2012/WD-html5-20120329/
But	  for	  the	  purpose	  of	  	  this	  talk…	  HTML5	  =	  HTML	  +	  JS	  +	  CSS3	  
HTML5	  basics	  State	  of	  HTML5	  games	  Benefits	  of	  HTML5	  for	  games	  What	  we	  learned	  with	  Dollar	  I...
HYPE?	  + Dextrose               +
Where	  are	  the	  games?	  
Some	  good	  examples	  of	  HMTL5	  games                                               	  
https://apps.facebook.com/skyscrapercity/
www.dollarisle.com
Reality	  check?	  Lot of games build to demo the techOnly few built for HTM5 from ground-up
This	  is	  all	  normal                          	         We are here?
Create	  games	  that	  take	  advantage	  of	    the	  plaYorm!	  
But	  what	  are	  those?	  
Killer	  Benefits	  of	       HMTL5!	  
HTML5	  basics	  State	  of	  HTML5	  games	  Benefits	  of	  HTML5	  for	  games	  What	  we	  learned	  with	  Dollar	  I...
Write	  once,	  run	  everywhere	                                        	  1.          Same	  codebase     	             ...
Browser	  to	  browser	  on	  desktop	  is	  fairly	  simple	      –  Just	  forget	  the	  ancient	  ones	  (IE6,7,8;	  F...
 2.’Everyone’	  can	  play	        (at	  least	  everyone	  with	  a	  modern	  browser)                                  ...
Did	  he	  have	  an	       iPhone,	    Android	  or	     Windows	       Phone?	  
Big thing for social gameslittle effect to single player or ’hardcore’ games
3.	  ’Game	  as	  a	  link’                              	  
Most natural way of sharing.In our Internet DNA.
4.	  It’s	  not	  Flash	  (=it’s	  ”open”)                                              	  
5.	  Game	  always	  up-­‐to-­‐date	  
<	  
Important	  in	  social	  games	  that	  are	  frequently	  updated	  	  Makes	  A/B	  tesAng	  much	  easier	  
6.	  Not	  dependent	  on	  app	  stores                                            	  
…But                                    	  You	  also	  lose	  the	  biggest	  benefits	  of	  app	  stores	  	  -­‐	  Easy...
7.	  Instant	  accessibility                             	  
This	  can	  be	  only	  done	  with	  HTML5	  
HTML5	  basics	  State	  of	  HTML5	  games	  Benefits	  of	  HTML5	  for	  games	  What	  we	  learned	  with	  Dollar	  I...
OR	  Stories from the front line of web development
Browser	  as	  a	  gaming	  plaYorm	                                         	  
Installs	  ?	  –	  User	  can	  come	  from	  ”anywhere”	  	  Session	  management	  	  UI	  –	  Browser	  Chrome,	  back	...
Key	  HTML5	  features	  for	  game	  development                                                     	  
1.    HTML5	  Canvas	  2.    HTML5	  Canvas	  3.    HTML5	  Canvas	  4.    CSS	  transformaAons	  5.    Other	  CSS	  stuff...
Good	  JS	  programmer	  ≠	  Good	  HTML5	  programmer                                                           	       I...
•  Choose	  your	  game	  concept	  carefully	  •  Hard	  to	  make	  mobile	  and	  desktop	  gameplay	  	     equally	  ...
Remember       	         Front-­‐end	  it’s	         not	  all	  it	  is.	  	         Back-­‐end	  work	         most	  ca...
HTML5	  basics	  State	  of	  HTML5	  games	  Benefits	  of	  HTML5	  for	  games	  What	  we	  learned	  with	  Dollar	  I...
My	  predicAons                                     	  •  Mobile	  browsers	  will	  get	  much	  bemer	  during	  next	  ...
Thank	  you	  !                       	             	  www.gamesmademe.com/jobs                       	            	      ...
Real Benefits of HTML5 for Games (MS Campfire, 2012)
Real Benefits of HTML5 for Games (MS Campfire, 2012)
Real Benefits of HTML5 for Games (MS Campfire, 2012)
Real Benefits of HTML5 for Games (MS Campfire, 2012)
Real Benefits of HTML5 for Games (MS Campfire, 2012)
Upcoming SlideShare
Loading in...5
×

Real Benefits of HTML5 for Games (MS Campfire, 2012)

1,356

Published on

My talk at Microsoft Campfire in Singapore in April 2012.

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,356
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
29
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Real Benefits of HTML5 for Games (MS Campfire, 2012)

  1. 1. Real benefits of HTML5 gamesJuha PaananenCEO & Co-Founder, Non-Stop Games * Formerly known as GamesMadeMe
  2. 2. About  Me  •  Always  loved  computer  games:  some  of  my   favorites  •  Worked  previously  at  Nokia  •  Co-­‐founded  Non-­‐Stop  Games  last  year  •  Try  to  kitesurf  and  travel  on  my  freeAme  
  3. 3. •  HTML5  focused  games  company  •  Founded  as  GamesMadeMe:  www.gamesmademe.com              Company is Born Dollar Isle BETA Dollar Isle LIVEMarch August March Mid 2012             ? Singapore Office Game2 Launches Opens Seed-Funding
  4. 4. About  this  talk  HTML5  basics  State  of  HTML5  games  Benefits  of  HTML5  for  games  What  we  learned  with  Dollar  Isle    Glimpse  in  the  future        
  5. 5. HTML5?  •  Official  definiAon:  http://www.w3.org/TR/2012/WD-html5-20120329/
  6. 6. But  for  the  purpose  of    this  talk…  HTML5  =  HTML  +  JS  +  CSS3  
  7. 7. HTML5  basics  State  of  HTML5  games  Benefits  of  HTML5  for  games  What  we  learned  with  Dollar  Isle    Glimpse  in  the  future      
  8. 8. HYPE?  + Dextrose +
  9. 9. Where  are  the  games?  
  10. 10. Some  good  examples  of  HMTL5  games  
  11. 11. https://apps.facebook.com/skyscrapercity/
  12. 12. www.dollarisle.com
  13. 13. Reality  check?  Lot of games build to demo the techOnly few built for HTM5 from ground-up
  14. 14. This  is  all  normal   We are here?
  15. 15. Create  games  that  take  advantage  of   the  plaYorm!  
  16. 16. But  what  are  those?  
  17. 17. Killer  Benefits  of   HMTL5!  
  18. 18. HTML5  basics  State  of  HTML5  games  Benefits  of  HTML5  for  games  What  we  learned  with  Dollar  Isle    Glimpse  in  the  future      
  19. 19. Write  once,  run  everywhere    1. Same  codebase    
  20. 20. Browser  to  browser  on  desktop  is  fairly  simple   –  Just  forget  the  ancient  ones  (IE6,7,8;  FF3,…)  •  Mobile  needs  more  love   –  Performance.  Bugs  (especially  Android).  UI  •  Game  design  for  mobile  &  desktop  is  much   harder  than  the  programming  
  21. 21.  2.’Everyone’  can  play   (at  least  everyone  with  a  modern  browser)  
  22. 22. Did  he  have  an   iPhone,   Android  or   Windows   Phone?  
  23. 23. Big thing for social gameslittle effect to single player or ’hardcore’ games
  24. 24. 3.  ’Game  as  a  link’  
  25. 25. Most natural way of sharing.In our Internet DNA.
  26. 26. 4.  It’s  not  Flash  (=it’s  ”open”)  
  27. 27. 5.  Game  always  up-­‐to-­‐date  
  28. 28. <  
  29. 29. Important  in  social  games  that  are  frequently  updated    Makes  A/B  tesAng  much  easier  
  30. 30. 6.  Not  dependent  on  app  stores  
  31. 31. …But  You  also  lose  the  biggest  benefits  of  app  stores    -­‐  Easy  payment  -­‐  Discovery  (If  you  don’t  wrap  it  into  naAve)  
  32. 32. 7.  Instant  accessibility  
  33. 33. This  can  be  only  done  with  HTML5  
  34. 34. HTML5  basics  State  of  HTML5  games  Benefits  of  HTML5  for  games  What  we  learned  with  Dollar  Isle    Glimpse  in  the  future      
  35. 35. OR  Stories from the front line of web development
  36. 36. Browser  as  a  gaming  plaYorm    
  37. 37. Installs  ?  –  User  can  come  from  ”anywhere”    Session  management    UI  –  Browser  Chrome,  back  bumon,  etc    First  load  extremely  important  
  38. 38. Key  HTML5  features  for  game  development  
  39. 39. 1.  HTML5  Canvas  2.  HTML5  Canvas  3.  HTML5  Canvas  4.  CSS  transformaAons  5.  Other  CSS  stuff  like  rounded  corners  
  40. 40. Good  JS  programmer  ≠  Good  HTML5  programmer   Important to understand ’browser framework’, DOM etc.
  41. 41. •  Choose  your  game  concept  carefully  •  Hard  to  make  mobile  and  desktop  gameplay     equally  good  •  Mobile  will  take  most  of  your  Ame  
  42. 42. Remember   Front-­‐end  it’s   not  all  it  is.     Back-­‐end  work   most  can  be  
  43. 43. HTML5  basics  State  of  HTML5  games  Benefits  of  HTML5  for  games  What  we  learned  with  Dollar  Isle    Glimpse  in  the  future      
  44. 44. My  predicAons  •  Mobile  browsers  will  get  much  bemer  during  next   12  months   –  Sound,  HW  acceleraAon,  etc  •  More  app-­‐like  behaviour  for  HTML5   –  Home  screen  access..  Looking  forward  to  Metro  apps  •  More  distribuAon!   –  Facebook,  GREE,  Zynga,  Pokki…  •  Living  room  (TV)  starts  to  get  more  important  as  a   plaYorm  
  45. 45. Thank  you  !    www.gamesmademe.com/jobs     @juhapaananen   Questions?
  1. A particular slide catching your eye?

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

×