html5 devconf 2014 - workflow when making html5 games
Post on 20-Aug-2015
936 Views
Preview:
TRANSCRIPT
https://academy.zenva.com
Workflow overview
Game scope Technology selection
Game development• Code• Assets• Content
Distribution
https://academy.zenva.com
Pareto principle
-20% of the input yields 80% of the output
-Be smart in what you focus on, and you can get quick results
https://academy.zenva.com
One pager
• A brief description of the game• What functionality it will need:– Internet connection– Local storage– Cloud storage– Camera? GPS?– Single vs Multiplayer– Social integration
• “Stick figure” sketches of the main screens and game mechanics
https://academy.zenva.com
Your First MVP
• Only essential features• 1 Level• 1 Type of enemy, item, powerup• No custom artwork use rectangles or free
images• No animations• No cloud integration• No social integration• Nothing too complex
https://academy.zenva.com
Technology selection
• Platforms• Devices• Select framework• Other requirements (cloud, social, payments)
https://academy.zenva.com
Development• Coding
– Code editor– Web browser– Web server– Version control (GIT)
• Game assets– Images– Audio– Animations
• Game content– Levels– Story
https://academy.zenva.com
Code editor• Simple code editors:
– Sublime Text– Geany– Notepad++
• Full IDE solutions:– Netbeans– Eclipse– Visual Studio– Komodo Edit
• HTML5-oriented– Intel XDK– Adobe Brackets
https://academy.zenva.com
Web Server
• Apache (WAMP, MAMP)• Python Simple HTTP Server• Node.js http-server• Chrome extension: Web Server for Chrome• Sublime Text plugin• Intel XDK and Brackets!
https://academy.zenva.com
Game Assets
• Create your own
• Find free assets– Licensing!
• Buy assets
• Pay someone to make assets for you
https://academy.zenva.com
Finding free assets
• Graphic– OpenGameArt.org– OpenClipArt.org– PixaBay.com
• Audio– Freesound.org
https://academy.zenva.com
Asset marketplaces
• Graphics– Graphicriver.net– GameArtPartners.com– EatCreatures.com– GameArtMarket.com– marketplace.yoyogames.com
• Audio– Audiojungle.net– marketplace.yoyogames.com
https://academy.zenva.com
Building with Cordova
• You need the platform SDK– Android SDK– iOS SDK
• Using command line:– Create project– Develop HTML5– Test on devices and emulators– Prepare deployment version
https://academy.zenva.com
Building with Cordova
Create project
Develop
HTML5
Build to test
Build
for deployment
(sign)
Deploy
Certificates*
https://academy.zenva.com
Building in the Cloud
• Phonegap Build• Intel XDK
• Another option: CocoonJS by Ludei
https://academy.zenva.com
Building in the Cloud
Create project
Develop
HTML5
Build to test
Build
for deployment
(sign)
Deploy
Certificates*
https://academy.zenva.com
iOS Specifics
• Apple Developer Program ($99/year)– https://developer.apple.com
• Need a Mac computer
• IPA File
• Store review process is very strict– iOS Human Interface Guidelines
https://academy.zenva.com
Android Specifics
• Android Developer Program ($25/year)– http://developer.android.com/
• Any computer
• APK file
• No review process. Updates in ~2-4 hours
https://academy.zenva.com
Quick summary
• Game dev is an iterative process• MVP• Where to distribute• Wrapping a HTML5 game
top related