nadya direkova - "game on: 16 design patterns for user engagement "
DESCRIPTION
In this session we will discuss the practical design patterns that motivate users to try a product, invite friends and come back. The design patterns include concepts such as rewards, progression and quests, onboarding experience and building the expert player experience.TRANSCRIPT
GAME ON: 16 GAME MECHANICS FOR USER ENGAGEMENT
Using game design thinkingto create engagement in social web applications.
Nadya DirekovaGame Mechanic, Senior UX Designer, Google [x] @nadya_d
Art: Flood it
Page 2About me: Game Designer and UX Designer
Page 3
Page 4
Page 5
Page 6
Page 7
Page 8
Page 9
Page 10
Page 11
Page 12LOL CATS GAME MECHANICS: CASE STUDY
User registrations increased 200% immediately after launch of trophies.User engagement up sharply.Over 63 million user actions rewarded.Over 1.5 million trophies earned in the first 4 months.
+ =
(In other words, engagin’ ur userz.)
Game mechanics
Page 13LOL CATS GAME MECHANICS: TROPHIES, PROGRESSION, STATS, SOCIAL PROOF, SOCIAL ACTIONS, REPUTATION…
Page 14What are game mechanics?
GAME MECHANICS Design patt erns that promoteplay and play-l ike engagement.
Page 15What are game mechanics?
DESIGN PATTERNS Repeatablesoluti ons to design problem.
GAME MECHANICS Design patt erns that promoteplay and play-l ike engagement.
Page 16What are game mechanics?
DESIGN PATTERNS Repeatablesoluti ons to design problem.
GAME MECHANICS Design patt erns that promoteplay and play-l ike engagement.
Page 17What are game mechanics?
DESIGN PATTERNS Repeatablesoluti ons to design problem.
GAME MECHANICS Design patt erns that promoteplay and play-l ike engagement
Page 18What are game mechanics?
DESIGN PATTERNS Repeatablesoluti ons to design problem.
GAME MECHANICS Design patt erns that promoteplay and play-l ike engagement
Page 19LET’S TALK ABOUT...
WE’LL REVIEW
16 DESIGN PATTERNSTHAT CREATE GAME-LIKE USER ENGAGEMENT.
Page 20LET’S TALK ABOUT...
WE’LL REVIEW
16 DESIGN PATTERNSTHAT CREATE GAME-LIKE USER ENGAGEMENT.
Page 21LET’S TALK ABOUT...
WE’LL REVIEW
16 DESIGN PATTERNSTHAT CREATE GAME-LIKE USER ENGAGEMENT.
WE’LL DISCUSS HOW THEY APPLY TO
3 ASPECTS OF THE USER JOURNEY
Page 22LET’S TALK ABOUT...
WE’LL REVIEW
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
Page 23LET’S TALK ABOUT...
WE’LL REVIEW
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
Page 24LET’S TALK ABOUT...
WE’LL REVIEW
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
Page 25
DESIGN PATTERNS FOR ONBOARDING
“COME AND TRY IT”
Page 26“COME AND TRY IT” - Designing for 1st time users
• Visual story telling• Visual cues• Tutorials & Coaching• Reward schedule• Prizes and awards
Page 27
DESIGN PATTERN
1.1 PRIZES AND AWARDS
Page 28D E S I G N PAT T E R N
PRIZES AND AWARDS
GOOD SAMARITHAN PRIZE IN FARMVILLE
GAME EXAMPLE
Page 29D E S I G N PAT T E R N
PRIZES AND AWARDS
X PRIZE
Page 30
DESIGN PATTERN
1.2 VISUAL STORYTELLING
Page 31D E S I G N PAT T E R N
VISUAL STORY TELL ING – INSTEAD OF LONG EXPLANATIONS
RUB RABBITS PRE-GAME SCREEN
GAME EXAMPLE
Page 32D E S I G N PAT T E R N
VISUAL STORY TELL ING – INSTEAD OF LONG EXPLANATIONS
ZIP CAR: EXPLAIN THE PROPOSITION IN PICTURES
GROUP-ON: HOW IT WORKS
Page 33
DESIGN PATTERN
1.3 VISUAL CUES
Page 34
CITY OF IMMORTALS
D E S I G N PAT T E R N
VISUAL CLUES
GAME EXAMPLE
Page 35D E S I G N PAT T E R N
VISUAL CLUES: EXAMPLE
FACEBOOK PLACES: PLAYING “FLASHLIGHT”
Page 36
DESIGN PATTERN
1.4 TUTORIALS & COACHING
Page 37
FRONTIERVILLE
GAME EXAMPLE
D E S I G N PAT T E R N
TUTORIALS
Page 38
LEVEL UP FOR PHOTOSHOP
D E S I G N PAT T E R N
TUTORIAL
Page 39D E S I G N PAT T E R N
COACHING
PANDORA: HIGHLIGHT FEATURES THE USER MIGHT MISS OTHERWISE
Page 40
DESIGN PATTERN
1.5 REWARD SCHEDULE
Page 41D E S I G N PAT T E R N
REWARD SCHEDULE
CITYVILLE 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
Page 42D E S I G N PAT T E R N
REWARD THE BEGINNER
SHOPKICK FOUR SQUARE NEWBIE BADGE
Page 43D E S I G N PAT T E R N
CHALLENGE THE EXPERT
PLANTS VS. ZOMBIE: SOME ACHIEVEMENTSSEEM ALMOST IMPOSSIBLE TO UNLOCK
FOURSQAURE: SOME ACHIEVEMENTS ARE HARDER TO UNLOCK
Page 44
SUMMARY
“COME AND TRY IT”• Prizes and awards• Visual story telling• Visual cues• Tutorials and Coaching• Reward schedule
Page 45
DESIGN PATTERNS FOR SOCIAL ENGAGEMENT
“BRING YOUR FRIENDS”
Page 46“BRING FRIENDS” - Designing for community
• Gated trial – form a team• Social feedback• Compete and collaborate• Reputation• Sharing milestones• Mischief
Page 47
DESIGN PATTERN
2.1 GATED TRIAL – FORM A TEAM
Page 48D E S I G N PAT T E R N
GATED TRIAL – FORM A TEAM TO START
DODGE-BALL – YOU NEED A TEAM TO START
GAME EXAMPLE
Page 49D E S I G N PAT T E R N
GATED TRIAL – FORM A TEAM TO START
QUORA: BRING YOUR FRIENDS
Page 50
DESIGN PATTERN
2.2 SOCIAL FEEDBACK
Page 51D E S I G N PAT T E R N
SOCIAL FEEDBACK
CITYVILLE – ASYNCHRONOUS COMMUNICATION BUTTONS
GAME EXAMPLE
Page 52D E S I G N PAT T E R N
SOCIAL FEEDBACK EXAMPLE – S INGLE BUT TON
AADVARK “THANK YOU NOTES” QUORA “THANK YOU NOTES”
Page 53D E S I G N PAT T E R N
SOCIAL FEEDBACK EXAMPLE - STRUCTURED
OK CUPID: COMPLIMENTSYELP: SELECT A COMPLIMENT AND WRITE A MESSAGE
Page 54
DESIGN PATTERN
2.3 REPUTATION
Page 55D E S I G N PAT T E R N
REPUTATION
SIMPLE REPUTATION SCORE IN CITYVILLE
GAME EXAMPLE
Page 56D E S I G N PAT T E R N
REPUTATION
UBER CAB RATINGS
Page 57
DESIGN PATTERN
2.4 SHARING ACHIEVEMENTS
Page 58D E S I G N PAT T E R N
SHARING ACHIEVEMENTS
XBOX LIVE
GAME EXAMPLE
Page 59D E S I G N PAT T E R N
SHARING ACHIEVEMENTS
FOUR SQAURE BADGE UNLOCKED!
Page 60
DESIGN PATTERN
2.5 MISCHIEF
Page 61D E S I G N PAT T E R N
MISCHIEF
FARMVILLE – TP SOMEONE’S FARM
GAME EXAMPLE
Page 62D E S I G N PAT T E R N
MISCHIEF RE-DIRECT
“CHATROULETTE”
Page 63
IN SUMMARY
SOCIAL • Gated trial – form a team
• Social feedback• Reputation• Compete & collaborate• Mischief
Page 64
DESIGN PATTERNS FOR REPEAT ENGAGEMENT
“PLAYER, COME BACK”
Page 65“COME BACK” - Designing for return visits
• Keeping score• Disincentives, throttles • Advanced user paths • Quest queue• Scarcity
Page 66
DESIGN PATTERN
3.1 KEEPING SCORE
Page 67D E S I G N PAT T E R N
KEEPING SCORE
BRAIN AGE SCORE
GAME EXAMPLE
Page 68D E S I G N PAT T E R N
KEEPING SCORE
TIDY STREET PROJECT
Page 69
DESIGN PATTERN
3.2 THROTTLE ACTIONS
Page 70D E S I G N PAT T E R N
THROT TLE ACTIONS
THREE STRIKES, AND YOU’RE OUT RULE
GAME EXAMPLE
Page 71D E S I G N PAT T E R N
THROT TLE ACTIONS
STRAVA – THE DANGER OF NOT SETTING LIMITS
Page 72
DESIGN PATTERN
3.3 ADVANCED USER PATHS
Page 73D E S I G N PAT T E R N
ADVANCED USER PATHS / ROLES
SKI SLOPES: DIFFERENT PATHS ON THE SAME MOUNTAIN
Page 74D E S I G N PAT T E R N
ADVANCED USER PATHS / ROLES
YELP FOR THE REGULAR USERS YELP THE ELITE SQUAD – USEFUL , FUNNY AND COOL
Page 75
DESIGN PATTERN
3.4 QUEST QUEUE
Page 76D E S I G N PAT T E R N
QUEST QUEUE
ZOMBIE FARM
GAME EXAMPLE
Page 77D E S I G N PAT T E R N
QUEST QUEUE: EXAMPLE
EPIC WIN – SELF DESIGNED QUEST QUEUELINKED IN QUEST QUEUE
Page 78
DESIGN PATTERN
3.5 SCARCITY
Page 79D E S I G N PAT T E R N
SCARCITY
VIP FISH IN ZYNGA
GAME EXAMPLE
Page 80D E S I G N PAT T E R N
SCARCITY: EXAMPLE
THE MILLION DOLLARHOMEPAGE
Page 81
IN SUMMARY
RETURN VISITORS • Keeping score
• Disincentives, throttles • Advanced user paths • Skill ladder• Quest queue
Page 82IN SUMMARY
Game mechanics >
Page 83IN SUMMARY
• Awards, prizes• Visual story telling• Visual cues• Tutorials & Coaching• Reward schedule
• Keeping score• Disincentives, throttles • Advanced user paths • Content Unlocks• Quest queue• Scarcity
• Gated trial • Social feedback• Competition, collaboration• Reputation• Sharing milestones• Mischief
COME AND TRY IT BRING FRIENDS COME BACK
A growing list of patterns…
Page 84CASE STUDIES
Thanks to the following companies forinterviews, best practices and feedback:
Page 85
Page 86CONTACT
NADYA DIREKOVA
@nadya_d
http://www.slideshare.net/nadyadirekova