Elizabeth Tobey: Welcome to the Civilization V Podcast Series. I’m Elizabeth Tobey, and today I’m talking with Marc Myer, Lead User Interface Programmer, and Russel Vicaro, Lead User Interface Artist, about the how and why of one of the most fundamental parts of any Civ game: The UI. Being able to navigate the UI quickly and effectively is key to having an enjoyable gameplay experience, especially with a strategy game as involved and in depth as Civilization V. For this iteration of the series, the team not only revamped how things were organized to streamline and simplify the plethora of options, but they also paid particular attention to the aesthetics of the UI to make the game visually cohesive.
In the beginning, Russell didn’t have a ton to go on. He was given images of the game, and of concept art that was informing the entire look of Civilization V, and told to run with it, and make the UI echo these images.
Russell Vaccaro: Dorian came to me – he’s the lead artist, which, you probably know about him – with paintings of how he envisioned the landscape looking. They were very painterly. So what I wanted was something to frame that nicely. I also wanted something that was different than pas Civs. Something that I really like is the art deco style. So I took two months and I kind of modeled and drew, painted – I just did everything I could to find out what it is to be art deco. I researched and during that time – let’s see what else I did – played a lot of Civ IV and took notes on things I would like to do to make this more accessible to every player instead of just what’s termed as like hardcore. That’s where the look and feel came for the UI and I’ve been getting really great response from it. Then we had the issue of thousands of icons. So early on I was finding these really beautiful posters in the art deco style. There tend to be - there’s like several different styles that show up. Each one just reeks of art deco so I wanted to have each icon look as good as those posters. Unfortunately, creating the UI and doing those icons as beautiful as I wanted required me to hire somebody else to do those beautiful icons that I wanted to do. We were very fortunate to get a painter from the Maryland Institute of College of Art, Jason Pastrana. He came on and started creating these icons about a year ago, and he’s just about finished. And he’s doing a wonderful job.
ET: Designing hundreds of buttons aside, Russell’s explanation on how they technically created the look for the game’s UI brings up another important point – usability. There are dozens of menus and buttons for a player to use and even to the veteran Civ player, sometimes all these icons and options can be daunting. For Civilization V, the team reinvisioned how information was conveyed to the player - allowing the gamer to decide when to act on certain events and pay attention to pieces of the game at his own speed. The notification system puts all the tools and information necessary to conquer the world into your hands and empowers you to act rather than confusing you.
Marc Meyer: Well we wanted to make sure that the player wasn’t overwhelmed with information. I mean there’s so much going on in Civ we wanted to make sure that the player could pick it up and play with it without feeling like they needed to read a huge manual or do research on what everything meant. So the notifications sort of replace some of the popups we used to have where anytime something important happens in the game you get a small icon to let you know that something’s going on. When you wanna know what that is you can go and look into it rather than being confronted with something immediately that you have to deal with. So it’s sort of speeding up flow and kind of letting people stay in the game a little bit more rather than being pulled out to some piece of UI.
RV: And the way the UI is presented to you throughout the game, it’s more of an additive. Instead of having everything available at once, as it becomes available, that part of the UI will show up or say, “hey look at me” so…
MM: Yeah over time the city screen will get more and more complicated as you get bigger population and more options are available to you. As you build new buildings you’ll see more things showing up in there.
RV: Yeah it kind of grows while you’re learning.
ET: Like with all good games, the UI wasn’t born overnight. Both the look and the usability went through countless iterations and revisions before a final design was decided. And while the UI has always been an iterative process for every development team I’ve worked with, I thought Firaxis’ flow might be even more so. Their studio is very iterative in every aspect of their design – so it made sense to me that something so large as a UI overhaul would have a unique process.
MM: We’ve had a lot of back and forth, a lot of iterations on the screens that are in the game. With a lot of stuff, either Russell or myself will put something in initially and then it kinda bounces back and forth between the two of us for a long time where he’ll be adding in more details and more features to the components of the screen then I’ll go in and hook up the pieces of logic that populate everything. So we’ve bounced things back and forth quite a few times.
RV: We’ve been able to eliminate a bottleneck where the artist has to use a tool and then – so the programmers and designers are always waiting for artist to make this screen, export it, and get it into the game. The process that Marc created now, everything is done in XML, so when John needs a screen, he makes it. When a programmer needs something, they make it. So everybody’s been able to make the screens and then I go in and pretty them up. I hafta say I’m doing much more coding than I thought I would ever do as an artist but it seems to work. As far as the iterations go, everyone’s able to make changes without any bottleneck and it’s been beautiful. I don’t think we even realize how beautiful it is because it’s just been so seamless. But I remember on my last project just there being a bottleneck there and I felt as if I couldn’t make everybody happy because couldn’t get to everyone’s screen quick enough, but this way takes care of that.
MM: Yeah we built a whole new system from the ground up using XML and LUA and so we have one great advantage where we’re able to hotload those files as we change them. While the game is running we can modify the user interface and hotload those screens and see our changes immediately which has just been a huge, huge thing for us. We’ve been able to do so many more iterations because we don’t hafta wait on an export, we don’t have to wait on a compile. We just see our changes right away, so we’ve been able to really really polish up a lot of our interface.
ET: Before I let Marc and Russell leave the recording studio (at the time of this recording, the UI was still definitely in flux, and they had quite a bit of work to do) I asked them how they wanted people to feel about the final user interface. So far, press and community had said quite a bit about the bits and pieces of UI they had seen (I’ll take a moment to tip my proverbial hat to you diehards out there that deciphered screenshots and video stills with amazing skill and speed.) With so much time and energy poured into creating a system that was a keystone for all of Civilization V, I couldn’t imagine they didn’t have hopes and dreams of some kind for how gamers would receive their work.
MM: Yeah for me I would definitely want them to not notice it because it’s so functional. I would love for it to just work for everyone and them to have the data they need when they need it but to not be intimidated by it.
RV: I want them to think like I thought when I played Warcraft 2. “This is just the best interface ever.” It just has the most beautiful icons that I love, and I can’t wait for people to see them. I think ten years from now I really believe people are gonna be like, “remember those icons from Civ V?” They all had a similar theme and there were thousands of them and I felt they all came from the same game. I also agree with Marc. I hope that the interface is so seamless that it’ll take you a while to like appreciate it. And if you do, you’ll love it hopefully.