SlideShare a Scribd company logo
1 of 13
Matt Rosenzweig – Midnight Oil Creative GAMES
What We’re Covering HTML5 WTF? A Brief History of Timewasters HTML5 Games Today Going Native The Future Examples Q&A
HTML5 WTF? The next evolution of HTML; last major update was HTML4 in 1999 Lots of awesome new features <video>, <audio>, <canvas> and other new multimedia goodness Richer semantics via <header>, <footer>, <article>, etc Offline storage, web workers, geolocation, forms Not officially part of HTML5, but CSS3 brings a wealth of new features to enable greater styling of HTML content HTML5 = HTML5 + CSS3 + JavaScript Support: Safari, Chrome, Firefox, Opera, IE9 (sort of)
A Brief History of Timewasters Casual games: simple rules, no required long-term time commitment, low production & distribution costs (Boyes 2008) Analog: Checkers, Solitaire, Beer Pong Early Digital: Pac Man, Duck Hunt, Tetris Early Online: Bejeweled, Kongregate, Y! Games Early Mobile: Snake, N-Gage
A Brief History of Timewasters Current Casual Gaming Trends Hybrid: Geocaching, Alternate Reality Advanced Mobile: Angry Birds, Doodle Jump, Cut The Rope Social: Farmville, Mafia Wars Console: Wii Classics, LittleBigPlanet
HTML5 Games Today Promising proof-of-concepts HTML5 Game Libraries: Impact, Akihabara, Rocket Engine, LimeJS They help with the heavy lifting: Asset management, animation, physics, keyboard / mouse input, processing of sounds and graphics Hybrid model: Open Source with commercial licensing = free to use / experiment with, cheap to commercialize
HTML5 Games Today Pros Cross Platform: Any device with an HTML5-enabled browser (including about 160 million iOS devices) More CPU-efficient than Flash Frictionless distribution: Put it online and the entire world can play it Client-Server / Network functionality: Just like building any other online application
HTML5 Games Today Cons 3D (via WebGL) is only in an experimental state Cross-browser complications due to differences in HTML5 implementations Discovery: No central repository store for HTML5 games Game development is hard, and we gotta put food on the table (monetization) Hampered by committee-driven standards formulation (the W3C), proprietary solutions have already solved most of these cons (iOS / App Store is the best example)
Going Native Generally speaking, native game solutions are kicking HTML5’s ass iOS: 3D, monetization via purchase, ad-supported, in-app purchases, licked the discovery problem too Android: Large install base, ad-supported games generate upwards of five-figure monthly incomes for developers Console / Desktop: Far more advanced graphics capabilities, support for hardware controllers, decades-old industry ecosystem to support future advancement (retail / dev / marketing / consumers)
The Future 3D support coming via WebGL (soon-ish) IE9 brings HTML5 support (but IE6 – IE8 are still out there and hard to upgrade) Advancements in hardware acceleration (better graphics faster)
The Future The Takeaway: In the next several years, HTML5 will probably have all the technology required to make great contemporary games. The problems that still need to be solved are largely business-related: Distribution, discovery, and  monetization. HTML5 developers should embrace what makes the platform unique and create games based on those qualities, but it will probably require a fundamental shift in how we think about both creating and playing games for that to happen.
Examples Roundball Biolab Disaster ZType
Q&A Questions? Ask away! If we run out of time, you can contact me here: Matt Rosenzweig Sr. Front End Developer Midnight Oil Creative mrosenzweig@midnightoilcreative.com

More Related Content

Similar to HTML5 Games - An Introduction

Mdc2010 Casual Game Dev
Mdc2010 Casual Game DevMdc2010 Casual Game Dev
Mdc2010 Casual Game Dev
momobangalore
 
Ogdc 2013 cross platform game development with html5
Ogdc 2013 cross platform game development with html5Ogdc 2013 cross platform game development with html5
Ogdc 2013 cross platform game development with html5
Son Aris
 
Bringing HTML5 Video to Mobile Devices
Bringing HTML5 Video to Mobile DevicesBringing HTML5 Video to Mobile Devices
Bringing HTML5 Video to Mobile Devices
Brian Crescimanno
 

Similar to HTML5 Games - An Introduction (20)

The Future of Flash
The Future of FlashThe Future of Flash
The Future of Flash
 
Native vs web apps
Native vs web appsNative vs web apps
Native vs web apps
 
HTML5 Technical Executive Summary
HTML5 Technical Executive SummaryHTML5 Technical Executive Summary
HTML5 Technical Executive Summary
 
Presentation3
Presentation3Presentation3
Presentation3
 
Here comes html5
Here comes html5Here comes html5
Here comes html5
 
HTML5 and video
HTML5 and videoHTML5 and video
HTML5 and video
 
