The idea of gamification has gained a lot of traction in the last few years and is increasingly being used in various aspects of modern life to aid commitment and learning, through enjoyment and engagement. Today we will be speaking about the topic of gamification, and in particular how it can be applied to professional development in our field. We have all experienced the power of 'learning by doing' and gamifying an approach doubles down on this idea. One of the principal powers of gamified learning also relates to memory, and how we remember better when we are experiencing enjoyment. It is possible that as developers, we also have an increased tendency to enjoy tracking progress, and the way that games allow you to gauge your level and the points you accrue, will surely appeal to a lot of our audience too! So for a quick look at a great way to get your stats up, and a few direct routes to lessons that can potentially be applied to your job immediately, be sure to listen in with us on the show!
Key Points From This Episode:
{{addCallout()}}
Transcript for Episode 238. Gamification
[EPISODE]
[00:00:01] MN: Hello, and welcome to The Rabbit Hole, the definitive developers podcast, living large in New York. I’m rabbit number one, Michael Nunez. We have rabbit number two –
[00:00:10] DA: Dave Anderson.
[00:00:12] MN: And rabbit number three.
[00:00:14] SC: Sophie Creutz.
[00:00:15] MN: And today, we’ll be talking about gamification within programming.
[00:00:20] DA: Like gamifying your professional development in particular?
[00:00:24] SC: Yeah.
[00:00:25] MN: Yeah. Yeah.
[00:00:26] DA: Why slave away with a book about CSS, just reading all the properties when you can –
[00:00:34] MN: When you could play a game.
[00:00:36] DA: You could play a game, yeah. Learn by doing.
[00:00:38] SC: Learn by doing and without even realizing that you’re doing because you’re having so much fun, right?
[00:00:44] DA: It’s a trap.
[00:00:47] MN: Imagine that there’s that element of having to know something, but doing it through a game, which makes it more entertaining. And then it’s like, two-fold. A, like you’re enjoying yourself so you remember this moment, and then you remember the thing that you were doing to continue on in this game.
[00:01:08] DA: Right. What might be the benefits of studying something through gamification rather than just reading the docs?
[00:01:17] MN: For me, I mean, there’s a way to track your progress that’s like, you’re able to see it if you go to your user profile. Like looking at points, like, “Yow! I got 200 points, because I went through the first stage of this particular game, if you will” or like, “I’m in the second level.” Knowing that you have progressed, for me is like, definitely – you progress through a book, but it’s just like, it’s another CSS book.
[00:01:46] DA: You know, I feel like that’s probably why like I – when I get through a book, I feel like in my brain, I have gamified it. I’m like looking for that feedback loop of like, “Okay. I’m reading 10 pages in, five minutes or something like that. I’m going to like get my pages –
[00:02:06] SC: You get it prior.
[00:02:07] DA: Yeah, like my e-reader tells me my stats. I’m like, I got to get hose stats up.
[00:02:13] SC: Oh, cool. Yeah. So you find that motivating. I don’t always find that motivating. But, yeah, I think the thing about gamification is you have some kind of inherent risk reward cycle. For instance, in the game, CSS Grid Garden, and we’ll get more into like the different examples of games. But in that game, when you write in a property correctly, it will like water your garden, and you get this little animation of your plants growing just a little bit.
[00:02:43] DA: Ooh! Very cool.
[00:02:44] SC: For me, that just does it. Yeah.
[00:02:48] DA: Yeah. I feel like this strategy of like creating these feedback loops, like risk and reward cycles has been really popular across a lot of different areas, not just for learning, but for other purposes too, like for exercise with like Fitbit, or trying different beers with untapped or even like gamifying contributions. Like Google is always telling me like, “Hey! If you just completed for more reviews, I would give you a star.”
[00:03:22] MN: Yes. Oh man! I am level 6 in the Google reviews. I love the reviews. It’s only because you get those points at the end. And it’s like, “Oh! You wrote a long review, plus 40.” I’m like, “Yes! I got 40 points, bro.”
[00:03:35] DA: Yeah. For me, I’ve chosen to not accept this. It’s like, “If you just wrote this review, you’d level up.” And I’m like, “No.”
[00:03:45] SC: It’s like demotivating.
[00:03:46] DA: Right.
[00:03:48] MN: There’s a phrase, what is it? What gets tracked, gets managed.
[00:03:52] DA: Oh, yeah. Or what gets measured, gets –
[00:03:57] MN: Yeah. What gets measured, gets managed or whatever. When you’re looking at data, and I think in terms of these points are these systems and you’re able to call back to them. Then you’re more likely going to expand on that particular behavior. I think what you mentioned Dave, right, the idea of your e-reader giving you the stats is motivating you to continue reading, which is something that I’m not going to get when I pick up a physical book. Like the book is – the only tracker of me and my successor reading this book is how far I’ve gotten. But like, you do that all the time. You’ve been doing this since you were four or two, whatever, you just read books. But the e-reader will tell you, “Oh! You spent x page here,” and that’s like really interesting, like the e-reader motivates you to do the reading because they could try –
[00:04:51] DA: They have the BOOK IT program, so I did. I was motivated by pizza as well. My speed of reading books. I think another like gamified kind of platform that isn’t learning based that is used admittedly every day by many programmers, Stack Exchange and Stack Overflow. The process of like gaining points of voting, contributing answers, gaming reputation, like those are all kind of like little gamified systems. I hadn’t looked at the stock exchange homepage in a long time, but there’s so many different communities that are built. And even the process of making the communities, like deciding which communities are going to get set up is also gamified and like has a system behind it. It’s kind of neat.
[00:05:43] MN: Yeah, I think I always forget that there are other Stack Overflows outside of, how do I do this in JavaScript? This is like a home renovation Stack Exchange and like a movie Stack Exchange.
[00:05:59] DA: Yeah. You could probably ask them when to salt your sidewalk and get a very competent answer from someone who’s hungry for those points.
[00:06:07] MN: Oh, yeah. You know what, I’m going to have to make my way over there for whenever it’s going to snow here in Larchmont, so I have to figure that out. But yeah, I think I’ll have to see who’s hungry for the point, so I can ask that question.
[00:06:22] SC: Yeah. That’s an especially good point, though, Dave. Because it’s like, because you have this element of gamification in this case, like competition with others and also point scoring, you have a situation where knowledge that might not otherwise be shared, people are motivated to share it with other people.
[00:06:46] DA: Yeah, without those points, I would never tell Mike when to shovel the side walk. Never.
[00:06:51] MN: I need help. If you’re hearing this, I’m buried under the sand and snow. I don’t know. Help me.
[00:07:01] DA: Yeah. Sorry. It will melt.
[00:07:02] SC: I’ll give you a point.
[00:07:04] MN: Yeah, I’ll vote you.
[00:07:07] DA: So yeah. Why don’t we talk about like some games that we can play to like up our learning, our professional development. Get those points in learning so we can get those points in our bank accounts, I guess.
[00:07:22] MN: Yeah. I mean, hey, that’s a good way to put it. I think first and foremost that we had discussed is coding exercises. You have websites that will ask you a programming question. If you know how to answer them, then they reward you with points and levels. I think, definitely leak code is pretty popular in that regard of like, “Here are a list of questions. How can you solve them? You get points for leveling them.” I don’t know if it’s Elite Code or if it’s a different website, but they give you your ranking based on like your karate title, and you can be like the fifth kill, and the sixth kill, which like is the tear in which you are and, and your belt, right? You can have a white belt in starting, and then ultimately end up as a black belt programmer. Like the idea that they have that kind of conversion for you makes that a little bit more fun. I am a blackbelt JavaScript developer, like what does that even mean? I don’t know the famous website. You’re a head honcho. You’re the head honcho for sure.
[00:08:28] DA: I really like Advent of Code too, like they do this every December. I have 25 days of coding exercises, which is like a little present for you. And they’re all kind of like – they all have a lot of character, and are fun and winter themes. They get pretty challenging as the month goes on.
[00:08:48] SC: I mean, who doesn’t love Lead Code, right? I mean. I guess like I was more intrigued to find some tools that are more, what you might think of as like typical games. For example, if you’ve ever played Vim Adventures. It’s sort of like an emulation of an action RPG that teaches you how to use Vim keyboard for code. It’s pretty fun. It’s even got like the little video game type soundtrack going on with the sound effects.
[00:09:24] DA: Yeah, that one’s like behind a paid thing. You have to subscribe to it, right? I never did it, but I played the intro adventure. I did have a lot of fun. I thought it was pretty cool.
[00:09:36] SC: Well, and sort of a metric that I’m using here is like, “Did I stick with it, with the game? Did it teach me something?” The answer to both those questions for that game is, Yes, absolutely.”
[00:09:46] DA: Cool. So you’ve started using more Vim keybindings?
[00:09:49] SC: I have, yeah.
[00:09:50] DA: I’m too cheap to pay for Vim Adventures, but there are like plugins for different editors like VS Code and IntelliJ that will – it’s not quite as much of a game. You’re not going to have fun, I guess.
[00:10:04] SC: No fun will we have.
[00:10:05] DA: No fun will we have, but it will remind you when you could have used the shortcut and it will bang you on the head and be like, “You could have used the shortcut 57 times, and this is 57 different times you clicked the menu that you’ll never get back in your life.”
[00:10:22] SC: Oh no.
[00:10:23] MN: It’s like scalding you. It’s like the opposite of gamification and you’re like, “Oh no, I need to go and address that, use that shortcut.
[00:10:34] DA: I guess like gamification adheres to like the positive reinforcement feedback loop, and those plugins are definitely kind of like a ruler slapping your hands. Ugh, negative feedback.
[00:10:46] SC: The shame spiral.
[00:10:51] MN: The shame spiral for Vim. Oh my gosh! I don’t think I’ve played Vim Adventures fully. I think that there’s always a time. Every year, I make a new year’s resolution that I’m going to be a real developer and learn Vim, and then I forget that Vim Adventure exist and I don’t do the New Year’s resolution, but then I realized it exists. Maybe, my new year’s resolution should be to buy the game and then complete it. And maybe through that, I will learn Vim the same way you have, Sophie.
[00:11:24] SC: Yeah, maybe so. Well, in some of these games, you can get into like a private server and then compete with people. Sometimes it’s even more motivating for folks to have not just like the game itself, but to have like a human that you’re competing with.
[00:11:38] DA: Yeah, I absolutely love Type Racer for typing practice. Like they always have like, nice little varied text snippets from books and music that you write out. But then, the added aspect of competing with your colleague or like some random people.
[00:11:59] SC: We all play this game. Yeah, I’m going to say who won, but uh –
[00:12:08] MN: And it wasn’t me either. I’m really bad at – Type Racer makes me realize how slow I type at 60 words per minute. Because there are people who, I don’t know if they’re like copying, and pasting and cheating or whatever, but they’ll be like 150. And I’m like, how? How are you getting that many words per minute into the interface? But Sophie crushed us with like 85 words per minute. Very easy. Own that. Own that, Sophie. Own that stats.
[00:12:42] DA: But like, yeah, like typing is one of those like kind of underrated programming skills too. Because there are a number of things that can go wrong while you’re programming. To have typing be one of those things is just a distraction. It’s literally a mechanical thing. It’s a muscle memory thing. Like building up the muscle memory for it frees you to just crush other things. This is why Sophie will be coding circles around Mike and I.
[00:13:19] MN: Easy, yeah. Five minutes and that’s a whole person, whole one of us essentially.
[00:13:25] SC: Look, if all I had to do for my job was quickly type thing that I was given to –
[00:13:32] DA: Yeah, I guess that’s true. Like in the end, like the bottleneck is not the typing. It’s like the thought and the collaboration and yada, yada, yada.
[00:13:42] SC: It is. It’s fun.
[00:13:43] DA: There’s a diminishing return, like I guess. It’s good to have like a level of muscle memory and comfort. It feels good to get into flow with that.
[00:13:54] SC: For sure. Yeah, it’s good flow.
[00:13:56] DA: What are some other games that you all like to play?
[00:13:59] MN: I think the ones that I run into, here’s an example. This never fails me. Anytime someone has a CSS issue. Like, “Oh! I don’t understand CSS.” I mean, Dave, you may remember times where I would complain about how I don’t know CSS. Fun fact, I still don’t. But what I do is, anytime that I feel not too confident about CSS, or Flexbox in particular, I would go and play Flexbox Froggy. It is the best game to play. Shout out to Kirsten who introduced me to Flexbox Froggy. But every time I think about CSS, it’s like, “Oh! I got to do a couple of level of –”
[00:14:41] SC: Think about that frog.
[00:14:41] MN: Yeah. I got to do a couple levels of Flexbox Froggy just so that I can remember, “Oh! Justified content, and align items, blah, blah, blah.” It’s like so good for me to remember that kind of thing. It’s pretty dope. Flexbox Froggy, tell your friends. It’s pretty dope.
[00:14:58] SC: Yeah, get that get that frog on that lily pad.
[00:15:00] DA: Right. He just wants to get home. I was surprised to how many of these kinds of layout style CSS games there are and they’re all pretty cool. They all seem like they’d be fun, and educational and enjoyable to play.
[00:15:16] SC: Yeah. Flexbox Froggy, and then there’s Flexbox Defense, Flexbox Adventure. And of course, CSS Grid Garden, as I mentioned earlier.
[00:15:24] DA: Right. Watering the garden, getting all your flowers where they need to be.
[00:15:30] MN: Yeah. No, and not only that, but like it was also – I played a couple of levels, and it’s like, you water the flower and a little carrot comes out from the ground, which is like, “Oh! I’m growing digital carrots, people. This is great.” But then there’s also one where it’s like, oh, you got to get rid of the weeds or like the thorns.
[00:15:45] SC: Oh, the poison. You poison the weeds.
[00:15:46] MN: I was like, “Oh yeah! You’re making your garden bed.” Yeah, you got to poison the thorns, because they’re attacking your garden, bro. Like, “Yow! Back off thorns. My carrot. Get out of here.”
[00:15:57] DA: I didn’t try that one, but I did try the Flexbox Defense. It’s just like so clever, though. You use Flexbox for laying out where your towers are for tower defense. Like I’ve never like dug too deep into the genre, but it’s kind of a classic mobile game kind of thing. And yeah, it translates surprisingly well.
[00:16:18] MN: Yeah. And to be able to do that with CSS, it was like, “Oh! This is actually pretty cool to think of where you would line up your units and stuff like that.” I thought that was pretty – it was a good combination, as you mentioned, Dave of the two genres and the two types of things that could go. And then you actually learn, it’s like, “Oh man! I got to level thing, level 10, where I got a chance to line up all these different units using CSS for each one.” I imagine that like sticks to you at the end of the day, because you understand how to align your items. Aligning items and justify content. That’s the ones that come into mind.
[00:16:53] SC: Yeah. These games paid pretty much immediate dividends for me. Like I was able to use some CSS stuff that I had practiced in these games in my job like pretty much right away. It works, people. It works.
[00:17:10] DA: Crashing at typing, laying out elements. The one that I haven’t really dug into, it seems more like kind of refined programming game for a more civilized type. They have a lot of like, Regex-based games. Like Regex golf was the first one that I heard of, where you have to write your Regex in such a way that it matches all of these 10 things, but none of these 10 things with as little characters as possible. Like a golf game, you’re trying to minimize the characters and get the accuracy. Over here, but not over here. It’s very humbling, like – like I say, I haven’t reached for it that much, because like I’m not often writing Regex. When I need a Regex, it is like a pretty standard kind of Regex that you can look up. It’s like, “Okay. What is a great way to write a regex for matching an email?” Which you can do yourself, but there are edge cases and things like that, that you might not want to be responsible for.
[00:18:21] SC: But yeah. That’s cool. You got to go into this knowing Regex though, like that’s the thing. It’s like, it’s funny. Learning Regex, to me, it kind of feels like if you know Regex, it’s like knowing Esperanto or something. You know what I mean?
[00:18:36] DA: I think it’s pretty braggable, though. If you just like bang out of Regex, then there’s going to be a level of respect. Also actually, the Regex Golf could come in handy if you keep digging into Vim Adventures and you’re doing your global search and replace or things like that. Then that would be super useful.
[00:18:58] SC: Next time we show up here on the podcast, we’re just going to talk to each other completely in Regex.
[00:19:04] DA: Yes. We will match this concept but not match the other concept. Completely. Just draw the line.
[00:19:13] MN: I found the, I guess it’s more like a tutorial more than a game, but regexone.com was really good at introducing the various regular expression concepts, so that you slowly build up your regular expressions skills with these little assignments that you get. I was able to get pretty far on Regex One, and then I tried like a couple levels of Regex Golf. It was just like, “Oh man! People are doing this in two tries, and I’m like, it took me six, I guess. What is that?”
[00:19:48] DA: Oh1 But you did it, though. That’s great.
[00:19:50] MN: Yeah, there’s like – what is it like? I don’t know my golf terms, but there’s like a par and a birdie. I’m getting birdies all over the place. That sounds like a good things. I know it’s not.
[00:20:00] DA: You want the birdies, the bogeys are what you don’t want.
[00:20:04] MN: Oh yeah, the bogeys. I don’t know much about regular expressions nor golf, but that is a game that I thought was really cool because they’ve all these different things that you want to match or don’t match and I thought it was pretty challenging. Then the last one, part of the reason why I picked up Regex One and started doing it is because of, there’s a regular expression crossword, where like you’re supposed to look at two different types of regular expression, and then come up with the unit, the similarities of both at the very end. I was like, “Well, I don’t know, regular expression enough to know what that would be, so I’m going to learn regular expressions, like I’d play these games.” So I thought it was pretty cool.
[00:20:42] SC: I especially like this one, Bobby, because I feel like it really does teach you how to do it. It teaches you sort of character by character.
[00:20:52] MN: Yeah. It’s just like, how do you – if you have one thing over here and another regular expression over there, what would be the joining factor of the two? I’m really bad at crosswords. I am so bad at them. But I feel like I can jam out to regular expression crosswords. It’s regexcrosswords.com or regexcrossword.com.
[00:21:18] DA: I guess like zooming out, like just looking at computer programming, and learning and gamification. And thinking about like my own first experience trying to program and like many other people’s first experience trying to program. Jeff Atwood, the writer of the Coding Horror blog, and founder of Stack Overflow, and many other great things. He is working on a project to take a book that was very formative for his childhood, a book called Basic Computer Games, which has a bunch of different programs or games that you can try to run on your own, using the basic computer language. He’s updating that for various modern computer languages. That seemed like kind of a fun project where you could take this – you could either help in like updating the content of the book for the modern languages, or you could go through it and try to make your own computer game. Which like, for me, like when I was young was a primary motivator, I just wanted to like have fun. What’s more fun than making something that is just going to help you have more fun and be able to change it as however you want?
[00:22:47] SC: And build your own world, yeah.
[00:22:49] DA: Yeah, exactly.
[00:22:50] SC: Did you build your game, Dave?
[00:22:52] DA: I did. I made like kind of like asteroids style game, where people would fly ships around and like shoot lasers. I just kept on adding to it for forever, and it’s very embarrassing and I didn’t know anything about version control, I didn’t know anything about like proper programming structures and things like that. It was like really interesting, like all the messes that you would get into trying to do this without kind of the basic hygiene of programming things. I think eventually, I tried to refactor it and I just broke it all. Then it was just like, it’s just a broken mess now. I only have one backup from a year ago.
[00:23:41] SC: It’s an artifact now.
[00:23:43] DA: Yeah, exactly. It’s a piece of art. Yeah, lessons learned.
[00:23:49] MN: You know, for some people, the work that they do is work. And once that work is over, they walk away, right? But the idea that we have like these games in flux with programming, and the fact that I still use them, I always find that really, really interesting. Because like, you use a game sometime to escape. You get immersed in a video game, and sometimes don’t want to go back to the real world or your problems or whatever. But I’m over here playing Flexbox Froggy, because I want to put CSS, this CSS element frog on top of a CSS element lily pad. I think this is like a really good way for us to ease us into learning and to picking up these concepts of programming. That makes us better developers, and better CSS writers, and regular expression enthusiast and Vim aficionados at the end of the day. I’m curious what other games exists out there, and that like there’s probably some way that they’ve infused JavaScript into video games and would love any kind of like feedback on that. Because it’d be great to kind of explore those things too. I mean, JavaScript is fun. I don’t know some people may not believe that. But for me, and I believe for most of us.
[00:25:09] SC: Yeah, it’s totally fun. Go out there and have some fun with it.
[00:25:14] MN: Go and have some fun with these programming games, and learn some things and bring those learnings back to the workplace.
[END OF EPISODE]
[00:25:21] MN: Follow us now on Twitter @radiofreerabbit so we can keep the conversation going. Like what you hear? Give us a five-star review and help developers just like you find their way into The Rabbit Hole. Never miss an episode. Subscribe now however you listen to your favorite podcast.
On behalf of our producer extraordinaire, William Jeffries, and my amazing co-host, Dave Anderson, and me, your host, Michael Nunez, thanks for listening to The Rabbit Hole.
[END]
Links and Resources:
