UX Principles in
Serious Game
Josh (Adi Tedjasaputra) | josh@uxindo.com
UX Indonesia | uxindo.com | @indonesia_ux
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Josh (Adi Tedjasaputra, MSc)
• General Chair of Indonesia ACM SIGCHI Chapter (CHI UX Indonesia)
• General Chair of Indonesian Interaction Design Association (PIDI)
• Member of IEEE – Internet of Things Community
• Member of IEEE Technical Committee on RFID
• Member of IEEE – Smart Cities Community
• Associate of Australian Computer Society
• Professional Member of Association for Computing Machinery and SIGCHI Member
• Fully Registered Teacher of Teacher Registration Board of Western Australia
• M.Sc in Computer Systems Engineering (Denmark)
• B.Sc (Hons) in Electrical Engineering (Indonesia)
• Dipl in Japanese Language, Economic and Culture (Japan)
• Cert IV in Training and Assessment, Workforce Development and Training (Australia)
Director and Co-Founder, UX Indonesia
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Seeing Theory: Is it a Serious Game?
• Goal: Make statistics more accessible through
interactive visualizations
• Each topic area consists of a series of three interactive
graphs
• The interactive graphs illustrate concepts while letting
users play around with data
• It is expected to become a teaching tool
• It is not expected to be a quick guide to be
consumed within an hour
Sources: http://students.brown.edu/seeing-theory/ | https://www.fastcodesign.com/3068795/a-visual-guide-to-statistics
http://students.brown.edu/seeing-theory
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Serious Game: More than entertainment
• “Games may be played seriously or casually. We are concerned
with ‘Serious Games’ in the sense that these games have an
explicit and carefully thought-out educational purpose and are
not intended to be played primarily for amusement. This does not
mean that serious game are not, or should not be, entertaining.”
(Abt, 2009)
• “Any form of interactive computer-based game software for one
or multiple players to be used on any platform and that has been
developed with the intention to be more than entertainment.”
(Ritterfeld et al., 2009, p.6)
Sources: Abt, C. C. (1987). Serious games. University press of America.
Ritterfeld, U., Cody, M., & Vorderer, P. (Eds.). (2009). Serious games: Mechanisms and effects. Routledge
Wilkinson, P. (2016). A brief history of serious games. In Entertainment computing and serious games (pp. 17-41). Springer International
Publishing.
Serious games: Mechanisms and effects
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Serious Game: Purpose-driven
• Educational Serious Games (Garris et al., 2002)
• Intellectual disabilities therapy (Martins et al., 2011)
• Military’s recruitment game (Martin et al., 2010)
• …
Sources:
Wilkinson, P. (2016). A brief history of serious games. In Entertainment computing and serious games (pp. 17-41).
Springer International Publishing.
Martins, T., Carvalho, V., Soares, F., & Moreira, M. F. (2011, November). Serious game as a tool to intellectual
disabilities therapy: Total challenge. In Serious Games and Applications for Health (SeGAH), 2011 IEEE 1st
International Conference on (pp. 1-7). IEEE.
Garris, R., Ahlers, R., & Driskell, J. E. (2002). Games, motivation, and learning: A research and practice model.
Simulation & gaming, 33(4), 441-467.
Martin, G., & Steuter, E. (2010). Pop culture goes to war: Enlisting and resisting militarism in the war on terror.
Lexington Books.
Learning | Therapy | Social Control
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Serious Game: PlayMancer
• Train emotional regulation in impulse-related disorders
• Improve emotional regulation and impulsiveness
• Complementary treatment in Eating Disorders and Impulse
Control Disorders (Pathological Gambling)
• Learning, Therapy, or Social control?
Source:
https://youtu.be/osmo9EAClv8
Fernández-Aranda, F., Jiménez-Murcia, S., Santamaría, J. J., Gunnard, K., Soto, A., Kalapanidas, E., ... & Konstantas, D. (2012).
Video games as a complementary therapy tool in mental disorders: PlayMancer, a European multicentre study. Journal of Mental
Health, 21(4), 364-374.
https://youtu.be/osmo9EAClv8
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Serious Game: Dragon Box Elements
• Learn Geometry
• Introduction to Euclid’s Elements
• Definitions
• Propositions
• Axioms
• Theorems
• Puzzles
• Learning, Therapy, or Social control?
Source:
https://youtu.be/rm-6pDiSH44
https://dragonbox.com/products/elements
https://youtu.be/rm-6pDiSH44
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Serious Game: Pacific
• Survival adventure to escape with a team from a desert island
• Manage and motivate team
• Leadership
• Team Management
• Learn and apply strategies, techniques, and tools
• Learning, Therapy, or Social control?
Source:
https://youtu.be/YopbkCYSIEU
https://www.game-learn.com/game-based-learning-corporate-training/serious-game-in-leadership-and-team-management/
https://youtu.be/YopbkCYSIEU
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Other Serious Game Examples
• Pulse!!: Learn triaging patients
• Duolingo: Learn language
• Our City: Learn to be a good citizen
• ...
Sources:
https://youtu.be/NxwUMs4VCag
https://youtu.be/8OebgtUjLg4
https://youtu.be/nokqlgKkeMU
Pulse!! | Duolingo | Our City
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Why UX in Serious Game?
• We are human after all!
• A successful Serious Game provides meaningful and relevant experience
to its gamers
• Global audience and Localization
• Differentiation from other Serious Games
Sources:
https://www.usability.gov/what-and-why/user-experience.html
https://www.interaction-design.org/literature/topics/ux-design
https://www.nngroup.com/articles/definition-user-experience/
Behavior | Needs | Values | Abilities | Limitations |
Motivations | Pains | Gains | Aspirations
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Purpose-driven ⇄ Goal-directed Design
1. Design first; program second.
2. Separate responsibility for design from responsibility for programming.
3. Hold designers responsible for Serious Game product quality and
gamer satisfaction.
4. Define one specific user for your product; then invent a persona -
give that user a name and an environment and derive his or her
goals.
5. Work in teams of two: designer and design communicator.
Sources:
http://www.dubberly.com/articles/alan-cooper-and-the-goal-directed-design-process.html
Cooper, A. (1996). Goal-directed design. InContext Enterprises Incorporated.
Align Purpose-driven and Goal-directed Design
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Player (Design) Persona
1. Game Purpose
2. Name
3. Photo
4. Goal: End and steady condition, for example: Healthy Teeth
5. Task: Transient intermediate process to achieve the goal, for
example: Brush teeth in the morning and before sleep every day
6. Gender
7. Age
8. Relationship (Single, Married, Married with Children)
9. Description: Behavior | Needs | Values | Abilities | Limitations |
Motivations | Pains | Gains | Aspirations
Research-based | Proto
Image Source: https://public-media.interaction-design.org/images/ux-
daily/587f99181f266.jpg
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Citra: UI Designer
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Contextual Scenario
A	description	of	
persona	interacting	
with	a	brand	(your	
serious	game)	to	
achieve	a	goal	in	a	
specific	environmental	
situation.
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Customer Journey Map
A	visualization	of	
contextual	
scenarios	in	
channels	and	
touch	points.
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Prototyping
A	working	model	of	
product	(your	serious	
game)	with	a	purpose	of	
getting	feedback	and	
experiment	with	ideas
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Evaluating and Validating
● Individual Player Experience:
a. Pyschophysiological player testing (Russell, 1980)
b. Game Metrics Behavior Assessment (Tychsen and
Canossa, 2008)
c. Eye Tracking (Stellmach et al., 2010) ...
● Player Context Experience:
a. Playability Heuristics (Desurvire et al., 2004; Korhonen
and Koivisto, 2006)
b. Usability Testing (Moreno-Ger, 2012) ...
Sources:
Nacke, L. E., Drachen, A., & Göbel, S. (2010). Methods for evaluating gameplay experience in a serious gaming context. International
Journal of Computer Science in Sport, 9(2), 1-12.
Moreno-Ger, P., Torrente, J., Hsieh, Y. G., & Lester, W. T. (2012). Usability testing for serious games: Making informed design decisions with
user data. Advances in Human-Computer Interaction, 2012, 4.
(Individual Player + Player Context) Experience
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
UX Principle 1: Engage your gamer early
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
UX Principle 2: Design with scaffolding
● Provide an opportunity to acquire identity.
● Provide prompts and supplementary information when facing
difficulty, ex. Hints.
● Provide formative feedback, ex. Explain missteps when wrong.
● Provide summative feedback, ex. Performance summary.
● Provide debriefing (human or human-like feedback).
● Provide a challenge when correct.
Sources:
Vygotsky, L. (1987). Zone of proximal development. Mind in society: The development of higher psychological processes, 5291, 157.
Obikwelu, C., Read, J., & Sim, G. (2012). The scaffolding mechanism in serious games. Fun and Game, 9, 4-6.
Fisch, S. M. (2005, June). Making educational computer games educational. In Proceedings of the 2005 conference on Interaction design
and children (pp. 56-61). ACM.
Zone of Proximal Development
Image source: http://bit.ly/2k10OF8
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
UX Principle 3: Use Personas
1. Conduct UX Research.
2. Build User Profiles.
3. Create Personas.
4. Elicit behavior, needs, values, abilities, limitations, motivations, pains,
gains, aspirations from Personas.
5. Use the elicitation process results to develop the traits of Game
Characters.
Derive characters from Personas
Image source: http://bit.ly/2k10OF8
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
UX Principle 4: Use Contextual Scenarios
1. Conduct UX Research.
2. Build Contextual Scenarios.
3. Elicit specific behavior, needs, values, abilities, limitations, motivations,
pains, gains, aspirations in different environmental situations.
4. Use different environmental situations as insights when developing
different game scenes
5. Apply the specific behavior, needs, values, abilities, limitations,
motivations, pains, gains, aspirations di different game scenes.
Design stories and storylines based on
Contextual Scenarios
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Cognitive Disequilibrium
Source:
https://youtu.be/Xj0CUeyucJw
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
UX Principle 5: Cognitive Disequilibrium
1. Conduct UX Research.
2. Derive Gamer Mental Model or Schema
3. Stimulate Assimilation, i.e. Fitting new information into existing
mental model
4. Stimulate Accommodation, i.e. Modifying existing mental model
to accommodate new information
5. Assimilation + Accommodation = Cognitive Disequilibrium
6. Create a continuous cycle of Cognitive Disequilibrium
Sources:
Piaget, J. (1970). Piaget's theory.
Van Eck, R. (2006). Digital game-based learning: It's not just the digital natives who are restless. EDUCAUSE review, 41(2), 16.
Create a continuous cycle of Cognitive
Disequilibrium
Copyright © 2018. PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical,
photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA.
Kontak
Dr	Eunice	Sari
eunice	@uxindo.com
Adi	Tedjasaputra
josh@uxindo.com	
UX	Indonesia	|	uxindo.com	|	@indonesia_ux	|	#uxindo

