OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang

•Transferir como PPTX, PDF•

1 gostou•2,478 visualizações

ogdc

Presentation in OGDC 2013 organized by VNG Corp.

Tecnologia Design

Cross-platform Game
DevelopmentQuangHD
OGDC 2013, HCM

Hello World!
Contact me: quanghd@cami.vn
Follow us: facebook.com/camistudio
He’s me exactly!

HTML5, WTF?
• Media
• Web Socket
• Local Storage
• WebGL
• Canvas
New Javascript API
HTML5 = HTML + 5

HTML5 – Why should?
HTML/JS is huge popular

HTML5 – Why should?
Easy to train or recruit employees
Hire me

HTML5 – Why should?
Friendly development environment

HTML5 – Why not?
Community is new and quiet

• Game Engine:
ImpactJS, Construct 2, CAAT… and 50 more
• Toolkit:
CocoonJS, appMobi SDK, PhoneGap…
• Server-side:
NodeJS, Socket.IO…
Powerful Toys

• Access Native APIs
– Location
– Notification
– Camera, blah blah…
• Services
– IAP (In-App-Purchase)
– Social Network Integration
– Ads Promotion, blah blah…
Powerful Toys

Turn-base mobile game on HTML5
A true story

ImpactJS CocoonJS Venturesoom
What did we choose?
99$ Free No way to
measure

• Text, effects… Write more plugins
• Screen Resolution Dev on middle ratio
• Limited Engine Do more on canvas
• RAM Consumption OMG (Oh My God!)
Problem/Solution

Memory Consumption
Large images/spritesheets loaded
Resolution: 1024x768
Format: PNG-8
Size: 916 bytes
In-Memory: 3MB!!!
(1024x768x4 bytes)

Memory Consumption
Wasted pixels
Resolution: 800x600
Format: PNG-8
Size: 619 bytes
In-Memory: 3MB!!!
(1024x768x4 bytes)
Wasted: 1.17MB
WTF?

Memory Consumption
• Solution:
– Create Image atlas
– Reuse image anytime
– Do own Garbage Collector

• CocoonJS Cloud System Compiling
– 1 minute action
– Android & iOS & Tizen…
– Ready to publish to App Store
Time to build

• Intel XDK Cloud System Compiling
– 1 minute action
– Android & iOS & Chrome & Win Phone…
– Ready to publish to App Store
Time to build

• Working smooth in 60fps (avg).
• Running on all popular platforms:
Android & iOS & Chrome & Win Phone…
The Epic Victory

Advices
The world is
moving to HTML5
Our Biggest Mistake
Was Betting Too
Much On HTML5
VS

Mais conteúdo relacionado

Semelhante a OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang

HTML5 Games Status and issuesJ.h. Liu

Developing applications and games in Unity engine - Matej Jariabka, Rudolf Ka...gamifi.cc

Improving Game Performance in the BrowserFITC

A Holistic Approach to HTML5 Game Design & DevelopmentKarl Bunyan

Game design & developmentHemanth Sharma

HTML5 Dev Conf 2013 PresentationIker Jamardo

Building a game engine with jQueryPaul Bakaus

Publishing HTML5 Games: It’s ShowTime! | Laurens RuttenJessica Tams

Html5 (games)chamsddine bouzaine

Html5 - the new kid on the blockMarian Borca

Сергей Батищев: 2D игры на HTML5: мифы и реальность разработкиDevGAMM Conference

Hacking to be performantApoorv Saxena

Html5 Game Development with CanvasPham Huy Tung

Massively Social != Massively MultiplayerPaul Furio

Augernaut jsmckennaphillabaum

AWS Partner Presentation - KANO/APPS - Large Scale HTML5 Games on Desktop, M...Amazon Web Services

Creating Casual Games for Windows 8SmartyPantsCoding.com

Adobe and the Flash Gaming LandscapeJoseph Labrecque

Desarrollo de apps multiplataforma con tecnologías webSoftware Guru

Sg conference multiplatform_apps_adam_stanleyn_adam_stanley

Semelhante a OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang (20)

HTML5 Games Status and issues

Developing applications and games in Unity engine - Matej Jariabka, Rudolf Ka...