HTML5 & JavaScript Games
HTML5 & JavaScript GamesHTML5 & JavaScript Games
HTML5 & JavaScript Games
 
Major HTML5 Game Development Opportunities to Know in 2024.pptx
Major HTML5 Game Development Opportunities to Know in 2024.pptxMajor HTML5 Game Development Opportunities to Know in 2024.pptx
Major HTML5 Game Development Opportunities to Know in 2024.pptx
 
Viva Voce Presentation
Viva Voce PresentationViva Voce Presentation
Viva Voce Presentation
 
HTML5 or Android for Mobile Development?
HTML5 or Android for Mobile Development?HTML5 or Android for Mobile Development?
HTML5 or Android for Mobile Development?
 
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)
 
HTML5
HTML5HTML5
HTML5
 
Mdc2010 Casual Game Dev
Mdc2010 Casual Game DevMdc2010 Casual Game Dev
Mdc2010 Casual Game Dev
 
Html 5 Features And Benefits
Html 5 Features And Benefits  Html 5 Features And Benefits
Html 5 Features And Benefits
 
OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang
OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh QuangOGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang
OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang
 
Ogdc 2013 cross platform game development with html5
Ogdc 2013 cross platform game development with html5Ogdc 2013 cross platform game development with html5
Ogdc 2013 cross platform game development with html5
 
Bringing HTML5 Video to Mobile Devices
Bringing HTML5 Video to Mobile DevicesBringing HTML5 Video to Mobile Devices
Bringing HTML5 Video to Mobile Devices
 
Landscape Of Virtual World Systems
Landscape Of Virtual World SystemsLandscape Of Virtual World Systems
Landscape Of Virtual World Systems
 
Where Design and Development Meet: Cross Platform Mobile Experiences
Where Design and Development Meet: Cross Platform Mobile Experiences Where Design and Development Meet: Cross Platform Mobile Experiences
Where Design and Development Meet: Cross Platform Mobile Experiences
 
Video Game Industry Trends
Video Game Industry TrendsVideo Game Industry Trends
Video Game Industry Trends
 

Recently uploaded

Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Peter Udo Diehl
 

Recently uploaded (20)

Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
Secure Zero Touch enabled Edge compute with Dell NativeEdge via FDO _ Brad at...
 
Oauth 2.0 Introduction and Flows with MuleSoft
Oauth 2.0 Introduction and Flows with MuleSoftOauth 2.0 Introduction and Flows with MuleSoft
Oauth 2.0 Introduction and Flows with MuleSoft
 
Salesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
Salesforce Adoption – Metrics, Methods, and Motivation, Antone KomSalesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
Salesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
 
Enterprise Knowledge Graphs - Data Summit 2024
Enterprise Knowledge Graphs - Data Summit 2024Enterprise Knowledge Graphs - Data Summit 2024
Enterprise Knowledge Graphs - Data Summit 2024
 
What's New in Teams Calling, Meetings and Devices April 2024
What's New in Teams Calling, Meetings and Devices April 2024What's New in Teams Calling, Meetings and Devices April 2024
What's New in Teams Calling, Meetings and Devices April 2024
 
PLAI - Acceleration Program for Generative A.I. Startups
PLAI - Acceleration Program for Generative A.I. StartupsPLAI - Acceleration Program for Generative A.I. Startups
PLAI - Acceleration Program for Generative A.I. Startups
 
How we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfHow we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdf
 
Overview of Hyperledger Foundation
Overview of Hyperledger FoundationOverview of Hyperledger Foundation
Overview of Hyperledger Foundation
 
Using IESVE for Room Loads Analysis - UK & Ireland
Using IESVE for Room Loads Analysis - UK & IrelandUsing IESVE for Room Loads Analysis - UK & Ireland
Using IESVE for Room Loads Analysis - UK & Ireland
 
Free and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade
Free and Effective: Making Flows Publicly Accessible, Yumi IbrahimzadeFree and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade
Free and Effective: Making Flows Publicly Accessible, Yumi Ibrahimzade
 
The Metaverse: Are We There Yet?
The  Metaverse:    Are   We  There  Yet?The  Metaverse:    Are   We  There  Yet?
The Metaverse: Are We There Yet?
 
Intro in Product Management - Коротко про професію продакт менеджера
Intro in Product Management - Коротко про професію продакт менеджераIntro in Product Management - Коротко про професію продакт менеджера
Intro in Product Management - Коротко про професію продакт менеджера
 
Microsoft CSP Briefing Pre-Engagement - Questionnaire
Microsoft CSP Briefing Pre-Engagement - QuestionnaireMicrosoft CSP Briefing Pre-Engagement - Questionnaire
Microsoft CSP Briefing Pre-Engagement - Questionnaire
 