UX Principles in Serious Game

  • 1.
    UX Principles in SeriousGame Josh (Adi Tedjasaputra) | josh@uxindo.com UX Indonesia | uxindo.com | @indonesia_ux
  • 2.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Josh (Adi Tedjasaputra, MSc) • General Chair of Indonesia ACM SIGCHI Chapter (CHI UX Indonesia) • General Chair of Indonesian Interaction Design Association (PIDI) • Member of IEEE – Internet of Things Community • Member of IEEE Technical Committee on RFID • Member of IEEE – Smart Cities Community • Associate of Australian Computer Society • Professional Member of Association for Computing Machinery and SIGCHI Member • Fully Registered Teacher of Teacher Registration Board of Western Australia • M.Sc in Computer Systems Engineering (Denmark) • B.Sc (Hons) in Electrical Engineering (Indonesia) • Dipl in Japanese Language, Economic and Culture (Japan) • Cert IV in Training and Assessment, Workforce Development and Training (Australia) Director and Co-Founder, UX Indonesia
  • 3.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Seeing Theory: Is it a Serious Game? • Goal: Make statistics more accessible through interactive visualizations • Each topic area consists of a series of three interactive graphs • The interactive graphs illustrate concepts while letting users play around with data • It is expected to become a teaching tool • It is not expected to be a quick guide to be consumed within an hour Sources: http://students.brown.edu/seeing-theory/ | https://www.fastcodesign.com/3068795/a-visual-guide-to-statistics http://students.brown.edu/seeing-theory
  • 4.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Serious Game: More than entertainment • “Games may be played seriously or casually. We are concerned with ‘Serious Games’ in the sense that these games have an explicit and carefully thought-out educational purpose and are not intended to be played primarily for amusement. This does not mean that serious game are not, or should not be, entertaining.” (Abt, 2009) • “Any form of interactive computer-based game software for one or multiple players to be used on any platform and that has been developed with the intention to be more than entertainment.” (Ritterfeld et al., 2009, p.6) Sources: Abt, C. C. (1987). Serious games. University press of America. Ritterfeld, U., Cody, M., & Vorderer, P. (Eds.). (2009). Serious games: Mechanisms and effects. Routledge Wilkinson, P. (2016). A brief history of serious games. In Entertainment computing and serious games (pp. 17-41). Springer International Publishing. Serious games: Mechanisms and effects
  • 5.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Serious Game: Purpose-driven • Educational Serious Games (Garris et al., 2002) • Intellectual disabilities therapy (Martins et al., 2011) • Military’s recruitment game (Martin et al., 2010) • … Sources: Wilkinson, P. (2016). A brief history of serious games. In Entertainment computing and serious games (pp. 17-41). Springer International Publishing. Martins, T., Carvalho, V., Soares, F., & Moreira, M. F. (2011, November). Serious game as a tool to intellectual disabilities therapy: Total challenge. In Serious Games and Applications for Health (SeGAH), 2011 IEEE 1st International Conference on (pp. 1-7). IEEE. Garris, R., Ahlers, R., & Driskell, J. E. (2002). Games, motivation, and learning: A research and practice model. Simulation & gaming, 33(4), 441-467. Martin, G., & Steuter, E. (2010). Pop culture goes to war: Enlisting and resisting militarism in the war on terror. Lexington Books. Learning | Therapy | Social Control
  • 6.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Serious Game: PlayMancer • Train emotional regulation in impulse-related disorders • Improve emotional regulation and impulsiveness • Complementary treatment in Eating Disorders and Impulse Control Disorders (Pathological Gambling) • Learning, Therapy, or Social control? Source: https://youtu.be/osmo9EAClv8 Fernández-Aranda, F., Jiménez-Murcia, S., Santamaría, J. J., Gunnard, K., Soto, A., Kalapanidas, E., ... & Konstantas, D. (2012). Video games as a complementary therapy tool in mental disorders: PlayMancer, a European multicentre study. Journal of Mental Health, 21(4), 364-374. https://youtu.be/osmo9EAClv8
  • 7.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Serious Game: Dragon Box Elements • Learn Geometry • Introduction to Euclid’s Elements • Definitions • Propositions • Axioms • Theorems • Puzzles • Learning, Therapy, or Social control? Source: https://youtu.be/rm-6pDiSH44 https://dragonbox.com/products/elements https://youtu.be/rm-6pDiSH44
  • 8.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Serious Game: Pacific • Survival adventure to escape with a team from a desert island • Manage and motivate team • Leadership • Team Management • Learn and apply strategies, techniques, and tools • Learning, Therapy, or Social control? Source: https://youtu.be/YopbkCYSIEU https://www.game-learn.com/game-based-learning-corporate-training/serious-game-in-leadership-and-team-management/ https://youtu.be/YopbkCYSIEU
  • 9.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Other Serious Game Examples • Pulse!!: Learn triaging patients • Duolingo: Learn language • Our City: Learn to be a good citizen • ... Sources: https://youtu.be/NxwUMs4VCag https://youtu.be/8OebgtUjLg4 https://youtu.be/nokqlgKkeMU Pulse!! | Duolingo | Our City
  • 10.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Why UX in Serious Game? • We are human after all! • A successful Serious Game provides meaningful and relevant experience to its gamers • Global audience and Localization • Differentiation from other Serious Games Sources: https://www.usability.gov/what-and-why/user-experience.html https://www.interaction-design.org/literature/topics/ux-design https://www.nngroup.com/articles/definition-user-experience/ Behavior | Needs | Values | Abilities | Limitations | Motivations | Pains | Gains | Aspirations
  • 11.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Purpose-driven ⇄ Goal-directed Design 1. Design first; program second. 2. Separate responsibility for design from responsibility for programming. 3. Hold designers responsible for Serious Game product quality and gamer satisfaction. 4. Define one specific user for your product; then invent a persona - give that user a name and an environment and derive his or her goals. 5. Work in teams of two: designer and design communicator. Sources: http://www.dubberly.com/articles/alan-cooper-and-the-goal-directed-design-process.html Cooper, A. (1996). Goal-directed design. InContext Enterprises Incorporated. Align Purpose-driven and Goal-directed Design
  • 12.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Player (Design) Persona 1. Game Purpose 2. Name 3. Photo 4. Goal: End and steady condition, for example: Healthy Teeth 5. Task: Transient intermediate process to achieve the goal, for example: Brush teeth in the morning and before sleep every day 6. Gender 7. Age 8. Relationship (Single, Married, Married with Children) 9. Description: Behavior | Needs | Values | Abilities | Limitations | Motivations | Pains | Gains | Aspirations Research-based | Proto Image Source: https://public-media.interaction-design.org/images/ux- daily/587f99181f266.jpg
  • 13.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Citra: UI Designer
  • 14.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Contextual Scenario A description of persona interacting with a brand (your serious game) to achieve a goal in a specific environmental situation.
  • 15.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Customer Journey Map A visualization of contextual scenarios in channels and touch points.
  • 16.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Prototyping A working model of product (your serious game) with a purpose of getting feedback and experiment with ideas
  • 17.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Evaluating and Validating ● Individual Player Experience: a. Pyschophysiological player testing (Russell, 1980) b. Game Metrics Behavior Assessment (Tychsen and Canossa, 2008) c. Eye Tracking (Stellmach et al., 2010) ... ● Player Context Experience: a. Playability Heuristics (Desurvire et al., 2004; Korhonen and Koivisto, 2006) b. Usability Testing (Moreno-Ger, 2012) ... Sources: Nacke, L. E., Drachen, A., & Göbel, S. (2010). Methods for evaluating gameplay experience in a serious gaming context. International Journal of Computer Science in Sport, 9(2), 1-12. Moreno-Ger, P., Torrente, J., Hsieh, Y. G., & Lester, W. T. (2012). Usability testing for serious games: Making informed design decisions with user data. Advances in Human-Computer Interaction, 2012, 4. (Individual Player + Player Context) Experience
  • 18.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. UX Principle 1: Engage your gamer early
  • 19.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. UX Principle 2: Design with scaffolding ● Provide an opportunity to acquire identity. ● Provide prompts and supplementary information when facing difficulty, ex. Hints. ● Provide formative feedback, ex. Explain missteps when wrong. ● Provide summative feedback, ex. Performance summary. ● Provide debriefing (human or human-like feedback). ● Provide a challenge when correct. Sources: Vygotsky, L. (1987). Zone of proximal development. Mind in society: The development of higher psychological processes, 5291, 157. Obikwelu, C., Read, J., & Sim, G. (2012). The scaffolding mechanism in serious games. Fun and Game, 9, 4-6. Fisch, S. M. (2005, June). Making educational computer games educational. In Proceedings of the 2005 conference on Interaction design and children (pp. 56-61). ACM. Zone of Proximal Development Image source: http://bit.ly/2k10OF8
  • 20.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. UX Principle 3: Use Personas 1. Conduct UX Research. 2. Build User Profiles. 3. Create Personas. 4. Elicit behavior, needs, values, abilities, limitations, motivations, pains, gains, aspirations from Personas. 5. Use the elicitation process results to develop the traits of Game Characters. Derive characters from Personas Image source: http://bit.ly/2k10OF8
  • 21.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. UX Principle 4: Use Contextual Scenarios 1. Conduct UX Research. 2. Build Contextual Scenarios. 3. Elicit specific behavior, needs, values, abilities, limitations, motivations, pains, gains, aspirations in different environmental situations. 4. Use different environmental situations as insights when developing different game scenes 5. Apply the specific behavior, needs, values, abilities, limitations, motivations, pains, gains, aspirations di different game scenes. Design stories and storylines based on Contextual Scenarios
  • 22.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Cognitive Disequilibrium Source: https://youtu.be/Xj0CUeyucJw
  • 23.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. UX Principle 5: Cognitive Disequilibrium 1. Conduct UX Research. 2. Derive Gamer Mental Model or Schema 3. Stimulate Assimilation, i.e. Fitting new information into existing mental model 4. Stimulate Accommodation, i.e. Modifying existing mental model to accommodate new information 5. Assimilation + Accommodation = Cognitive Disequilibrium 6. Create a continuous cycle of Cognitive Disequilibrium Sources: Piaget, J. (1970). Piaget's theory. Van Eck, R. (2006). Digital game-based learning: It's not just the digital natives who are restless. EDUCAUSE review, 41(2), 16. Create a continuous cycle of Cognitive Disequilibrium
  • 24.
    Copyright © 2018.PT UXINDO DIGITAL INDONESIA. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, photocopying, recording or otherwise, without the prior written permission from PT UXINDO DIGITAL INDONESIA. Kontak Dr Eunice Sari eunice @uxindo.com Adi Tedjasaputra josh@uxindo.com UX Indonesia | uxindo.com | @indonesia_ux | #uxindo