Game mechanics in web apps

A while ago there was a dis­cus­sion on the IAI mem­bers list about game mechan­ics on web sites. Andrew Hin­ton point­ed to the Google Image Label­er and LinkedIn’s ‘pro­file com­plete­ness’ sta­tus bar and asked: “Can any­one else think of a use of a game mechan­ic like this to jump-start this kind of activ­i­ty?” (Where “this kind of activ­i­ty” is basi­cal­ly defined as some­thing peo­ple would­n’t nor­mal­ly do for its own sake, like say tag­ging images.)

I was think­ing about this for a while the past week and seem to have end­ed up at the following:

Profile completeness status bar on LinkedIn

On LinkedIn, hav­ing a (more or less com­plete) pro­file pre­sum­ably serves some extrin­sic goal. I mean, by doing so you maybe hope you’ll land a new job more eas­i­ly. By slap­ping a sta­tus bar onto the pro­file that gives feed­back on its com­plete­ness, the assump­tion is that this will stim­u­late you to fill it out. In oth­er words, LinkedIn seems unsure about the pres­ence of extrin­sic moti­va­tions and is intro­duc­ing an intrin­sic one: get­ting a 100% ‘com­plete’ pro­file and as such mak­ing a game (in a very loose sense of the term) out of its pro­fes­sion­al net­work ser­vice. A good idea? I’m not sure… 

Screenshot of Google Image Labeler

On Google Image Label­er, the start­ing point for its design was to come up with a way to have peo­ple add meta-data to images. Google actu­al­ly ‘bought’ the game (orig­i­nal­ly called The ESP Game) from CAPTCHA inven­tor Luis von Ahn, who before that did reCAPTCHA and after went on to cre­ate Peek­a­boom and Phetch. Any­way, in the case of the Image Label­er (con­trary to LinkedIn) there was no real extrin­sic goal to begin with so a game had to be cre­at­ed. Sim­ply hav­ing fun is the only rea­son peo­ple have when labelling images. 

Note that Flickr for instance has found oth­er ways to get peo­ple to tag images. What hap­pened there is (I think) a very nice way of align­ing extrin­sic goals with intrin­sic (fun, game-like) ones.

‘Pure’ games by their very nature have only intrin­sic goals, they are arti­fi­cial and non-util­i­tar­i­an. When you con­sid­er intro­duc­ing game-like mechan­ics into your web site or appli­ca­tion (which pre­sum­ably serves some exter­nal pur­pose, like shar­ing pho­tos) think care­ful­ly about the extrin­sic moti­va­tions your users will have and come up with game-like intrin­sic ones that rein­force these.

Update: Alper fin­ished the LinkedIn pro­file com­plete­ness game and was dis­ap­point­ed to find there is no pot of gold at the end of the rain­bow, mir­ror­ing the expe­ri­ence many play­ers of real games have when fin­ish­ing a game.

Published by

Kars Alfrink

Kars is a designer, researcher and educator focused on emerging technologies, social progress and the built environment.