Improving Game Performance in the Browser

A Holistic Approach to HTML5 Game Design & Development

Game design & development

HTML5 Dev Conf 2013 Presentation

Building a game engine with jQuery

Publishing HTML5 Games: It’s ShowTime! | Laurens Rutten

Html5 (games)

Html5 - the new kid on the block

Сергей Батищев: 2D игры на HTML5: мифы и реальность разработки

Hacking to be performant

Html5 Game Development with Canvas

Massively Social != Massively Multiplayer

Augernaut js

AWS Partner Presentation - KANO/APPS - Large Scale HTML5 Games on Desktop, M...

Creating Casual Games for Windows 8

Adobe and the Flash Gaming Landscape

Desarrollo de apps multiplataforma con tecnologías web

Sg conference multiplatform_apps_adam_stanley

Mais de ogdc

OGDC 2014_Entity system in mobile game development_Mr. Cody nguyenogdc

OGDC 2014_Sky Garden Mobile conceptualization: From PC to Mobile_Mr. Luc Hoan...ogdc

OGDC 2014_Creativity in Game Design - Case Study: Famous Vietnamese mobile ga...ogdc

OGDC 2014_Vietnam Mobile Internet 2014: A focus in smartphone game and compar...ogdc

OGDC 2014_Vietnam Smartphone game market 2013 overview. From vision to action...ogdc

OGDC 2014_User segmentation and Monetization_Mr. Phat hoangogdc

OGDC 2014_Animation workflow with Spine in Tiny Busters_Mr. Huynh Dong Haiogdc

OGDC 2014_Speed Up and make quality 3D game models_Mr. Pham Duc Duyogdc

OGDC 2014_Architecting Games in Unity_Mr. Rustum Scammellogdc

OGDC 2014_One-Man Studio: How to make a game prototype_Mr. Le Vo Tien Giangogdc

OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr...ogdc

OGDC 2014_Optimize or Die: Key disciplines to optimize your mobile game_Mr. P...ogdc

OGDC 2014_Why choosing 2D animation for Mobile Game?_Mr. Joe Tranogdc

OGDC 2014_ An artist's story_Mr. Vu Cam Cong Danhogdc

OGDC 2014_Tips and Tricks for seasonal events and community building in Drago...ogdc

OGDC 2014_Cross platform mobile game application development_Mr. Makku J.Keroogdc

OGDC 2014_Tips and Tricks for seasonal events and community building in Drago...ogdc

OGDC 2014_Business design is game design: 10 bits of business/design wisdom_M...ogdc

OGDC 2014_Build your own Particle System_Mr. Nguyen Dang Quangogdc

OGDC 2014_ Game Design: 5 years of painful lessons_Mr. Do Van Thanhogdc

Mais de ogdc (20)

OGDC 2014_Entity system in mobile game development_Mr. Cody nguyen

OGDC 2014_Sky Garden Mobile conceptualization: From PC to Mobile_Mr. Luc Hoan...

OGDC 2014_Creativity in Game Design - Case Study: Famous Vietnamese mobile ga...

OGDC 2014_Vietnam Mobile Internet 2014: A focus in smartphone game and compar...

OGDC 2014_Vietnam Smartphone game market 2013 overview. From vision to action...

OGDC 2014_User segmentation and Monetization_Mr. Phat hoang

OGDC 2014_Animation workflow with Spine in Tiny Busters_Mr. Huynh Dong Hai

OGDC 2014_Speed Up and make quality 3D game models_Mr. Pham Duc Duy

OGDC 2014_Architecting Games in Unity_Mr. Rustum Scammell

OGDC 2014_One-Man Studio: How to make a game prototype_Mr. Le Vo Tien Giang

OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr...

OGDC 2014_Optimize or Die: Key disciplines to optimize your mobile game_Mr. P...

OGDC 2014_Why choosing 2D animation for Mobile Game?_Mr. Joe Tran

OGDC 2014_ An artist's story_Mr. Vu Cam Cong Danh

OGDC 2014_Tips and Tricks for seasonal events and community building in Drago...

OGDC 2014_Cross platform mobile game application development_Mr. Makku J.Kero

