James Quick | Technical EvangelistShahed Chowdhuri | Sr. Technical Evangelist

Game Development with Construct 2

Meet James Quick | @jquickwit

• Contact Information– Email: jaquick@Microsoft.com– Blog: http://blogs.msdn.com/quick_thoughts/–Meetup: Miami-Ft Lauderdale Windows App Developers– Youtube Channel: http://bit.ly/JQYouTube

• Background– Games published to Windows 8 and Windows Phone Stores– Admin on Construct 2 Facebook group

Meet Shahed Chowdhuri | @shahedc

• Sr. Technical Evangelist, East Coast– Works with students, indie developers, startups– Focuses on DC, MD, VA and beyond

• Indie Dev Background – Games published on Windows 8, Windows Phone, Xbox 360– Dev tools published for Xbox 360 developers– Founder/admin of FB game dev groups (Xbox One, Unity, Construct

2)

• Online– Blog: http://WakeUpAndCode.com – Twitter: @shahedC, Email: shchowd@microsoft.com – Meetup: http://aka.ms/msdcmeetup

Course Topics

Game Development with Construct 2

01 | Introduction to Construct 2 and Building Your First Game 03 | Exploring Construct 2 Templates

02 | Expanding Your Game in Construct 2 04 | Exporting and Publishing Your Game

Setting Expectations

• Target Audience– Students (as young as middle schools)– Developers/Professionals with free time– Any age, any background

• Suggested Prerequisites/Supporting Material– Creativity• No Computer Science experience required

• Microsoft Virtual Academy– Free online learning tailored for IT Pros and Developers – Over 1M registered users– Up-to-date, relevant training on variety of Microsoft

products

• “Earn while you learn!” – Get 50 MVA Points for this event!– Visit http://aka.ms/MVA-Voucher – Enter this code: GameDevConst2 (expires 10/6/2014)

Join the MVA Community!

Click to edit Master subtitle style01 | Introduction to Construct 2

and Building Your First Game

James Quick | Technical EvangelistShahed Chowdhuri | Senior Technical Evangelist

• Intro to Game Making

• Introduction to Construct 2

• Hands on Demo- Top Down Shooter

Module Overview

Click to edit Master subtitle styleIntro to Game Making

Intro to Game Making

• Game are everywhere… Mobile devices are everywhere!

• Successful/ popular games– Flappy Bird –Words with Friends– Candy Crush– Angry Birds

Why Make Mobile Games?

• Money!– 3 main ways to make money• Ads (Flappy Bird)• In App Purchases (IAP) (Candy Crush)• Sell your game (Angry Birds)

• Resume/Portfolio– Student? Professional developer?

Stats…WOW!!

• 100+ million U.S. gamers (almost 1/3 of population)

• 34% of the top 100 grossing apps in the App store are using the freemium model

• Mobile gaming industry is predicted to reach $54 billion by 2015

• Over 80% of all revenue by mobile in 2012 was from games

• Mobile games are the most popular App Category

• 70-80% of all mobile downloads are games

Click to edit Master subtitle styleIntroduction to Construct 2

What is Construct 2?

• Construct 2 is a powerful ground breaking HTML5 game creator designed specifically for 2D games. It allows anyone to build games-no coding required!

Downloading Construct 2

• https://www.scirra.com/ Download!

Cross Platform

• Publish anywhere…

CNG Studios

– Over 50 games in Windows 8 and Windows Phone Stores each

– Over 250,000 downloads– http://www.cngstudios.com

UnUrban Tech: Game Dev with Family

• Gerrel Jones– 39 year old Freelance App Developer– Builds games with Construct 2 and Unity– Lost home in fire…– … but building games with the family to raise funds – wife is a Social Media maven– 6 kids (one who is Autistic) are the marketing/creative development

depts.

• Q&A: http://wakeupandcode.com/unurbantech-qa-with-gerrell-jones/

• Soft Kitty HD on Windows 8: http://apps.microsoft.com/windows/en-us/app/soft-kitty-hd/bcc611ad-61f2-4583-b0d3-6e0dae5007cb

The IDEToolbar Projects/Layers

ObjectsLayoutProperties

Tabs for Layouts & Event Sheets

• Ex. Tiled Backgrounds, Sprites, Text, etc.

• Add an object– Double click layout or Right click and select “Add Object”– “When inserting a new object, typically you first choose

the plugin in the dialog (e.g. Sprite). This then creates an object type. When the mouse turns to a crosshair this allows you to place the first instance, and you can duplicate the instance to create more of them.”

• Adding Logic– Event sheet or Behaviors

Objects

• Built in logic to apply to your Objects– Bullet- move at given

angle– Scroll To- centers the view

on the object with the behavior

– Destroy Outside Layout–Many many more!

• Add Behavior– Properties Pane for Object

Behaviors

• Layout– “a pre-arranged layout of objects”– Add objects and arrange them• Size, orientation, behaviors, etc.

• Event Sheet– Logic for your game– lists of events and actions

Layout vs. Event Sheet

Events• “Define how the game

works using a logical block system”

• Checks for a condition (ex. On Start of Layout)

• Can have nested events

Actions• Appears to the right of

the listed events

• Occurs when triggered by corresponding event

• Can have multiple for actions for one event

Event Sheet

KNOW YOUR X and Y!

Graphs in Math class Graphs in Computer Graphics

DEMOHands on Demo- Top Down Shooter

Top Down Shooter

• Inserting Objects

• Adding Behaviors

• Events

• Adding Game Functionality

• Instance Variables

• Keeping Score

• Creating an HUD

Inserting Objects

• Tiled Background

• Adding a Layer

• Add the Input Objects– Keyboard and touch

• The Game Objects– Player–Monster– Bullet– Explosion

Adding Behaviors

• Behaviors– Player- 8Direction, ScrollTo, BoundToLayout– Bullet Object- Bullet and Destroy Outside Layout–Monster-Bullet– Explosion- Fade

• Create Some More Monsters

Events

• About Events–When condition is

met, action is executed

– Run 60 times/sec (“tic”)

• Conditions, Actions, and Sub-Events

• Your First Event–Move player towards

mouse every tick

Adding Game Functionality

• Get player to shoot– Shoot when user

clicks

• Explosion Effect

• Making Monsters a little Smarter

Instance Variables

• Add Instance Variable– Player - Health

• Changing the Events– Subtract from health

instead of killing monster

– Kill monster if health is less than 0

Keeping Score

• Add Global Variable– Instead of instance

variable– Right-Click on

Event Sheet and choose “Add Global Variable”

– Increase Score each time a monster dies

Creating a Heads Up Display

• Interface to show health, score, etc.

• Create an HUD Layer

• Set parallax to 0– Doesn’t move

when scrolling

• Insert Text Object– Every tick, update

text

BUT FIRST… HOW DO YOU COMBINE TEXT?

"Score: " & ScoreString Variable&

(ampersand)

spacequote quotetext

Score: 100

WHAT WILL IT LOOK LIKE IN THE GAME?

"Score: " & Scoredisplays

BUT FIRST… WHAT IS PARALLAX?

When the background layers

scroll separately

Finishing Touches

• Create a Monster every 3 seconds

• Allow Monsters to kill players