Uploaded byNadya Direkova
Game on: 16 design patterns for user engagement
The document discusses 16 design patterns for using game mechanics to create user engagement in social web applications. It covers patterns for attracting first-time users ("Come and Try It") like visual storytelling, tutorials, and reward schedules. Patterns for building community ("Bring Your Friends") include forming teams, social feedback, and sharing milestones. Patterns for repeat visits ("Come Back") consist of advanced user paths, content unlocks over time, quest queues, and using scarcity and time pressure. The document stresses measuring the effects of these patterns and iterating based on metrics.
More Related Content
![[GAMENEXT] 라이프스타일에서의 게이미피케이션 적용 사례(말랑스튜디오)](https://cdn.slidesharecdn.com/ss_thumbnails/13130201-130211174546-phpapp02-thumbnail.jpg?width=640&height=640&fit=bounds)
Similar to Game on: 16 design patterns for user engagement
Game on: 16 design patterns for user engagement
- 1. GAME ON: 16DESIGN PATTERNSFOR USER ENGAGEMENTUsing game mechanicsto create engagement in social web applications.NadyaDirekova, @nadya_dSenior UX Designer, Game MechanicSXSW March 14th 2011
- 2. ABOUT ME: ONEFOOT IN GAMES, ONE FOOT IN UXM.I.T. RazorfishLeapfrog Backbone Ent.Google / Hotpot
- 3.
- 4. What are gamemechanics?Design patterns that promoteplay and play-like engagement.GAME MECHANICS
- 5. What are gamemechanics?Design patterns that promoteplay and play-like engagement.GAME MECHANICS Repeatablesolutions to design problem.DESIGN PATTERNS
- 6. What are gamemechanics?Design patterns that promoteplay and play-like engagement.GAME MECHANICS Repeatablesolutions to design problem.DESIGN PATTERNS
- 7. What are gamemechanics?Design patterns that promoteplay and play-like engagementGAME MECHANICS Repeatablesolutions to design problem.DESIGN PATTERNS
- 8. What are gamemechanics?Design patterns that promoteplay and play-like engagementGAME MECHANICS Repeatablesolutions to design problem.DESIGN PATTERNS
- 9. GAME MECHANICS –A BROAD ARRAY OF APPLICATIONSSpending on Social Media Marketing and GamificationBudgetingLocation SharingTest PrepRecyclingGrockit.comFour SquareRecycle bank.comMint.comChoresExerciseTask ManagementEven Brushing Teeth…Nike PlusEpic WinChore Wars
- 10. A BROAD ARRAYOF THINKERSSpending on Social Media Marketing and Gamification
- 11. GAMIFICATION IS THENEW BLACKSpending on Social Media Marketing and Gamification
- 12. STATS AROUND GAMEMECHANICSWhat are companies looking to achieve with game mechanics?Source: M2 Research
- 13. STATS AROUND GAMEMECHANICSWhat is the current breakdown of companies on the gamification adoption curve?Source: M2 Research
- 14. PROJECTED MARKETING SPENDINGON GAME MECHANICSSpending on Social Media Marketing and GamificationSource: M2 Research
- 15. GAMIFICATION FATIGUESpending onSocial Media Marketing and Gamification
- 16. This is powerfulstuff
- 17. IT’S MORE THANPOINTS AND BADGES:>Game mechanics
- 18. GAME MECHANICS DESIGNPATTERNS
- 19. LET’S TALK ABOUT...WE’LLREVIEW 16 DESIGN PATTERNSTHAT CREATE GAME-LIKE USER ENGAGEMENT.
- 20. LET’S TALK ABOUT...WE’LLREVIEW 16 DESIGN PATTERNSTHAT CREATE GAME-LIKE USER ENGAGEMENT.WE’LL DISCUSS HOW THEY APPLY TO 3 ASPECTS OF THE USER JOURNEY
- 21. LET’S TALK ABOUT...WE’LLREVIEW 16 DESIGN PATTERNSTHAT CREATE GAME-LIKE USER ENGAGEMENT.WE’LL DISCUSS HOW THEY APPLY TO 3 ASPECTS OF THE USER JOURNEY: COME AND TRY IT
- 22. LET’S TALK ABOUT...WE’LLREVIEW 16 DESIGN PATTERNSTHAT CREATE GAME-LIKE USER ENGAGEMENT.WE’LL DISCUSS HOW THEY APPLY TO 3 ASPECTS OF THE USER JOURNEY: COME AND TRY ITBRING FRIENDS
- 23. LET’S TALK ABOUT...WE’LLREVIEW 16 DESIGN PATTERNSTHAT CREATE GAME-LIKE USER ENGAGEMENT.WE’LL DISCUSS HOW THEY APPLY TO 3 ASPECTS OF THE USER JOURNEY: COME AND TRY ITBRING FRIENDSCOME BACK
- 24. “COME AND TRYIT” - Designing for 1st time users Visual story telling
- 25.
- 26.
- 27.
- 28.
- 29. DisincentivesDESIGN PATTERN1.1VISUAL STORYTELLING
- 30. DESIGN PATTERN Visual story telling – instead of long explanationsRUB RABBITS PRE-GAME SCREENGAME EXAMPLE
- 31. DESIGN PATTERN Visual story telling – instead of long explanationsGROUP-ON: HOW IT WORKSZIP CAR: EXPLAIN THE PROPOSITION IN PICTURES
- 32.
- 33. DESIGN PATTERN VISUAL CLUEsCITY OF IMMORTALSGAME EXAMPLE
- 34. DESIGN PATTERN Visual CLUES: exampleFACEBOOK PLACES: PLAYING “FLASHLIGHT”
- 35. DESIGN PATTERN Visual CLUES: examplePANDORA: HIGHLIGHT FEATURES THE USER MIGHT MISS OTHERWISE
- 36. DESIGN PATTERN1.3 TUTORIAL/ ONBOArDING ON RAILS
- 37. DESIGN PATTERN TUTORIAL / ONBoArDING ON RAILSFRONTIERVILLEGAME EXAMPLE
- 38. DESIGN PATTERN TUTORIAL / ONBOARDING ON RAILSRIBBON HEROGET GLUE: EXPERIENCE THE APP DURING THE ON-BOARDING
- 39. DESIGN PATTERN1.4 responsiveobjects
- 40. DESIGN PATTERN responsive objectsGAME EXAMPLE
- 41. DESIGN PATTERN responsive objectsKNOW THAT YOU’RE DOING OK LOGGING IN WITH MINT.COMHOVER ON A TWEET TO REVEAL NEW OPTIONS
- 42. DESIGN PATTERN1.5 rewardschedule
- 43. DESIGN PATTERN Reward scheduleCITYVILLE COINS AND STARS: REWARDS FOR TAKING CARE OF YOUR CITY“You can’t over-reward the player in the first 10 minutes.” - Sid Meier, designer of the game Civilization
- 44. DESIGN PATTERN Reward the beginnerSHOPKICKIMVU: POINTS FOR TRYING NEW THINGSFOUR SQUARE NEWBIE BADGE
- 45. DESIGN PATTERN Challenge the expertPLANTS VS. ZOMBIE: SOME ACHIEVEMENTSSEEM ALMOST IMPOSSIBLE TO UNLOCKFOURSQAURE: SOME ACHIEVEMENTS ARE HARDER TO UNLOCK
- 46.
- 47. DESIGN PATTERN DISincentivesPACMAN – YOU GOT EATEN BY GHOSTS!GAME EXAMPLE
- 48. DESIGN PATTERN DISincentivesSTICKK HELPS YOU STICK TO GOALS USING NEGATIVE INCENTIVES
- 49. DESIGN PATTERN DISIncentivesGROCKIT :A/B TESTING SHOWS THAT NEGATIVE INCENTIVES HURT USER ENGAGAMENT
- 50. summary“come and tryit” Visual story telling
- 51.
- 52.
- 53.
- 54.
- 55. DisincentivesDESIGN PATtERnsfor social engagement“Bring your friends”
- 56. “BRING FRIENDS” -Designing for community Gated trial – form a team
- 57.
- 58.
- 59.
- 60. MischiefDESIGN PATTERN2.1gated trial – form a team
- 61. DESIGN PATTERN gated TRIAL – FORM A TEAM TO STARTDODGE-BALL – YOU NEED A TEAM TO STARTGAME EXAMPLE
- 62. DESIGN PATTERN Why is a team so important?
- 63. DESIGN PATTERN GATED TRIAL – FORM A TEAM TO START
- 64. DESIGN PATTERN GATED TRIAL – FORM A TEAM TO STARTOLD TWITTER SIGN UP – 3 SCREENSNEW TWITTER SIGN UP – 4 SCREENS (NOW REDESIGNED)
- 65. DESIGN PATTERN GATED TRIAL – FORM A TEAM TO STARTNEW TWITTER SIGN UP
- 66. DESIGN PATTERN2.2 socialfeedback
- 67. DESIGN PATTERN social FEEDBACkCITYVILLE – ASYNCHRONOUS COMMUNICATION BUTTONSGAME EXAMPLE
- 68. DESIGN PATTERN SOCIAL FEEDBACK EXAMPLE – thank you buttonsAADVARK “THANK YOU NOTES”QUORA “THANK YOU NOTES”
- 69. DESIGN PATTERN Social feedback EXAMPLE - COMPLIMENTSYELP: SELECT A COMPLIMENT AND WRITE A MESSAGE
- 70. DESIGN PATTERN Social feedback EXAMPLE – VOTING, LIKES, RETWEETSQUORA VOTINGFACEBOOK LIKESTWEET AND RETWEET
- 71.
- 72. DESIGN PATTERN REPUTATIONSIMPLE REPUTATION SCORE IN CITYVILLEGAME EXAMPLE
- 73. DESIGN PATTERN REPUTATIONEBAY REPUTAION = MORE TRUSTONE UP ME FORUM REPUTAION = MORE VOTING POWER
- 74. Design pattern2.3sharingachievements
- 75. DESIGN PATTERN Sharing achievementsXBOX LIVEGAME EXAMPLE
- 76. DESIGN PATTERN Sharing ACHIEVEMENTSFOUR SQAURE BADGE UNLOCKED!
- 77.
- 78. DESIGN PATTERN MISCHIEFFARMVILLE – TP SOMEONE’S FARMGAME EXAMPLE
- 79. DESIGN PATTERN MISCHIEf RE-DIRECT“CHATROULETTE”
- 80. in summarysocial Gatedtrial – form a team
- 81.
- 82.
- 83.
- 84. MischiefDESIGN PATTERNsfor repeat engagement“player, come back”
- 85. “COME BACK” -Designing for return visits Advanced user paths
- 86.
- 87.
- 88.
- 89. ScarcityDESIGN PATTERN3.1advanced user paths
- 90. DESIGN PATTERN Advanced user paths / rolesSKI SLOPES: DIFFERENT PATHS ON THE SAME MOUNTAIN
- 91. DESIGN PATTERN Advanced user paths / rolesYELP FOR THE REGULAR USERSYELP THE ELITE SQUAD – USEFUL , FUNNY AND COOL
- 92. DESIGN PATTERN Advanced user paths / rolesFOURSQUARE MAYORSHIP
- 93. DESIGN PATTERN3.2 contentunlocks
- 94. DESIGN PATTERN Content unlocksANGRY BIRDSGAME EXAMPLE
- 95. DESIGN PATTERNContent unlocksDAILYUNLOCKS IN THE UNIFORM PROJECT
- 96.
- 97. DESIGN PATTERN QUEST QUEuEZOMBIE FARMGAME EXAMPLE
- 98. DESIGN PATTERN QUEST QUEuE: exampleEPIC WIN – SELF DESIGNED QUEST QUEUELINKED IN QUEST QUEUE
- 99. DESIGN PATTERN3.4 timepressure
- 100. DESIGN PATTERN Time pressureCHESS TIMERGAME EXAMPLE
- 101. DESIGN PATTERN TIME PRESSURESWOOPOEBAY BIDDING
- 102.
- 103. DESIGN PATTERN SCARCITYVIP FISH IN ZYNGAGAME EXAMPLE
- 104. DESIGN PATTERN Scarcity: exampleTHE MILLION DOLLARHOMEPAGE
- 105. DESIGN PATTERN Scarcity = SPECIALNESS HOTPOT “BEST EVER”
- 106. in summaryreturn visitorsAdvanced user paths
- 107.
- 108.
- 109.
- 110.
- 111. METRICSIT’S MEASURABLE!BE PREAPEDTO MEASURE AND ITERATE
- 112. METRICSIT’S MEASURABLE!BE PREPAREDTO MEASURE AND ITERATE
- 113. METRICSIT’S MEASURABLE!BE PREPAREDTO MEASURE AND ITERATEEACH PATTERN AND STAGE HAS UNIQUE METRICS
- 114. BUNCHBALL DASHBOARDBE VERYCLEAR: WHAT’S THE USER PROPOSITION
- 115. BUNCHBALL DASHBOARDBE VERYCLEAR: WHAT’S THE USER PROPOSITION
- 116.
- 117.
- 118. IN SUMMARYA growinglist of patterns…COME AND TRY ITBRING FRIENDSCOME BACK Advanced user paths
- 119.
- 120.
- 121.
- 122.
- 123. Gated trial– form a team Social feedback
- 124.
- 125.
- 126.
- 127. Visual storytelling
- 128.
- 129.
- 130.
- 131.
- 132. DisincentivesCASE STUDIESThanksto the following companies forinterviews, best practices and feedback:
- 134.
Editor's Notes
- #16 The real challenge is how to tap into it properly. And that leads us to…
- #26 Key Observations:Games often use cartoon story-boards to explain a taskWithout words, or to amuse the audience during a slow loadTime. Web / mobile apps are also tapping in the power of visual story-telling to explain user propositions or complex processed.
- #29 Key Observations:Game Tutorials often provide full hand-holding – to make sure the player learns the key skills needed without any confusion.
- #33 Key Observations:Game Tutorials often provide full hand-holding – to make sure the player learns the key skills needed without any confusion.
- #36 Key Observations:You can interact with everything in a game world – which feels fun and rewards exploration.
- #40 http://www.IMVU.comA great experience for beginners: IMVU gives you extra points for creating your avatar, talking to someone and even logging back in the next day.
- #41 http://www.IMVU.comA great experience for beginners: IMVU gives you extra points for creating your avatar, talking to someone and even logging back in the next day.
- #43 Key Observations:Negative incentives are common in games – they motivate action by giving the player something to fear to avoid. Negative incentives can be powerful, but very tricky to implement in a web application…
- #50 Key Observations:Many games require two or more players in order to happen – web and mobile apps are starting to do the same.
- #56 Key Observations:Social games are often played asynchronously: that is, when only one of the players is logged it at a time. Having a believable social exchange can be challenging – and designers have found ways to overcome that by using buttons such as “thank you” or “compliment.”Structured social commentary allows players to exchange only the type of dialogue that is desirable for the community – preventing spam and aggressive commentary. If you get a message saying someone “liked” your post or “thanked you,” you are likely to feel good and in that way “reengage” with the application. In addition, some social commentary can be used as a reputation base.
- #59 LINK TO CREATE REPUTATION
- #61 Key Observations:Social games are often played asynchronously: that is, when only one of the players is logged it at a time. Having a believable social exchange can be challenging – and designers have found ways to overcome that by using buttons such as “thank you” or “compliment.”Structured social commentary allows players to exchange only the type of dialogue that is desirable for the community – preventing spam and aggressive commentary. If you get a message saying someone “liked” your post or “thanked you,” you are likely to feel good and in that way “reengage” with the application. In addition, some social commentary can be used as a reputation base.
- #64 Key Observations:Social games are often played asynchronously: that is, when only one of the players is logged it at a time. Having a believable social exchange can be challenging – and designers have found ways to overcome that by using buttons such as “thank you” or “compliment.”Structured social commentary allows players to exchange only the type of dialogue that is desirable for the community – preventing spam and aggressive commentary. If you get a message saying someone “liked” your post or “thanked you,” you are likely to feel good and in that way “reengage” with the application. In addition, some social commentary can be used as a reputation base.
- #65 Key Observations:Sharing milestones – when they are meaningful, can create a viral effect and re-engage dormant users.
- #67 Key Observations:Social games are often played asynchronously: that is, when only one of the players is logged it at a time. Having a believable social exchange can be challenging – and designers have found ways to overcome that by using buttons such as “thank you” or “compliment.”Structured social commentary allows players to exchange only the type of dialogue that is desirable for the community – preventing spam and aggressive commentary. If you get a message saying someone “liked” your post or “thanked you,” you are likely to feel good and in that way “reengage” with the application. In addition, some social commentary can be used as a reputation base.
- #68 Key Observations:Sharing milestones – when they are meaningful, can create a viral effect and re-engage dormant users.
- #77 Key Observations:Progress meters as a tutorial tool: Complex applications can use progress meters to teach "what's next" and motivate users to move to the next stage of the application.Visualizing milestones can be motivational
- #80 Key Observations:Progress meters as a tutorial tool: Complex applications can use progress meters to teach "what's next" and motivate users to move to the next stage of the application.Visualizing milestones can be motivational and create anticipation