This is a presentation given by Googlers Chris Schalk and Johan Euphrosine (Proppy) at GDD Sydney 2011 on how to build multi-platform video games using PlayN.
2. About the Speaker
Christian Schalk
Day Job
● Developer Advocate for Google's Cloud Technology
○ App Engine, Google Storage, Prediction API, BigQuery ...
● Mostly Server-Side Java Background
○ "JavaServer Faces: The Complete Reference" Co-Author
● Haven't developed video games since the
Commodore-64!
Yes, I'm old school ;-)
3. Agenda
● PlayN Technology
● Hands on with PlayN
○ Getting Started
○ Building a game from scratch w/ Proppy
● Deploying your game to the cloud
● Setting up an RPC mechanism
● Integrating w/ Google Plus
● Summary
4. First, Some Questions...
● Thinking of building a game for the Web?
?
○ Would you use Flash?
○ or HTML5?
● What if you wanted to port your game to Mobile?
○ Do you need an entirely separate code base?
5. First, Some Questions...
● Thinking of building a game for the Web?
?
○ Would you use Flash?
○ or HTML5?
○ Answer: Doesn't Matter!! Can do both!
● What if you wanted to port your game to Mobile?
○ Do you need an entirely separate code base?
○ Answer: NO!
6. First, Some Questions...
● Thinking of building a game for the Web?
?
○ Would you use Flash?
○ or HTML5?
○ Answer: Doesn't Matter!! Can do both!
● What if you wanted to port your game to Mobile?
○ Do you need an entirely separate code base?
○ Answer: NO!
How is this Possible!??
8. What is PlayN?
● An open source technology for building cross-platform
games
● Core game code is platform agnostic
● Develop games in Java
○ Familiar language/toolset
● Leverages Google Web Toolkit
○ Compiles to JS/HTML5, (among other platforms)
● Free and Open Source (alpha)
○ http://code.google.com/p/playn
9. PlayN API Structure
PlayN API
Flash impl.
Implementations for Java, HTML5(GWT/JS), Android, Flash
10. Components of PlayN
Extend PlayN.Game PlayN.*
Fully generic gaming components. Core game logic is fully platform
independent!
11. PlayN Cross Platform Magic
● Game uses core PlayN abstractions, is unaware of which
platform is running
● The only platform-specific code is in the entry point for
each platform:
PlayN.run(new MyGame()); PlayN.run(new MyGame());
12. Other PlayN Benefits
● Built-in physics engine based on proven OpenSource
technologies
● Box2D
○ C++ 2D Physics engine by Erin Catto
● JBox2D
○ A port of Box2D from C++ to Java
● GWTBox2D
○ A port of JBox2D from Java to JavaScript
13. Benefits of GWT Abstraction
● GWT Compiler optimizes code for size
○ Removes unused code
○ Evaluates when possible at compile time
○ Heavily obfuscated result code
● Smaller compiled code - faster load time
● Optimized caching, avoids unnecessary network IO
14. The PlayN Game Loop
Similar to other gaming platforms
public class MyGame implements Game {
public void init() {
// initialize game.
}
public void update(float delta) {
// update world.
}
public void paint(float alpha) {
// render world.
}
}
15. PlayN Rendering
Can easily with different screen parameters
// Resize to the available resolution on the current device.
graphics().setSize(
graphics().screenWidth(),
graphics().screenHeight()
);
// Keep the same aspect ratio.
float sx = graphics().screenWidth() / (float) WIDTH;
float sy = graphics().screenHeight() / (float) HEIGHT;
// Fit to the available screen without stretching.
graphics().rootLayer().setScale(Math.min(sx, sy));
22. Agenda
● PlayN Technology
● Hands on with PlayN
○ Getting Started
○ Building a game from scratch w/ Proppy
● Deploying your game to the cloud
● Setting up an RPC mechanism
● Integrating w/ Google Plus
● Summary
23. Requirements for getting started with PlayN
● Core Requirements
○ Java 6 SDK
○ Apache Ant
○ Maven
○ App Engine SDK
○ Android SDK
● Requirements with Eclipse
○ Eclipse IDE Indigo 3.7 (Or earlier version w/
Maven)
○ Google Plugin for Eclipse
○ Android Plugin for Eclipse
24. Building/Installing PlayN
● PlayN 1.0 is now available in Maven Central!
○ Wiki will be updated soon, but can simply create a Maven project
● Or can clone a copy of PlayN
○ git clone https://code.google.com/p/playn
● Then...
○ cd playn (directory where your copy is location)
○ mvn install (or 'ant install')
● Running 'showcase' sample app with Mvn
○ cd playn/sample/showcase/core
○ mvn compile exec:java
● Running 'showcase' sample app with Ant
○ cd playn/sample/showcase
○ ant run-java
25. Demo: How to get started w/ PlayN
http://code.google.com/p/playn
26. Building a new project in PlayN
● From the command line:
○ mvn archetype:generate -DarchetypeGroupId=com.googlecode.playn
-DarchetypeArtifactId=playn-archetype
○ ...
● From Eclipse
○ Select File → New → Project..., then select Maven →
Maven Project in the dialog that pops up, then click
Next.
■ Click Next again unless you wish to specify a custom workspace location.
■ Check Include snapshot archetypes in the dialog and then double click
on the playn-archetype in the list of archetypes
○ ...
28. Agenda
● PlayN Technology
● Hands on with PlayN
○ Getting Started
○ Building a game from scratch w/ Proppy
■ http://proppy-playn101.appspot.com/
● Deploying your game to the cloud
● Setting up an RPC mechanism
● Integrating w/ Google Plus
● Summary
29. Agenda
● PlayN Technology
● Hands on with PlayN
○ Getting Started
○ Building a game from scratch w/ Proppy
● Deploying your game to the cloud
● Setting up an RPC mechanism
● Integrating w/ Google Plus
● Summary
30. Deploy your HTML project to the Cloud
● For Google App Engine Deployment, you can easily
convert the project to an App Engine Project
31. Deploy your HTML project to the Cloud
● After converting your HTML project to an App Engine
project you will have to do...
● Add a 'WEB-INF/lib/appengine-web.xml' file
○ Note: Click 'Quick Fix' in the Errors console of
Eclipse
● Before deployment make sure your 'WEB-INF/lib' has
the necessary runtime App Engine jar files.
32. Agenda
● PlayN Technology
● Hands on with PlayN
○ Getting Started
○ Building a game from scratch w/ Proppy
● Deploying your game to the cloud
● Setting up an RPC mechanism
● Integrating w/ Google Plus
● Summary
33. Setting up an RPC mechanism
● Building your client code
○ You can use PlayN's Net().Post() call to send data to
a server
● Building Your Server
○ PlayN comes with a preliminary Server example
code that uses Jetty
■ Is not needed if deploying to App Engine
■ Instead, you can implement your own server by
adding an HttpServlet to your project
■ Have it implement the doPost() method
■ Can map it to url: '/rpc' in web.xml
34. Setting up an RPC mechanism
● Example: A client method to persist a score
private void postScore(String payload) {
net().post("/rpc", payload, new Callback<String>() {
@Override
public void onSuccess(String response) {
// TODO
}
@Override
public void onFailure(Throwable error) {
// TODO
}
});
}
35. Setting up an RPC mechanism
● Example: Server method to persist score sent from client
protected void doPost(HttpServletRequest req,
HttpServletResponse resp) throws ServletException,
IOException {
String payload = readFully(req.getReader());
Json.Object data = json().parse(payload);
String score = data.getString("score");
if (score != null){
persistScore(score, id);
}
}
private void persistScore(String score) {...}
36. Agenda
● PlayN Technology
● Hands on with PlayN
○ Getting Started
○ Building a game from scratch w/ Proppy
● Deploying your game to the cloud
● Setting up an RPC mechanism
● Integrating w/ Google Plus
● Summary
37. Integrating your game with Google+
Visit http://developers.google.com/+
Download the Java Starter App
38. Integrating your game with GooglePlus
Sample Starter App contains...
● README.txt with steps on:
○ Visiting https://code.google.com/apis/console to
enable Google Plus API access for your app
■ To generate your
■ oauth_client_id,
■ oauth_client_secret,
■ google_api_key
● Sample Java classes to redirect game users for OAuth
authentication
39. Integrating your game with GooglePlus
To access GooglePlus profile data..
Person profile;
try {
profile = plus.people.get("me").execute();
} catch (HttpResponseException e) {
log.severe(Util.extractError(e));
return;
}
40. Integrating your game with GooglePlus
Accessing GooglePlus
profile data in a JSP page...
<a href="<%= profile.getUrl() %>">
<img src="<%= profile.getImage().getUrl() %>?sz=100"
/></a>
Welcome, <%= profile.getDisplayName() %>
41. Demo: Introducing 'Cloud Warrior'
App Engine Google Storage
Game Assets
(images/sounds)
Game Scores
Profile Data
http://ae-cloudwarrior.appspot.com
42. PlayN Summary
● Open source, cross-platform game abstraction layer
○ Core game logic is platform agnostic
● ForPlay abstracts away the core components of a game
○ The game loop, I/O system, and asset management
● Write in familiar Java, get performance on multiple
platforms
○ Superior Java development/debug
○ GWT allows compilation to fast JavaScript/HTML5
● Your assignment:
○ Install PlayN and build a game!
○ http://code.google.com/p/playn/
43. Announcing the New PlayN Developer Site!
http://developers.google.com/playn/