Deleted features from Anniemon Battle 3: Party Check App (And, it actually works!)
Your App Is Actually A Game @ Snow*Mobile 2014
-
Upload
matt-luedke -
Category
Technology
-
view
572 -
download
1
description
Transcript of Your App Is Actually A Game @ Snow*Mobile 2014
YOUR APP IS ACTUALLY A
GAMESnow*Mobile 2014
YOUR APP IS ACTUALLY A
GAMESnow*Mobile 2014
SOME GUY WITH A MICROPHONE
SOME GUY WITH A MICROPHONE
• An iOS / Android engineer
SOME GUY WITH A MICROPHONE
• An iOS / Android engineer
• Only a hobbyist game developer or designer
WHAT IS THIS ABOUT?
WHAT IS THIS ABOUT?
• A list of important questions, with context
WHAT IS THIS ABOUT?
• A list of important questions, with context
• A challenge for future apps
WHAT IS THIS ABOUT?
• A list of important questions, with context
• A challenge for future apps
• An example with a top current game engine
FOR THE BUSINESS FOLKS
FOR THE BUSINESS FOLKS• From Distimo’s Report for 2013:
FOR THE BUSINESS FOLKS• From Distimo’s Report for 2013:
• “The vast majority of mobile app revenue was generated in the Games category.”
FOR THE BUSINESS FOLKS• From Distimo’s Report for 2013:
• “The vast majority of mobile app revenue was generated in the Games category.”
• The top 10 grossing apps in the App Store were games.
FOR THE BUSINESS FOLKS• From Distimo’s Report for 2013:
• “The vast majority of mobile app revenue was generated in the Games category.”
• The top 10 grossing apps in the App Store were games.
• App Store: 75% of US revenue, 63% world
WHAT IS NOT A GAME?
WHAT IS NOT A GAME?• “You win or you die.”
WHAT IS NOT A GAME?• “You win or you die.”
WHAT IS NOT A GAME?• “You win or you die.”
WHAT IS NOT A GAME?• “You win or you die.”
• “Everything in life!” - my mother, often as I was growing up.
WHAT IS NOT A GAME?• “You win or you die.”
• “Everything in life!” - my mother, often as I was growing up.
• “The only winning move is not to play.”
WHAT IS NOT A GAME?• “You win or you die.”
• “Everything in life!” - my mother, often as I was growing up.
• “The only winning move is not to play.”
WHAT IS NOT A GAME?• “You win or you die.”
• “Everything in life!” - my mother, often as I was growing up.
• “The only winning move is not to play.”
• actually, this is a game.
WHAT IS A GAME?
WHAT IS A GAME?
• Goals, rules, challenges, and interactions.
WHAT IS A GAME?
• Goals, rules, challenges, and interactions.
WHAT IS A GAME?
• Goals, rules, challenges, and interactions.
WHAT IS A GAME?
• Goals, rules, challenges, and interactions.
• “A series of meaningful choices.” - Sid Meier
WHAT IS A GAME?
• Goals, rules, challenges, and interactions.
• “A series of meaningful choices.” - Sid Meier
WHAT IS A GAME?
• Goals, rules, challenges, and interactions.
• “A series of meaningful choices.” - Sid Meier
WHAT IS A GAME?
• Goals, rules, challenges, and interactions.
• “A series of meaningful choices.” - Sid Meier
• Iconic depictions of patterns in the world.
STAGES OF PATTERNHOOD
STAGES OF PATTERNHOOD
• NOISE
STAGES OF PATTERNHOOD
• NOISE
STAGES OF PATTERNHOOD
• NOISE
STAGES OF PATTERNHOOD
• NOISE
• Learning
STAGES OF PATTERNHOOD
• NOISE
• Learning
STAGES OF PATTERNHOOD
• NOISE
• Learning
STAGES OF PATTERNHOOD
• NOISE
• Learning
• Mastery
STAGES OF PATTERNHOOD
• NOISE
• Learning
• Mastery
STAGES OF PATTERNHOOD
• NOISE
• Learning
• Mastery
STAGES OF PATTERNHOOD
• NOISE
• Learning
• Mastery
• Comfort / Boredom
STAGES OF PATTERNHOOD
• NOISE
• Learning
• Mastery
• Comfort / Boredom
SPATIAL / COLOR
SPATIAL / COLORBlue always makes you win!
-or- Always go to the left!
PHYSICS / TIMING
PHYSICS / TIMINGButton-smashing!
LIFE / DEATH
LIFE / DEATH
Infinite lives, no consequences!
WARFARE
WARFARE
Play as the “Good Guys” to win!
REWARDS
REWARDSAwkward “Gamification"
- or - Manipulation / Social Referencing
SOCIAL STATUS / ROLES
SOCIAL STATUS / ROLES“Save the princess”
- or - Reinforcing stereotypes
EXAMPLES OF PATTERNSType Example Done Irresponsibly
Spatial / Color Tetris Blue is the best!
Physics / Timing Super Mario Bros. Button-smashing!
Life / Death Chess No consequences.
Warfare Starcraft The “good guys” always win!
Rewards Olympic Medals Manipulation, social referencing
Social Status / Roles The Sims Save the princess, stereotyping
YOUR APP:
YOUR APP:• At first, it is just NOISE
YOUR APP:• At first, it is just NOISE
• Use design patterns
YOUR APP:• At first, it is just NOISE
• Use design patterns
• Reflect real-world patterns
YOUR APP:• At first, it is just NOISE
• Use design patterns
• Reflect real-world patterns
• Introduce your new patterns
YOUR APP:• At first, it is just NOISE
• Use design patterns
• Reflect real-world patterns
• Introduce your new patterns
• Avoid comfort / boredom
IS YOUR APP TIC-TAC-TOE?
IS YOUR APP TIC-TAC-TOE?
QUESTIONS TO ASK
QUESTIONS TO ASK
• What patterns does my app have?
QUESTIONS TO ASK
• What patterns does my app have?
• At what stage are they presented?
QUESTIONS TO ASK
• What patterns does my app have?
• At what stage are they presented?
• Are they presented responsibly?
QUESTIONS TO ASK
• What patterns does my app have?
• At what stage are they presented?
• Are they presented responsibly?
• Are there any other patterns it should have?
BUDDING GAME ENVIRONMENTS
BUDDING GAME ENVIRONMENTS
• Game Center and Google Play Game Services
BUDDING GAME ENVIRONMENTS
• Game Center and Google Play Game Services
• Leaderboards
BUDDING GAME ENVIRONMENTS
• Game Center and Google Play Game Services
• Leaderboards
• Achievements
BUDDING GAME ENVIRONMENTS
• Game Center and Google Play Game Services
• Leaderboards
• Achievements
• Matchmaking
BUDDING GAME ENVIRONMENTS
• Game Center and Google Play Game Services
• Leaderboards
• Achievements
• Matchmaking
• What should be added?
SPRITE KIT
SPRITE KIT• Apple Framework for iOS 7+ and OS X 10.9+
SPRITE KIT• Apple Framework for iOS 7+ and OS X 10.9+
• Introduced at WWDC 2013
SPRITE KIT• Apple Framework for iOS 7+ and OS X 10.9+
• Introduced at WWDC 2013
• Integrated into Xcode 5
SPRITE KIT• Apple Framework for iOS 7+ and OS X 10.9+
• Introduced at WWDC 2013
• Integrated into Xcode 5
• Aids 2-D animations and physics
SPRITE KIT• Apple Framework for iOS 7+ and OS X 10.9+
• Introduced at WWDC 2013
• Integrated into Xcode 5
• Aids 2-D animations and physics
• Doesn’t require going into OpenGL
SPRITE KIT• Apple Framework for iOS 7+ and OS X 10.9+
• Introduced at WWDC 2013
• Integrated into Xcode 5
• Aids 2-D animations and physics
• Doesn’t require going into OpenGL
• Meaning: not scary
WHAT IS A SPRITE?
WHAT IS A SPRITE?
WHAT IS A SPRITE?
• An image or animation integrated into a larger scene
WHAT IS A SPRITE?
• An image or animation integrated into a larger scene
• Characters
WHAT IS A SPRITE?
• An image or animation integrated into a larger scene
• Characters
• Other moving objects
NODES
NODES
• BTW, everything has an SK in front of it
NODES
• BTW, everything has an SK in front of it
• SKNodes have parent-child relationships
NODES
• BTW, everything has an SK in front of it
• SKNodes have parent-child relationships
THE SNOWY PLANET BATTLE MENU
THE SNOWY PLANET BATTLE MENU
• Snowfall in the background
THE SNOWY PLANET BATTLE MENU
• Snowfall in the background
• Snow buildup on the buttons
THE SNOWY PLANET BATTLE MENU
• Snowfall in the background
• Snow buildup on the buttons
• A floating title (with orbiting lasers)
THE SNOWY PLANET BATTLE MENU
• Snowfall in the background
• Snow buildup on the buttons
• A floating title (with orbiting lasers)
• Choosing an option causes lasers to fire
THE SNOWY PLANET BATTLE MENU
• Snowfall in the background
• Snow buildup on the buttons
• A floating title (with orbiting lasers)
• Choosing an option causes lasers to fire
• And an EXPLOSION
FIRST THINGS FIRST
FIRST THINGS FIRST
• Import SpriteKit into your Xcode project
FIRST THINGS FIRST
• Import SpriteKit into your Xcode project
• Create an SKView
FIRST THINGS FIRST
• Import SpriteKit into your Xcode project
• Create an SKView
• Have that SKView present a custom-made subclass of SKScene
FIRST THINGS FIRST
• Import SpriteKit into your Xcode project
• Create an SKView
• Have that SKView present a custom-made subclass of SKScene
• Note that SKScene extends SKNode, so it has a parent-child setup
SNOWFALL
SNOWFALL
• SKEmitterNode
SNOWFALL
• SKEmitterNode
• automatically creates small sprites
SNOWFALL
• SKEmitterNode
• automatically creates small sprites
• created and edited in Xcode 5
SNOWFALL
• SKEmitterNode
• automatically creates small sprites
• created and edited in Xcode 5
• Just add to a parent SKNode and it runs until you remove it
SNOWFLAKE SPRITES
SNOWFLAKE SPRITES
• To make each snowflake:
SNOWFLAKE SPRITES
• To make each snowflake:
• Create a new SKSpriteNode with a horizontally-random starting position
SNOWFLAKE SPRITES
• To make each snowflake:
• Create a new SKSpriteNode with a horizontally-random starting position
• Give it a new SKPhysicsBody and let Newton take over
SNOWFLAKE SPRITES
• To make each snowflake:
• Create a new SKSpriteNode with a horizontally-random starting position
• Give it a new SKPhysicsBody and let Newton take over
• It melts after some time or when it leaves the screen
THE FLOATING TITLE
THE FLOATING TITLE
• Create an SKLabelNode with text, font, etc.
THE FLOATING TITLE
• Create an SKLabelNode with text, font, etc.
• Create a forever-repeating SKAction to float
THE FLOATING TITLE
• Create an SKLabelNode with text, font, etc.
• Create a forever-repeating SKAction to float
• Assign it an SKPhysicsBody
THE FLOATING TITLE
• Create an SKLabelNode with text, font, etc.
• Create a forever-repeating SKAction to float
• Assign it an SKPhysicsBody
• But turn off the dynamic boolean
ADD LASERS!
ADD LASERS!
• Create SKSpriteNodes
ADD LASERS!
• Create SKSpriteNodes
• Create + Assign flash and orbit SKActions
ADD LASERS!
• Create SKSpriteNodes
• Create + Assign flash and orbit SKActions
• Positions are automatically relative to their parent
ADD LASERS!
• Create SKSpriteNodes
• Create + Assign flash and orbit SKActions
• Positions are automatically relative to their parent
• So as the title floats, lasers move with it
CHOOSING A MENU OPTION
CHOOSING A MENU OPTION• Add plain old UIButtons
CHOOSING A MENU OPTION• Add plain old UIButtons
• Also add non-dynamic SKNodes for snow to accumulate
CHOOSING A MENU OPTION• Add plain old UIButtons
• Also add non-dynamic SKNodes for snow to accumulate
• When pressed:
CHOOSING A MENU OPTION• Add plain old UIButtons
• Also add non-dynamic SKNodes for snow to accumulate
• When pressed:
• Remove all SKActions from the laser nodes
CHOOSING A MENU OPTION• Add plain old UIButtons
• Also add non-dynamic SKNodes for snow to accumulate
• When pressed:
• Remove all SKActions from the laser nodes
• Assign new SKAction to move to the center of pressed button
CHOOSING A MENU OPTION• Add plain old UIButtons
• Also add non-dynamic SKNodes for snow to accumulate
• When pressed:
• Remove all SKActions from the laser nodes
• Assign new SKAction to move to the center of pressed button
• BUT NOW WE WANT IT TO EXPLODE
EXPLODE THE BUTTON
EXPLODE THE BUTTON• SKActions can execute completion blocks
EXPLODE THE BUTTON• SKActions can execute completion blocks
• So once lasers hit, remove button and add another SKEmitterNode
EXPLODE THE BUTTON• SKActions can execute completion blocks
• So once lasers hit, remove button and add another SKEmitterNode
• After an action-film-worthy period of time, remove the emitter
EXPLODE THE BUTTON• SKActions can execute completion blocks
• So once lasers hit, remove button and add another SKEmitterNode
• After an action-film-worthy period of time, remove the emitter
• Navigate to some other screen
FRAME RATE
CHECK YOUR FRAME RATE
CHECK YOUR FRAME RATE
• Show on-screen using SKView’s showFPS property
CHECK YOUR FRAME RATE
• Show on-screen using SKView’s showFPS property
• Debug Navigator in Xcode
CHECK YOUR FRAME RATE
• Show on-screen using SKView’s showFPS property
• Debug Navigator in Xcode
CHECK YOUR FRAME RATE
• Show on-screen using SKView’s showFPS property
• Debug Navigator in Xcode
• Profile using Instruments
CHECK YOUR FRAME RATE
• Show on-screen using SKView’s showFPS property
• Debug Navigator in Xcode
• Profile using Instruments
• Core Animation preset will work
TO LEAVE WITH…
TO LEAVE WITH…
• There is a lot of exciting research going on around games and learning.
TO LEAVE WITH…
• There is a lot of exciting research going on around games and learning.
• There are a lot of unexplored patterns for apps
TO LEAVE WITH…
• There is a lot of exciting research going on around games and learning.
• There are a lot of unexplored patterns for apps
• Introducing game dynamics and physics is easy and fun!
THANK YOU
• @matt_luedke
• mattluedke.com
• github.com/mluedke2/snowy-planet-battle-menu