Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Pixels & Tactics
Search
Amber Feng
October 07, 2015
1
9.6k
Pixels & Tactics
Adventures of building a 2D tactics RPG in the browser!
Amber Feng
October 07, 2015
Tweet
Share
More Decks by Amber Feng
See All by Amber Feng
Move fast, don't break your API
amfeng
18
53k
Building Stripe's API
amfeng
35
52k
Featured
See All Featured
Navigating Team Friction
lara
183
14k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Happy Clients
brianwarren
98
6.7k
Unsuck your backbone
ammeep
668
57k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
10
720
Fashionably flexible responsive web design (full day workshop)
malarkey
405
65k
BBQ
matthewcrist
85
9.3k
The Pragmatic Product Professional
lauravandoore
31
6.3k
YesSQL, Process and Tooling at Scale
rocio
169
14k
Thoughts on Productivity
jonyablonski
67
4.3k
Building Your Own Lightsaber
phodgson
103
6.1k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
900
Transcript
PIXELS & TACTICS @amfeng
None
I REALLY LIKE (J-) RPGS
None
None
None
None
None
None
None
WHAT GOES INTO A GAME?
DESIGN PATTERNS
COMPOSE EVERYTHING
None
Crafty.c("Walkable", { Walkable: function(speed) { this.addComponent("Collision"); this.bind("EnterFrame", function() { if
(paused()) return; if (obstacle() || outOfBounds()) return; // Move the sprite this.playAnimation(this.direction); this.move(this.direction, speed); })
Crafty.c("StrollingEntity", { StrollingEntity: function() { this.direction = randomDirection(); this.bind("EnterFrame", function()
{ // Possibly change direction if (chanceToSwitchDirection()) { this.direction = randomDirection(); } } } });
spawnedMonster .Walkable(5) .StrollingEntity() .Battleable()
Crafty.c("AggroEntity", { AggroEntity: function(player) { this.direction = randomDirection(); this.bind("EnterFrame", function()
{ if (playerInRange()) { this.direction = toPlayer(player); } else if (chanceToSwitchDirection()) { // Change direction this.direction = randomDirection(); } } } });
aggroMonster .Walkable(10) .AggroEntity(player) .Battleable()
grandmaNPC .Walkable(2) .StrollingEntity() .Interactable(dialog)
player .Walkable(5) .PlayerControl()
*-FACTORIES
var Fox = function() { this.hp = 10; this.damage =
10; } var WaterFairy = function() { this.hp = 4; this.damage = 6; } var fox = new Fox(); var waterFairy = new WaterFairy();
var Monster = function(attrs) { // Set attrs } var
fox = new Monster({ hp: 4, damage: 6 });
None
var MonsterFactory = function(csv) { this.data = createMap(csv); } MonsterFactory.prototype.create(type)
{ var attrs = this.data[type]; return new Monster(attrs); }
// During game initialization factory = new MonsterFactory(csv); // And
then later factory.create("fox");
SEPARATE VIEWS FROM LOGIC
THINGS I LEARNED (AND I AM STILL LEARNING)
...ASSETS ARE HARD
None
None
None
None
(https://opengameart.org)
(https://gamedevmarket.net)
(http://pixanna.nl/products)
GAME DEV IS INFINITE
THANK YOU! LMK IF YOU END UP BUILDING A GAME
(: @amfeng @jamescshieh