TopCryptoSupers 12thReport OrionX May2024
TopCryptoSupers 12thReport OrionX May2024TopCryptoSupers 12thReport OrionX May2024
TopCryptoSupers 12thReport OrionX May2024
 
Portal Kombat : extension du réseau de propagande russe
Portal Kombat : extension du réseau de propagande russePortal Kombat : extension du réseau de propagande russe
Portal Kombat : extension du réseau de propagande russe
 
Easier, Faster, and More Powerful – Notes Document Properties Reimagined
Easier, Faster, and More Powerful – Notes Document Properties ReimaginedEasier, Faster, and More Powerful – Notes Document Properties Reimagined
Easier, Faster, and More Powerful – Notes Document Properties Reimagined
 
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdfIntroduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
 
AI presentation and introduction - Retrieval Augmented Generation RAG 101
AI presentation and introduction - Retrieval Augmented Generation RAG 101AI presentation and introduction - Retrieval Augmented Generation RAG 101
AI presentation and introduction - Retrieval Augmented Generation RAG 101
 
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
 
Speed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in MinutesSpeed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in Minutes
 

HTML5 Games - An Introduction

  • 1. Matt Rosenzweig – Midnight Oil Creative GAMES
  • 2. What We’re Covering HTML5 WTF? A Brief History of Timewasters HTML5 Games Today Going Native The Future Examples Q&A
  • 3. HTML5 WTF? The next evolution of HTML; last major update was HTML4 in 1999 Lots of awesome new features <video>, <audio>, <canvas> and other new multimedia goodness Richer semantics via <header>, <footer>, <article>, etc Offline storage, web workers, geolocation, forms Not officially part of HTML5, but CSS3 brings a wealth of new features to enable greater styling of HTML content HTML5 = HTML5 + CSS3 + JavaScript Support: Safari, Chrome, Firefox, Opera, IE9 (sort of)
  • 4. A Brief History of Timewasters Casual games: simple rules, no required long-term time commitment, low production & distribution costs (Boyes 2008) Analog: Checkers, Solitaire, Beer Pong Early Digital: Pac Man, Duck Hunt, Tetris Early Online: Bejeweled, Kongregate, Y! Games Early Mobile: Snake, N-Gage
  • 5. A Brief History of Timewasters Current Casual Gaming Trends Hybrid: Geocaching, Alternate Reality Advanced Mobile: Angry Birds, Doodle Jump, Cut The Rope Social: Farmville, Mafia Wars Console: Wii Classics, LittleBigPlanet
  • 6. HTML5 Games Today Promising proof-of-concepts HTML5 Game Libraries: Impact, Akihabara, Rocket Engine, LimeJS They help with the heavy lifting: Asset management, animation, physics, keyboard / mouse input, processing of sounds and graphics Hybrid model: Open Source with commercial licensing = free to use / experiment with, cheap to commercialize
  • 7. HTML5 Games Today Pros Cross Platform: Any device with an HTML5-enabled browser (including about 160 million iOS devices) More CPU-efficient than Flash Frictionless distribution: Put it online and the entire world can play it Client-Server / Network functionality: Just like building any other online application
  • 8. HTML5 Games Today Cons 3D (via WebGL) is only in an experimental state Cross-browser complications due to differences in HTML5 implementations Discovery: No central repository store for HTML5 games Game development is hard, and we gotta put food on the table (monetization) Hampered by committee-driven standards formulation (the W3C), proprietary solutions have already solved most of these cons (iOS / App Store is the best example)
  • 9. Going Native Generally speaking, native game solutions are kicking HTML5’s ass iOS: 3D, monetization via purchase, ad-supported, in-app purchases, licked the discovery problem too Android: Large install base, ad-supported games generate upwards of five-figure monthly incomes for developers Console / Desktop: Far more advanced graphics capabilities, support for hardware controllers, decades-old industry ecosystem to support future advancement (retail / dev / marketing / consumers)
  • 10. The Future 3D support coming via WebGL (soon-ish) IE9 brings HTML5 support (but IE6 – IE8 are still out there and hard to upgrade) Advancements in hardware acceleration (better graphics faster)
  • 11. The Future The Takeaway: In the next several years, HTML5 will probably have all the technology required to make great contemporary games. The problems that still need to be solved are largely business-related: Distribution, discovery, and monetization. HTML5 developers should embrace what makes the platform unique and create games based on those qualities, but it will probably require a fundamental shift in how we think about both creating and playing games for that to happen.
  • 12. Examples Roundball Biolab Disaster ZType
  • 13. Q&A Questions? Ask away! If we run out of time, you can contact me here: Matt Rosenzweig Sr. Front End Developer Midnight Oil Creative mrosenzweig@midnightoilcreative.com