The League of Legends and Counter-strike: Global Offensive dashboards in action! Read on to learn more.
My PhD was funded through multiple (European and smaller) projects, on topics such as Learning Analytics, Digital Humanities, and Unemployment. And they were interesting: I designed data visualizations on tabletops, desktop, and mobile, I researched the user’s perception and experience… all fun and games.
But no, not games.
I’ve always had a soft spot for games. I moved abroad for two years (and had my wife give up a great job) just so I could live the dream and be a game developer (a story for another time perhaps). And combining my research with games was something I had dreamed of for quite a while.
Alas, no funding to support this research. But life finds a way, right? ;)
Students to the Rescue
Students! Of course! Every year we had new Master in Engineering students working on both fun (and sometimes boring) Master thesis topics. So I introduced a new one: eSports dashboards to support spectators. The high paced action of different players across large battlefields is not easy to follow. So how could we help spectators get better insights in what was going on, real-time, during these hectic games played by professional gamers.
A huge success among students, but sadly enough spots were limited, and two students “won the lottery” (we have no say in the matter. It’s quite random): Hans Cauwenbergh and Bram Luycx.
And we got lucky. This turned out to be one of the best collaborations with students ever.
The Dashboards
Hans jumped on League of Legends, while Bram took on Counter-strike: Global Offensive. We designed and set up a couple of surveys on Reddit in order to get insights in spectators’ motivations and perceived usefulness for different statistics provided by the respective games to inform the design of the dashboards. And then, they were off!
Viewer preferences (167 responses for League of Legends, 596 for Counter-strike: Global Offensive)
League of Legends
a) Gold distribution, b) Damage dealt, c) Vulnerability.
The dashboard is the result of five iterations: two digital non-interactive designs, two interactive prototypes, and the final fully functioning prototype developed with React.js and D3.js. Iteration one to four were developed using the interface design tool Figma. 22 participants took part in the evaluations of the iterations of the prototypes.
The main view is split in three modules: Gold, Damage, and Vulnerability. All modules are continuously updated in real-time. Gold and Damage are quite obvious. Let me explain Vulnerability.
Vulnerability provides an indication of how vulnerable each player is. A simple linear equation combines the position disadvantage of the player to the rest of the team and/or enemies, current health and mana points, defensive statistics and summoner spells availability. These values are combined and visualized around the player icon as a summary indicator. This view lets spectators make predictions regarding the state of the game.
Hans also added an interesting Jungler visualisation:
Counter-strike: Global Offensive
a) Round progression, b) Economy button, c) Map button, d) Scoreboard, e) Money Distribution, f) Average Damage per Round
This dashboard is the result of three iterations: a paper prototype, a non-interactive digital prototype designed using Figma, and a fully functioning prototype developed with React.js and D3.js. 14 participants took part in the evaluations of the iterations. The dashboard consists of Round Progression, Economy, Map, Scoreboard, Money Distribution, and Average Damage per Round.
Results
Through semi-structured interviews and eye-tracking we managed to get further insights into the perception and experience of participants spectating these eSports games while using our dashboards. It resulted in an interesting list of design goals for spectator dashboards that we published and presented at CHI PLAY 2018 in Melbourne, Australia.
LoL and CS:GO eye tracking results from each participant after the evaluation. The attention heatmap indicates the areas of interest where participants focused more during the whole match.
I’ll refrain from turning this digestible blog post into a long scientific article. But if you are interested in the guidelines, you can find the article here. Or go through the slides below!
If there is enough interest, I’ll post a summary of the guidelines on Medium ;) Just let me know in the comments!
Hans (full-time) and I (freelance part-time) haven’t stopped here though and are working for GRID eSports Gmbh where a lot of eSports data magic is happening!
Next to that, I’m a Freelance Data Visualisation Experience Designer/Adviser. I’m for hire, so if you have any dataviz needs, send me a message!
TL;DR:HCI research group at KU Leuven looking for game studios to provide access to live game logs for 2 Master theses, or even collaborate with our group around data visualisation for streaming research
Every year our HCI research group defines a number of Master thesis topics for Computer Science and Engineering students. Our topics include data visualisation, recommender systems, augmented reality, learning analytics, and e-health.
As my expertise is data visualisation, and video games have always held a special place in my heart, it only made sense to merge the two. That’s why this year we have two Master students working on “Designing live data visualisations for the new spectator sport: video games”.
The general idea is to use live (interactive) visualisations during a game to help a specific audience get a better understanding of and new insights in what is going on. Some examples:
help people who are new to the game to get a better understanding of the game
assist the streamer in informing their audience better
help the streamer’s fans get more insights into their specific idol’s activities
facilitate a better overview to assist commentators
… anything goes, but we’ll be narrowing it down ASAP, as both theses must be finished by June 2018 ;)
For this topic my students require access to activity logs of a game, preferably during live play. The availability and type of data will play a big part in the choice of game (type) and target audience of the visualisation.
So what we need is a game studio (big or small) that is developing a game with Twitch/e-sports in mind, or a studio that has an established game with e-sports/twitch popularity. What we want from you is access to detailed game logs or an API, for science!
If you think you could help in any way, let us know! We can work independently, sharing our research results in a way that can help you, or we can even look for official collaboration options (we could even apply for funding, certainly if you have offices in Belgium), within and beyond the scope of these theses (this might actually be very interesting for small Flemish indie studios because of government funding possibilities).
Interested? Want to know more? Shoot me an email, or leave a comment below!
In case you wish to learn more about us, read on.
A Master thesis at the Human-Computer Interaction group. Our process is that of design-based research, iteratively designing prototypes with a heavy focus on the user, involving them in the design process and the evaluations. The result should be a fully working prototype that has been proven to be an added value to the target audience, by being usable, useful, and generating meaningful insights. The student also writes a 50-70 page thesis text, reporting on the current state of the art, the thesis process and results, and the research contribution. To pass the thesis (a requirement to finish the Master program) the student has to successfully defend the work in front of a jury of academics.
To those of you who don’t like to read, a summary: Three Belgians (two Walloons and one Flemish, and sometimes a Mexican) will stream Overwatch every Wednesday, from 9pm CET until 11pm CET. So head over to Twitch and subscribe! (yes this is an activity that’s helping me finish my PhD dissertation!)
Belgium is an interesting country. Super tiny, only 11 million people, yet home of chocolate and beer, fries, Jean-Claude Van Damme, Tintin, the Smurfs, the saxophone, the contraceptive pill (the Catholic church loves us for that one), we invented both asphalt AND roller skates, and so much more. We do all right for an insignificant speck on this planet.
But what makes Belgians really different, is their attitude towards political correctness. We tend not to do that. Except for politicians and hipsters, maybe. But in general, we “respectfully” make fun of everything. Nothing is sacred.
And that’s fine. We don’t mind being the target of laughter and ridicule either (we’ve been through enough misery that we can see the funny side of everything) . Hell, we do it to ourselves on a daily basis!
You see, Belgium is split into several parts, but the most important ones (sorry Brussels, no one likes you) are Flanders and Wallonia. Flanders (the North, where I live) speaks Dutch, known by the South for extreme racism and intolerance. But at least we cycle and feel better about ourselves because of it. Wallonia, the South, speaks French, known by the Flemish as leeches who contribute nothing to society. What they lack in civilisation, they make up for in hospitality and cleaner air (yet they don’t cycle!). Before I get lynched by either side, these are stereotypical jokes we throw at each other. Jokes, people!
Yet, media and politicians seem to take these seriously, fuel the hate (which.. isn’t really a thing), and want to split this country in two.
But in reality, calling a Walloon lazy, or a Flemish a racist, is just a thing we do. “No offence”. Both sides know that. If they can’t take the joke, it usually means they’re Bruxellois (or lazy, or racist..).
So what does this have to do with anything? Overwatch, believe it or not. Together with a couple of Walloon friends (and the occasional Mexican), we’ll do a weekly stream to prove everyone wrong. That we DO get along. As long as we get to shoot other people in the face. Isn’t it beautiful how violence brings us together?
We’ll show them those stereotypes are as true as the lies about French driving skills, Dutch cheapness, British food, American obesity…
*cough*
We’ll show the true love that lives between the North and the South! No ham will come between us (ok that’s a terrible inside joke).
The stream will be in English, of course, and once we hit critical mass and make money, we’ll hire someone to subtitle the Walloons ;) ..
Jokes aside (I have to save them up for the stream), we’re planning on a weekly stream, every Wednesday, from 9pm CET until 11pm CET. So head over to Twitch and subscribe! You might not be disappointed!
I recently went to my second Screenshake, an indie game festival in Antwerp, Belgium, together with my fellow PhD candidate colleague Francisco. It’s a nice initiative that, among other things, tries to give the Belgian game scene a bit of exposure and attempts to bring a diverse crowd together: a good balance in gender (both talks and audience), and the most diverse crowd on pretty much any level you can imagine. It’s.. impressive.
Francisco playing a Mexican character.. very Inception-like.
As a computer scientist, the event tends to get a bit too artsy for my taste. Choosing talks was difficult due to the limited information (only a short, sometimes very cryptic biography), and I couldn’t get to the Industry Talks on Saturday, which, I’m sure/I hope, were not artsy at all. So I chose the talks of Annamaria Andrea and Pietro Righi Riva on Sunday morning, based on the fact that they’re academics as well, expecting very clear and fact-based presentations. Sadly however, they were both in a casual mode, presenting a lot of ideas and thoughts but lacking structure and a general clear message to take away (I have a feeling this blog post is heading in a similar direction). Okay, maybe that’s a bit too harsh, both were interesting talks. But it made me wonder where they want games to head. (Disclaimer: I might have completely misinterpreted these talks or their points being made, because everyone seemed to nod in agreement while we both looked confused. That’s what the comment section or @svencharleer is for).
I saw two trends, opposite extremes as you will: one towards too much freedom, and one towards too many restrictions in video game design.
Noby Noby Boy – PS3 2009
Freedom: Annamaria talked about authorship in games (I’m recently doing something in datavis around that topic. Totally unrelated! Not sure why I mentioned this. Hey it’s my blog): as a game designer, attempt to give a good amount of freedom to the player, try not to impose too much, and let them fill in the interpretations themselves. Made me think of Minecraft, or GTA when you rip out the story line. These sandbox environment promote creativity, personal input etc. My question is, how do you categorise these games: where do you draw the line, when does it actually stop being a game. E.g. I can give a kid a stick, and they can pretend it to be anything, play for hours, but that didn’t make me a game designer. Sure, an extreme example, but a minimal guidance, a specific personal input from the designer seems necessary? How much deviation in interpretation do you want to give? How do you create those boundaries, for it not to remain a game? Nobi Nobi Boy comes to mind, by Keita Takahashi. Sure, it looks like a game. But is it? I’m biased of course, I like games with stories. I love Shadow of the Colossus, The Last Guardian, Day of the Tentacle.. all linear stories that “hold my hand” so I don’t get lost. I’m not a fan of open worlds, except maybe World of Warcraft (but I’d hate it without the multiplayer aspect, which is a totally different story). Open worlds can retain my attention for about five minutes. Then I’m out.
Restriction: But that brings me to Pietro’s talk and his manifesto, and his attempt to broaden the reach of video games. A bit of a weirdly structured talk: he goes through all the steps of his manifesto but then spends half the talk about the issue of time flow. See, according to Pietro it’s important to create, say, a two hour experience. The player becomes more of a spectator, and has no real direct input on the outcome. You’d only play through it once, and using examples such as Zelda’s Majora’s Mask, he explains that it’s been done before, but not without the concept of looping, forcing the player to partake in some kind of Groundhog Day experience. He doesn’t want looping, but he doesn’t want you to miss out on anything either.
First concern? Why haven’t we seen real-time in games a lot lately? Because it doesn’t really work well. It puts a huge amount of stress on the player, and therefore it isn’t a good candidate to lure in non-gamers. Secondly, how do you technically achieve this? One single run-through, but the player must be aware of all plot moments. I can think of two things: those 70s split screen cuts, and the FMV games Ground Zero: Texas and Night Trap (I bet the SJWs would have a field day with this one, if it were to be released today), where time moves on, and you have to constantly switch cameras to make sure you’ve seen it all (oh and shoot aliens). These mechanics might have been abandoned for reasons though.
Night Trap – Sega CD 1992
A huge concern I have with this manifesto, is that it feels like Pietro is trying to copy, what is, a movie. A two hour experience you sit through. Interactivity is limited to changing focus, but if you want the player to not miss the important events, those interactions are by definition going to be meaningless. I don’t think it qualifies as a game, if you don’t actually play.. (that’s not completely true of course, and we can redefine this term as the industry continues to mature). Also, don’t try to appeal to such a large target group. If you want to reel in new crowds, design for them specifically. Do some participatory design, talk to your target audience. Whatever appeals to the masses isn’t necessarily good anyway.
Many games on demo did take queues from this manifesto: lots of games on demo were just interactive experiences. It reminds me of the 90s, when the CD-ROM was released, creating an abundance of interactive multimedia. FMV was a big thing, but not an easy thing to interact with. The result? Lots of interactive movies. I’m sure it pulled in a lot of new types of gamers, but to those of us growing up with Mario and Sonic, it felt like a huge step backwards. I’m not saying there is no place for these experiences, but the classifier “video game” seems a bit far fetched. I won’t say “games” like Dragon’s Lair weren’t pretty though. But did anyone really enjoy playing those? Another example, I think this was L.O.C.K. by Tales of Tales, see below. Pretty? Sure…
A post shared by Francisco Gutiérrez (@francisco.ghz) on
I appreciate Firewatch (loved) and Oxenfree (played through it yesterday) though. Those are good games. But I consider them on the border of being real games. Interactive stories, sure. Point and Click adventure? Barely..
OK, so with indie games you can experiment away. No barrier on creative freedom. That’s the beauty of it: no publisher breathing down your neck. And if it’s pieces of art you wish to make, only understandable and appreciated by a minority, sure, it’s your total right to do so. Abstract art has an audience. I’m not part of that audience, as you might have guessed. But again, do not coin the term game. Games can be art, but interactive art isn’t necessarily a game. And that brings me to a final “little” frustration that came up seeing some of the demos (totally due to the fact I’m working in Human-Computer Interaction, or maybe my impatience as I’m older now): “it’s not good practice to make something hard to use as part of your design” (messy controls aren’t art either). It took us (two average intelligent guys) a couple of minutes to understand the input methods for If Found, Please Return, which then sadly enough only seemed to act like a Prezi presentation. OK, too harsh, I’m just trying to make a point, I can’t judge a game properly from a few minutes on a demo floor. But it made us walk away, which isn’t a good sign. Then some games will throw away a good button layout for a complete random mess no gamer would ever understand, e.g. triggers for jump and shoot in a shoot’m up platformer called Hivejump. As if Contra never happened :/ .. Recently I saw a friend try Broforce. He wasn’t new to games either. Felt like watching a toddler discover a platformer for the first time. (Phil Fish can say what he want about Japanese video games, but at least people don’t feel/look stupid when playing them) What I’m trying to get at is this: involving your audience in the design is important. Learning from successful designs is too. Don’t fix what isn’t broken. Experimenting with new things? Sure. But do some solid user evaluations. Real users. Not your techy friends.. Don’t take it from me (hey it’s just part of my research/job), take it from Silicon Valley:
Being my blog, I have the freedom to do whatever I want. So I’m not going to give you a proper conclusion (I already have enough work trying to do so for my PhD dissertation). This post was a personal interpretation of my experience, so, in line with what I’ve learned at Screenshake, I’ll leave the interpretation of this blog post to the player.. I mean reader. Feel free to contribute (or criticise, that’s .. the academic way!).