OGDC 2014_Tips and Tricks for seasonal events and community building in Drago...

OGDC 2014_Business design is game design: 10 bits of business/design wisdom_M...

OGDC 2014_Build your own Particle System_Mr. Nguyen Dang Quang

OGDC 2014_ Game Design: 5 years of painful lessons_Mr. Do Van Thanh

Último

Architecting Cloud Native ApplicationsWSO2

AXA XL - Insurer Innovation Award Americas 2024The Digital Insurer

Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingEdi Saputra

Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodJuan lago vázquez

ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous

Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2

Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10

Exploring Multimodal Embeddings with MilvusZilliz

Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobeapidays

EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWERMadyBayot

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@

2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong

Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...apidays

Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Zilliz

Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Orbitshub

Artificial Intelligence Chap.5 : UncertaintyKhushali Kathiriya

Manulife - Insurer Transformation Award 2024The Digital Insurer

How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes

MS Copilot expands with MS Graph connectorsNanddeep Nachan

OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang

1. Cross-platform Game DevelopmentQuangHD OGDC 2013, HCM

2. Hello World! Contact me: quanghd@cami.vn Follow us: facebook.com/camistudio He’s me exactly!

3. HTML5, WTF? I mean… What’s the fun?

4. HTML5, WTF? • Media • Web Socket • Local Storage • WebGL • Canvas New Javascript API HTML5 = HTML + 5

5. HTML5, WTF? What Canvas is

6. Showcase To be Continued …

7. HTML5 – Why should? HTML/JS is huge popular

8. HTML5 – Why should? Easy to train or recruit employees Hire me

9. HTML5 – Why should? Cross-platform

10. HTML5 – Why should? Friendly development environment

11. HTML5 – Why should? Flexible UI system

12. HTML5 – Why not? Performance

13. HTML5 – Why not? Community is new and quiet

14.

15. HTML5 – Why not? 3D is terrible

16. HTML5 – Why not? Out-of-the-box

17. • Game Engine: ImpactJS, Construct 2, CAAT… and 50 more • Toolkit: CocoonJS, appMobi SDK, PhoneGap… • Server-side: NodeJS, Socket.IO… Powerful Toys

18. Powerful Toys FPS - Benchmark Report

19. • Access Native APIs – Location – Notification – Camera, blah blah… • Services – IAP (In-App-Purchase) – Social Network Integration – Ads Promotion, blah blah… Powerful Toys

20. Turn-base mobile game on HTML5 A true story

21. ImpactJS CocoonJS Venturesoom What did we choose? 99$ Free No way to measure

22. • Text, effects… Write more plugins • Screen Resolution Dev on middle ratio • Limited Engine Do more on canvas • RAM Consumption OMG (Oh My God!) Problem/Solution

23. Memory Consumption Large images/spritesheets loaded Resolution: 1024x768 Format: PNG-8 Size: 916 bytes In-Memory: 3MB!!! (1024x768x4 bytes)

24. Memory Consumption Wasted pixels Resolution: 800x600 Format: PNG-8 Size: 619 bytes In-Memory: 3MB!!! (1024x768x4 bytes) Wasted: 1.17MB WTF?

25. Memory Consumption • Solution: – Create Image atlas – Reuse image anytime – Do own Garbage Collector

26. • CocoonJS Cloud System Compiling – 1 minute action – Android & iOS & Tizen… – Ready to publish to App Store Time to build

27. • Intel XDK Cloud System Compiling – 1 minute action – Android & iOS & Chrome & Win Phone… – Ready to publish to App Store Time to build

28. • Working smooth in 60fps (avg). • Running on all popular platforms: Android & iOS & Chrome & Win Phone… The Epic Victory

29. Advices The world is moving to HTML5 Our Biggest Mistake Was Betting Too Much On HTML5 VS

30. The end

31. The game’s beginning… Any question?

OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang

Recomendados

Recomendados

Mais conteúdo relacionado

Semelhante a OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang

Semelhante a OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang (20)

Mais de ogdc

Mais de ogdc (20)

Último

Último (20)

OGDC2013_ Cross platform game development with html5_ Mr Hoang Dinh Quang