Advertisement

Making Software Fun

Innovation Catalyst
Jul. 26, 2015
Advertisement

More Related Content

Advertisement

Making Software Fun

  1. Making Software Fun Sarah Allen @ultrasaurus
  2. What is Fun? Designing Fun Software Play Work
  3. amusing, entertaining, or enjoyable source: google.com
  4. late 17th century (denoting a trick or hoax): from obsolete fun ‘to cheat or hoax,’ dialect variant of late Middle English fon ‘make a fool of, be a fool,’ source: google.com
  5. – Raph Koster “Fun is just another word for learning”
  6. – Raph Koster “Fun is just another word for learning under optimal conditions.”
  7. Relaxed Alertness Low Threat Sense of Well-being Moderate to High Challenge Making Connections: Teaching and the Human Brain by Renate Nummela Caine, Geoffrey Caine
  8. Meaning Autonomy Mastery Getting Gamification Right by Sebastian Deterding
  9. Designing Software
  10. – Frank Smith “We are all capable of huge and unsuspected learning accomplishments without effort.”
  11. Relaxed Alertness Allows people to access what they already know Willingness to Delay Gratification Tolerate Ambiguity Think Creatively Making Connections: Teaching and the Human Brain by Renate Nummela Caine, Geoffrey Caine
  12. Know Your Users
  13. Know Your Users Use What They Know
  14. Teach in Multiple Ways Be Consistent, Trustworthy
  15. Animation: From Cartoons to the User Interface Bay-Wei Chang, David Ungar, 1995 “By offloading interpretation of changes to the perceptual system, animation allows the user to continue thinking about the task domain, with no need to shift contexts to the interface domain.”
  16. – Harry Marks “If you don’t have a story no amount of graphics and trickery will make it interesting.”
  17. Empower Your Users Know Them, Use What They Know Clear Conceptual Model Many Ways to Learn Consistent Narrative
  18. Work
  19. Play Work
  20. Work Play
  21. Anxiety is love’s greatest killer. It creates the failures. — Anaïs Nin
  22. Space for Learning Frameworks for Experimentation Include Real People in Your Process
  23. Bridge Foundry
  24. Test Before You Are Ready
  25. Test Before You Are Ready Make People Part of Your Process
  26. The Play Test is a Game
  27. Rules for Play Testing Shut up and Watch Take Notes Take Photos Resist providing answers. Ask questions.
  28. Questions to Ask What do you think this app is for? What did you expect to happen?
  29. Ask & Observe Did you have fun? What part of it was fun? Did you learn anything? What, if anything, would you like to do again?
  30. Empower Your Users Know Them, Use What They Know Clear Conceptual Model Many Ways to Learn with Consistent Narrative Empower Yourself Create a Fun Space for Learning Experiment Include Real People Early
  31. hello@bridgefoundry.org feedback@mightyverse.com github.com/18F/open-data-maker Sarah Allen @ultrasaurus Iterate. Celebrate. Iterate. Celebrate

