Beginning Facebook Game Apps Development Wayne Graham Apress*
Contents Contents at a Glance... About the Author About the Technical Reviewer Acknowledgments Introduction iv x xi xii xiii Chapter 1: First Steps 1 Gaming in the Browser 1 HTML5 and the Canvas Element 2 Game Terminology 3 Game Views 3 General Terms 8 Game Genres 12 Summary 14 Chapter 2: JavaScript Boot Camp 15 What Is JavaScript? 15 Testing Out JavaScript 18 Firebug 18 Chrome 19 Debugging 20 Comments 21 Data Types 22 Variables 23 Operators 25 Assignment 25 Comparison 26 Arithmetic Operators 26 Logical Operators 27 String Operators 28 Special Operators 30 Data Structures 32 Array 32 Flow Control 34 V
CONTENTS if..else 34 Switch Loops 36 Functions 38 Variable Scope Special Variables 41 Document Object Model 42 Guess the Number Game 43 Getting Good with JavaScript 46 Summary Chapter 3: It's All About Context: Canvas Basics 49 Canvas: The 2D Context 50 First Shape 51 Triangles and Lines 55 Translation and Rotation 58 Simple Motion 60 Debugging Tools 66 What About Mobile? 67 Summary 68 Chapter 4: The Plan: Idea to Design 69 The Design Process 69 Brainstorming 70 Identify Your Audience 71 Identify Your Competition 72 Artistic Direction 73 Project Review 74 Feature Cull 75 Planning Milestones 76 Code 77 Deployment 77 User Testing 78 Launch 78 Summary 79 Chapter 5: Essential Game Components 81 Types of Graphics 81 Graphics Tools 83 Graphics Design Process 85 Sketch 85 Refine 86 Produce 86 Techniques 90 Lighting 90 Depth 94 Color 95 Focus and Blur 96 Movement 96 Drop Shadow 97 35 39 47 vi
i. CONTENTS Audio 97 Creating Sounds 98 Software 98 Hardware 100 Recording 101 Royalty-Free Sounds 102 Preparing Your Audio 103 Understanding Copyright 104 Creative Commons BY(CC-BY) 105 Creative Commons BY Share Alike (CC-BY-SA) 105 Creative Commons 0 (CCO) 105 Gnu General Public License (GPL) 105 Apache 2.0 106 MIT 106 Dual/Multi License 106 Summary 107 Chapter 6: Your First Game: Alien Turtle Invasion 109 Defining the Game 109 Define the Audience 110 Identify the Competition 110 Boilerplate 111 Coding the Engine 114 Adding Textures 136 Adding Sound 140 Summary 143 Chapter 7: Social Components and HTML5 Games 145 Social Mechanics in Games 146 Tic-Tac-Toe 146 The Rules 150 The Board 150 Keeping Track 152 Adding Some Intelligence 156 Going Further 161 Next Steps 170 Summary 170 Chapter 8: Introducing the Facebook Platform 171 The Facebook Development Platform 171 Creating Applications with the Facebook Platform 173 Basic Info 176 Cloud Services 176 Facebook Integration 177 Software Development Kits 178 Your First Facebook Application 178 Prerequisites 178 Facebook Setup 183 Using the Graph API 187 Searching 193 Vli
CONTENTS Facebook Query Language Facebook SDKs Setting up a Development Environment 198 Summary 200 Chapter 9: Facebook Developer Tools 201 Developer App Open Graph Protocol Open Graph Types Open Graph Stories Aggregations Achievements Credits Credit Callback Troubleshooting Roles Insights Summary Chapter 10: Creating Your First Facebook Game 231 Project Planning 231 Define the Rules 231 Identify Your Audience 232 Competition Developing the HTML Game 234 Project Setup 234 Game Code 235 Facebook Integration 249 2.0 Ideas 262 Summary 263 Chapter 11: Adding Facebook Components 265 Adding Levels 265 Adding a Timer 271 Working with Databases on Heroku 273 Recording Puzzle Information 278 Tracking Achievements 283 Assigning Achievements 287 Customizing the Authorization Dialog 288 Creating Your Privacy Policy 290 Defining Your Terms of Service 291 Adding Your Terms of Service Policy 292 Deployment Concerns 293 Summary 298 Chapter 12: Launching Your Game 301 Website 301 WordPress 302 WordPress Plugins 306 Social Plugins 308 Facebook Pages 308 130 198 201 201 203 206 209 210 216 223 223 224 226 229 232 viii
CONTENTS Customizing Your Page 314 Promoting Your Page 320 Advertising 321 Content 321 Plug 321 Targeting Ads 322 Interaction 322 Cycle II 323 Cycle III 323 Driving Likes 323 Create a WordPress Category 324 Facebook Tabs 324 Launch Checklist 329 Content and Style 329 Functional Testing 330 Finishing Touches 330 Ongoing 330 Summary 330 Chapter 13: HTML5 Game Engines 333 Development 333 Open Source 334 Canvas Advanced Animation Toolkit 334 Cocos2d.js 340 Crafty 343 LimeJS 346 melonjs 350 Play My Code 350 PixieEngine 351 Paid Game Engines 352 ImpacUS 353 Isogenic 353 Summary 354 Chapter 14: Facebook Fuzed 355 Game 355 Tiled Map Editor 356 melonjs Framework 362 Creating the Game files 362 Background 373 Facebook Score API 390 Summary 402 Index 405 ix