9 thoughts on “Game mechanics in web apps”

  1. Pingback: Leapfroglog

  2. Do you read lostgarden.com? That blog has been advo­cat­ing these con­cepts for a while, espe­cial­ly with the idea of “mas­tery dri­ven inter­ac­tion design”. It’s cer­tain­ly been a devel­op­ment I’ve noticed over the past few years, but I haven’t been for­tu­nate enough to find a client who under­stands “mas­tery” and the risk/reward mechan­ic com­mon in game design enough to allow per­va­sive game design to be imple­ment­ed in a web application.

    Linked­In’s pro­file com­plete­ness is some­thing we have been advo­cat­ing, how­ev­er, even though it does­n’t real­ly have much of a “risk” to coun­ter­bal­ance its rewards.

    Nin­ten­do Europe’s web­site has been using activ­i­ty and par­tic­i­pa­tion rewards since its launch in 2002, by the way.

  3. Mh, isn’t it a bit easy to use games in this mat­ter when it comes to make web appli­ca­tions more fun? Most games have loads of dif­fer­ent aspects that make them attrac­tive. Fun and visu­al­ly pleas­ing are indeed some aspects that can relate (or improve) web appli­ca­tions, but web appli­ca­tions should nev­er become chal­leng­ing while the chal­lenge is a very obvi­ous, intrin­sic part of (video)games.

    Com­plet­ing you pro­file on linked in should be as easy as pos­si­ble, the web­site should aid you on all fronts and make fill­ing in those end­less forms a breeze, not a chal­lenge (one that you poten­tial­ly would want to retry once you’ve com­plet­ed it). Pro­vid­ing a progress bar obvi­ous­ly works, but I think thats more relat­ed to the fact that peo­ple just want to have/collect every­thing ( col­lect all 1995 base­ball cards, own every Pixar DVD or, indeed, col­lect all hid­den pack­ages in GTA ). Or maybe just because incom­plete progress bars are annoying ;)

    So, please, if you want some­thing to be fun don’t imme­di­ate­ly refer to games. And if you must refer to some indus­try, just use the whole enter­tain­ment indus­try, there are loads and loads of valu­able lessons to be learned from toys, tv-shows and movies as well. (ok, not exact­ly relat­ed to the arti­cle, but I just need­ed to get it off my chest ;)

  4. First of all thanks for the thought­ful com­ments guys. This real­ly helps to sharp­en my arguments.

    @Rahul: Lost Gar­den looks like a sweet resource. I agree with you that it might be hard to have a client explic­it­ly sign off on game mechan­ics in a web app. (You could always just sneak it in…) I think a good angle might be the broad­er cat­e­go­ry of user expe­ri­ence, where if they (the client) agree that there is more to the use of the future app than just util­i­tar­i­an aspects, you might be able to include ele­ments that serve only to induce ‘plea­sure’ (to avoid the f‑word.)

    @Hessel: Wel­come! How do you like your Mon­sterID? ;-) I think we agree on the point that if we include game ele­ments in a web app, they should­n’t get in the way of the user sim­ply get­ting some­thing done. That would just be wrong. But I’ve found that there’s more to inter­ac­tion design and infor­ma­tion archi­tec­ture than just sim­ply sup­port­ing the user’s task in the most func­tion­al way pos­si­ble. There is a whole expe­ri­en­tial dimen­sion where thing like plea­sure of (I’m sor­ry) fun come into play. There’s an arti­cle on the blog Rahul men­tioned that con­cludes with: “An acknowl­edg­ment (sic) of plea­sure of doing is miss­ing from mod­ern inter­ac­tion design.” In oth­er words: when allow­ing the user to get things done, would­n’t it be actu­al­ly use­ful to offer a plea­sur­able expe­ri­ence as well? Final­ly, I think the spe­cial kind of fun games (and toys) offer is more inter­est­ing for inter­ac­tion design than those offered by TV or film (basi­cal­ly because the lat­ter aren’t strict­ly speak­ing interactive).

  5. Anoth­er exam­ple of inter­est­ing game design in a user inter­face is the Help Cat in the Wii UI: http://lostgarden.com/2006/12/wii-help-cat-lesson-in-interaction.html http://www.cabel.name/2006/11/tragedii.html

    It’s fun­ny to think that by mak­ing a user work to get some­thing as basic as a help screen, a cer­tain ide­ol­o­gy indi­cates that this is actu­al­ly ben­e­fi­cial to the user expe­ri­ence, as opposed to tra­di­tion­al think­ing which implies that you want the help but­ton to be as easy as pos­si­ble to get to. Great read.

  6. Pingback: UX and the aesthetics of interactivity (Leapfroglog)
  7. Pingback: Four Starters » LinkedIn: How does your social game play out?

Comments are closed.