Building Web Games
Glades and Shadows
"The journey of a thousand miles begins with a single step."
1. Origins
90's - 2000's
Sir Tim Berners-Lee created the first WebPage: http://info.cern.ch/hypertext/WWW/TheProject.html
... and it was responsive!
WWW became popular
- Javascript was used to validate forms
- Layouts were made with tables
- Websites were static (except for blink!)
- Animations were done with gifs
Mobile Gaming
Native development was the preferred way to deliver games to mobile.
Mobile Browsing
Browsing websites with a mobile was an odyssey: text too small, or it didn't fit to the screen.
Flash reign
When dynamism was needed, Flash was used:
- Video Players
- Games
- Image Galleries
- Single Page Apps!
HTML5 begins its journey
HTML5 makes its first steps in late 2000s. However, it was not yet seen as a possible successor for Flash.
But then...
2. Present Time
The raise of HTML5
"Not all those who wander are lost."
Thoughts on Flash - Steve Jobs
"... we do not allow Flash on iPhones, iPods and iPads."Full text
Internet Everywhere
Each household owns several devices that are able to browse the Internet.
Flash players kicked out of mobile devices
Android stops having an official flash player.
Major Browsers Support HTML5
But why is this so important?
HTML5 - CSS3
A new version of CSS is out, adding new interesting features:
- Animations: Keyframes or Transform/Transition
- Round Borders
- Gradients
- Shadows
HTML5 - Canvas and webGL
With the canvas element it was finally possible to replace Flash.
HTML5 - New API's
A new set of API's were added:
- Local Storage
- Geolocation
- DOM Queries
- WebSockets
Time for a change
It was the time for HTML5 to get the web back!
RWD - It's about sizes
Fixing web browsing on Mobile, a road full of challenges:
- Same page, or different one?
- Responsive, or adaptive?
- PO - GFX - UX - Developer
- Subtle differences among browsers
Games on HTML5
At that time it was possible to deliver a superior experience to any device running a browser.
Migration Time
At GameDuell, one of the world's largest game communities, we started a journey that some years ago was unimaginable: port our games in HTML5.
That brought up some questions:
- DOM, Canvas or WebGL?
- Responsive Web Design applied to Games?
- Will it perform?
3. There are shadows…
"With great power comes great responsibility."
JavaScript
Even if its usage is very widespread, it has some drawbacks:
- No polymorphism
- No compiler to help out
- Single Threaded
Javascript Ecosystem
Because JavaScript would be nothing without it's frameworks and libraries:
- Unneeded libraries imported
- Too many libraries / frameworks that do the same
- Language to solve everything
- Increase of languages that compile / transpile to JS
Security on Games
Ensuring a fair experience to users is crucial in Games:
- Easy for users to modify code
- No easy way to ensure requests are not modified by users
- Easy to sniff the network
- Obfuscation and minification is not security
Lose against Native
For the present time, we lose the comparison against native apps. The game is not over, though.
Native apps are still the preferred way for companies to communicate with users on mobile.
It's in our hands
We are responsible to provide better tools to deliver the best web experience overall.
Q & A
Further Information:
Link to Slides