Editor's Notes

  1. Good morning. My name is Sarah Allen, but I go by ultrasaurus on all the things. I’ve been doing a lot of research in the past year about how to design fun experience with software, and ended up designing a real world physical card game, which I’ll talk about later.
  2. first I’ll ground us a bit with the definition and some theories of play then focus on how we can design software that is fun to use and lastly I’ll talk about how the words work and play are normally thought to be opposites, but will share my techniques on making a fun environment at work
  3. What is fun? We know it when we see it… when we experience it
  4. a dictionary definition suggests fun is “amusing, entertaining or enjoyable”…
  5. how has cheating, being made fun of, or made of a fool of become something amusing, entertaining and enjoyable?
  6. When we are having fun, we can do silly things, that might otherwise make fools of ourselves https://upload.wikimedia.org/wikipedia/commons/9/9e/Face_paint_girls.jpg
  7. LSU Tigers team supporter with tiger hat and pose, Baton Rouge, Louisiana https://commons.wikimedia.org/wiki/File:RawR_LSU_TIgers.jpg
  8. These other tigers are participating is a different kind of hoax… they play fight. The trick is an understanding that they will keep their claws retracted and paws soft…, in this rough and tumble play they learn skills they will need to fight for real. https://www.flickr.com/photos/tambako/6453295167/
  9. Fun can be intense. Toledano’s photo portraits of gamers show intense emotions… http://www.mrtoledano.com/gamers/09
  10. when seen out of context we might think this an unpleasant experience, but this intensity… http://www.mrtoledano.com/gamers/05
  11. leads us to intense anticipation… http://www.mrtoledano.com/gamers/03
  12. I learned about these photos from Jane McGonigal’s amazing TED talk where she talks about “the EPIC Win” —- this extraordinary outcome that you didn’t believe was even possible until you achieved it, almost beyond your threshold of imagination… This moment teaches you what you’re truly capable of. Fun allows us to stretch our imagination, to imagine we have super powers…. that we can slay monsters, discover alien planets or save the world. “Gamers always believe that an epic win is possible, and that it’s always worth trying, and trying now.” “Gaming can make a better world” http://www.mrtoledano.com/gamers/04
  13. what are those optimal conditions?
  14. Stress actually inhibits learning. The optimal state of mind for learning is “relaxed alertness” …
  15. The tigers know they are playing and that makes this activity safe. There are rules and boundaries of behavior that make it fun and ideal for learning. https://www.flickr.com/photos/tambako/6831507351/
  16. In early 1900s, Lev Vygotsky studied imaginative play in children & observed that children will subordinate their own wants to the greater pleasure of following the rules. (Vygotsky, Mind in Society) https://en.wikipedia.org/wiki/File:Our_Community_Place_Sandbox.jpg
  17. Under normal conditions, there is nothing fun about being trapped in a box… but make it part of game and it changes completely. https://www.flickr.com/photos/juhansonin/8600732599
  18. “the essential attribute of play is a rule that has become a desire” – Vygotsky, Mind in Society https://en.wikipedia.org/wiki/Sport#/media/File:Youth-soccer-indiana.jpg
  19. People will do crazy, weird things, if you make it fun.. if you manage to make it a game.. https://www.flickr.com/photos/stevendepolo/6054960008/
  20. Meaning; Connect to personal goals and passions Autonomy: you must have the feedom to curiously explore opportunity Mastery: having a Goal along with constraints or rules creates interesting challenges Getting Gamification Right by Sebastian Deterding http://blog.mightyverse.com/2014/03/
  21. What does this have to do with software design? I believe the best design creates the optimal learning environment for the people who use our software.
  22. Frank Smith, a leading authority on linguistics and cognitive psychology, reports that: Learning is the brain’s primary function, its constant concern, and we become restless and frustrated if there is no learning to be done. We are all capable of huge and unsuspected learning accomplishments without effort (Insult to Intelligence: The Bureaucratic Invasion of Our Classrooms)
  23. they’ve done studies that when people are in this state, they have better access to what they already know. they can have a little patience and are willing to delay gratification and tolerate ambiguity, and think creatively. This is how you want people to feel when they are using your software…you want to enable people to experiment in pursuit of their own goal, your software is there to support them in their own desires… by using your software, they’re choosing to play by your rules..
  24. We need put all of the detailed choices into a system that is easy to understand, at least conceptually. It might take a long time to learn all the nuances and exactly how to make things happen with our software tools, but it shouldn’t take very long for people for people to understand what it’s designed to do. We empower people when we can create a clear, conceptual model… when they can anticipate how their action affects outcome. Every button, every color choice, each line and word on the screen should work together to create https://en.wikipedia.org/wiki/Epicyclic_gearing#/media/File:Reduction_Gear.jpg
  25. 1968 Doug Engelbart introduced the mouse in what is retrospectively called The Mother of all Demos
  26. The most popular, widely used sofware each has a clear, conceptual model. blank paper (wordprocessor), spreadsheet a nearly identical reproduction of its real world analog, … the World Wide Web is an amazing example of mixed and broken metaphors — you go to a web site, and click on a hyperlink that transports you somewhere else, then suddenly you are back on paper filling out forms and submitting them — it creates the feeling of you being transported elsewhere, but really there’s some software visiting your home, potentially tracking your every move — in a heartbeat, it goes from magical spaceship to creepy stalker dude.
  27. A clear conceptual model helps create a clear path to mastery… you want to aligning everything they are learning with their goal… whether it be managing their business with a spreadsheet…
  28. exploring the universe…
  29. or making videos… https://florianvo.wordpress.com/
  30. or office communication… (slack, “what’s an ATO?)
  31. I think we can learn a lot from looking at what is successful in games… In Plants vs. Zombies, it starts very simple, we learn just a few things at at time, as levels increase. The game stays at moderate-to-high challenge by increasing complexing…
  32. as you achieve higher levels… How to do this in software that isn’t a game?
  33. level 1 - just start typing a simple letter or note level up into formatting, you can advance into styles and footnotes
  34. Slack and many modern tools offer social normals, you can see examples about what other people are doing in real time. Then, just like the word processor, level 1 is just start typing
  35. github,
  36. This is a screen shot from After Effect, a software application for compositing, motion graphics and special effects for digital video. Most of you might look at think at this and think it is crazy … who would design such a thing? it seems overwhelming…
  37. This may seem hard to learn, and it is, but in some ways a lot easier than dealing with a rack of hardware. With software we can change something in one place and see the effect somewhere else. If you can bring to the surface, small indications that a person’s action has has an effect and what that effect was… it reduces cognitive load. If you can see something, you have to work less hard to remember it
  38. everyone learns differently, individuals learn differently at different times… you also might have users with learning differences and different abilities of perception. If you reinforce what’s happening in the software in different ways, it makes it easier for everyone…
  39. David Ungar created the SELF language which considered to be the predecessor of JavaScript and with it he made this fabulous IDE that had animated user interface. He did some research on how those animations helped people use his software and found…
  40. the iPhone popularized the use of animation to create a sense of visual persistence, you can hold much more information in your head if its arranged spatially and if you create consistency so people can remember where to go back for stuff https://dribbble.com/shots/1254889-iPhone-5-Sketch-Sheet
  41. your hero is the brave soul attempting to get something done using your software…
  42. their epic journey should be to overcome the limits of their creativity, not the limits of your software… well-designed software implements constraints that strengthen an underlying conceptual model. The rules can actually become liberating, since they enable the freedom to create, at its best software bestows agency and empowers people.
  43. but work can be enjoyable… I would guess that many of you have had the experience that felt like an EPIC WIN after a particularly intense debugging session … and in fact, when we make it fun, we’re more productive and creative… and it’s fun https://www.flickr.com/photos/justinbaeder/5317820857
  44. Matz talks about Ruby being optimized for programmer happiness…
  45. https://www.flickr.com/photos/peterhess/2976755407/in/gallery-mairin-72157626601919996/
  46. As it turns out, you can’t force people to play. Play needs to be voluntary…
  47. As it turns out, you can’t force people to play. Play needs to be voluntary…
  48. Mark Twain wrote about Tom Sawyer tricking his friends into paying him for the opportunity to whitewash a fence. Before I talk about my ideas on how we can all trick ourselves into turning our chore into something fun…let’s talk about what’s not fun… Adventures of Tom Sawyer. 1910 The adventures of Tom Sawyer, by Mark Twain [pseud.] illustrated by Worth Brehm. http://brbl-dl.library.yale.edu/vufind/Record/3520172?image_id=1010069
  49. Anxiety is love’s greatest killer. It creates the failures. It makes others feel as you might when a drowning man holds on to you. You want to save him, but you know he will strangle you with his panic. if there’s anything that freaks you at about work, makes you anxious or feel incompetent…
  50. see if you can figure out some rules to create a playful space that can change that dynamic Examples that I’ve come up with, maybe they’ll work for you,.. maybe they will give you your own ideas Separate learning time from Doing time (routes example) if someone tells you know, wait a few weeks and ask again using different words, see if you can come up with a way that you can pretend they never said no iterate —celebrate — iterate http://www.ultrasaurus.com/2013/09/little-rules-for-working-life/ https://en.wikipedia.org/wiki/Child_development#/media/File:Soapbubbles-SteveEF.jpg
  51. What people say != what people do are
  52. 1) Separate learning from doing manic depressive product development cycle… carve out time for learning, make rules which make it fun, debugging a thorny issue, time-out to learn about routes, — refactor using pomodoro technique
  53. a space just for learning, not just for the students —TAs, teachers and organizers…
  54. Frameworks for experimentation
  55. With paper prototype you can iterate so quickly, I don’t care how good you think you are as a software developer.. with paper and sketching, you can iterate faster… with small scale, qualitative assessments quantity that is statistically significant? How do you know if it’s fun?
  56. This kid is totally checked out. He’s regretting coming over today.
  57. This kid is also bored. He can’t believe his mom is making them read the rules aloud.
  58. Pro Tip: If you have trouble fitting your game rules on an 8 1/2 x 11 piece of paper, don’t even test them, they are too long.
  59. This is what fun looks like.
  60. Open Source Pairing
  61. I actually get really freaked out about showing anyone my software when I know there are things wrong with it.. of course, if I followed that urge, I’d never release anything
  62. One way to look at it is that the play-test itself is a game.
Advertisement