How game user interfaces can inspire better tech products – VentureBeat

Video games have some of the best user interfaces and user experiences among all digital products. And that’s why some tech companies are taking inspiration from the people who design video games when it comes to designing non-game technology interfaces.

Harlan Elam is a good example of someone who made the leap from games into cybersecurity, where his skills have been very useful in visualizing complicated dashboards.

Elam worked for 4.5 years at Blizzard Entertainment as a user interface and user experience designer, but he recently redesigned the product interface for Jask, a cybersecurity company. This is exactly the kind of leap that McAfee predicted in a report last year, where the security firm said that gamers have the skills to be good cybersecurity professionals.

Elam pulled ideas from a variety of disciplines — games, virtual reality game Lone Echo, and even science fiction shows like Westworld — to build a heads-up display (HUD) for Jask. I talked to Elam about this crossover, and it reminded me of a talk that John Underkoffler, CEO of Oblong Industries, gave at our GamesBeat Summit event in 2018. Underkoffler, the science adviser for the landmark sci-fi film Minority Report, begged game designers to lend their expertise to designing technology interfaces of the future.

And while Elam wasn’t aware of Underkoffler’s talk, he answered the call. Here’s an edited transcript of our interview.

Above: Harlan Elam is a user interface designer for Jask as well as a veteran art director for video games.

Image Credit: Jask

GamesBeat: You have some background at Blizzard, right?

Harlan Elam: Oh, yeah. I had four and a half years there. At five years you get a sword, which is really cool, but the opportunity at Jask was too enticing. I passed on my sword, but we’re doing fun work here.

GamesBeat: Where are you based now?

Elam: Our HQ is in Austin. There’s a Blizzard office in Austin, which is mostly customer support, but they also run the World of Warcraft website and the Diablo III website. That’s where I worked.

GamesBeat: I don’t know if you can talk about everything you did, but what were the tasks you worked on at Blizzard?

Elam: I was hired to redesign the World of Warcraft website and the Armory app, where players could view their character profiles. Those were two of the bigger projects I worked on, as well as supporting design work on Diablo III. Diablo III, while I was there, released the Rise of the Necromancer DLC. I designed the mini-site for that, and the mobile site as well. I did some support on their esports apps. When I had some downtime I would jump over to that team and help out with their Android and iOS apps. So I was doing UI and UX work.

GamesBeat: Do you miss anything about the Blizzard life?

Elam: There’s definitely a geekiness there that isn’t here at Jask. Everyone here dresses really nicely. There’s no statues on their desks or anything. [laughs] It’s just different.

GamesBeat: Are you doing similar work at Jask or something different?

Elam: The tasks and the processes are essentially the same. The product is very different. It’s not consumer-based, I guess is the right way to call it. It’s more for businesses. But it’s product design. It’s more strictly interface and less about going to buy something or check out a news article around the game.

GamesBeat: Is it more geared toward professional people, then, as opposed to a consumer website? Is that a big difference?

Elam: Yeah, it’s more B-to-B. This is a tool that security analysts will log into to monitor their network and make sure their network is safe. They can see incoming threats and deal with them appropriately.

Above: John Underkoffler shows off an immersion room display in May 2017.

Image Credit: Dean Takahashi

GamesBeat: We do the GamesBeat conference, and we had an interesting speaker a couple of times, a guy named John Underkoffler. He was the science advisor on Minority Report, where Tom Cruise used those data gloves and the gesture-based controls. He made it his startup’s work to take that technology and put it into office products. You can use big monitors in a control room, or just a big meeting room, and use gesture controls to throw images on the walls. He came to our conference and said that game developers are the best at creative user interfaces and controls for complex software. His theory was that these people would be the best to design other products — that people should take lessons from game design and apply them across other software, which seems kind of like what you’re doing.

Elam: We’re trying to. We have a ways to go. But that’s definitely avenue we want to take. I will say that I haven’t developed games per se. I worked closely with some game teams, and I’ve been a gamer my entire life. We’re taking a lot of those UX philosophies from games to what could potentially be a very sterile and boring tool to use. That’s the opportunity I saw and was excited to join.

GamesBeat: What sort of lessons do you think you’ve drawn from games?

Elam: In terms of app design, especially in cybersecurity, a lot of the products are difficult to use. There’s a steep learning curve. I kind of equate it to tutorials for games. The more difficult games have more intense tutorials. At Jask we want to make it really easy to jump in. I know that myself, and most gamers, would prefer to not read a manual. We want to just jump in and start playing. Most people we talk to agree with that. When they get a game they want to just put it in and not worry about the instructions.

In terms of how we implement that in the product, we want to simplify. Some of that has to do with the layout of the app, adding labels to icons that didn’t have them. Some of the terms we use are proprietary, so the more we can do to make things obvious, the easier it will be for analysts to pick up on the nuances of the app. For the HUD in particular, we introduced this radar graphic in the middle with these red triangles that are the things you need to focus on. We use simple shapes and colors that are traditionally used to communicate, “Hey, this is a thing you need to look at.” We use red to identify something you need to take care of before something even worse can happen.

I was inspired in my initial thinking by things like Missile Command, Space Invaders, Battlezone for the Atari. Just very simple point and shoot games. While we’re not quite there yet, we’re getting there. That’s the inspiration for the radar. Show you there’s something you need to go attack. The idea, eventually, is that we’d like those triangles to move. As the risk factor goes up, the more probable it is that an attack is going to be damaging to your network. The structure is going to get closer to that bullseye in the middle, showing exactly where you need to go click to take care of these things right away.