How DICE Game Designer Nicholas Shewchuk Used Adobe XD to Bring “Battlefield V” to Life
As fans of the iconic “Battlefield” franchise anticipate the fall release of “Battlefield V”, the game’s Swedish developer DICE anticipates how fans will react to its newest features. Here’s how Adobe XD helped bring this World War II epic to life.
by Sheena Lyonnais
posted on 06-13-2018
Set in World War II, “Battlefield V” is an immersive multiplayer experience that promises to take players through “pivotal, though sometimes forgotten” battles. Its compelling storylines and striking graphics contribute greatly to the experience of playing the game, but where the UX is truly set to shine is in the immersion and squad play features.
Nicholas Shewchuk is the design lead for UI/UX on “Battlefield” at EA’s DICE, the storied Swedish game studio behind the “Battlefield” franchise. Based in Stockholm, Sweden, but originally from Edmonton, Canada, Nicholas’s portfolio includes work on games such as “Star Wars: Battlefront II”, “Need For Speed”, “Max Payne 3”, numerous NHL releases, and many other games for multiple systems.
Nicholas joined the “Battlefield V” team midway through development. While the team has been using Adobe XD since it was released, this was Nicholas’s first time working with Adobe XD on a project of this scope. We caught up with him to find out how he and his team used XD to bring “Battlefield V” to life.
He gave us insight into his design process and shared what fans of DICE and the “Battlefield” franchise can expect from the October 19 release of “Battlefield V”.
How did you use Adobe XD in the creation of “Battlefield V”?
It has been our go-to wireframing and prototyping tool for the UI/UX team on the project.
DICE has UX designers working with each feature team to help visualize, prototype, and offer suggestions on good usability. Once the team aligns around a cohesive system and user experience design, we usually create mockups in XD for functionality and start developing art mockups in Photoshop for visual targets around the same time. We’ll go back and forth on both until the feature is both easy to use and visually well presented. We use XD for early sketches, prototypes, and documentation, but Photoshop for final art targets.
Once we have the combination of a signed-off visual target and design, we work with our producers, development directors, engineers, and scripters to build the first implementation of it in software. From there, we’ll use a combination of our own assessments, internal playtests, and UXR testing to assess the quality and execution of the design.
How did your design process differ on “Battlefield V” versus previous DICE projects you’ve worked on, such as “Star Wars Battlefront II”? Had you used Adobe XD on any prior projects?
A lot of what XD brought us was speed and efficiency. I hadn’t used XD personally on any past projects, and it was introduced to me after moving over to “Battlefield V” from “Star Wars: Battlefront II”. On “Star Wars”, our team built a big Illustrator toolbox where we essentially had two big artboards with all the various UI widgets (star cards, scroll bars, logos, buttons) as well as a standardized front-end template. We used this as a starting point when beginning any new design.
With XD the process was similar, but it was immediately apparent how much quicker, easier, and more efficient it felt to use — aligning elements on your canvas, managing your artboards and assets, as well as exporting screenshots all became much less strenuous.
DICE announced that two key elements the team focused on when building “Battlefield V” were immersion and squad play. What role did UX and usability play in designing these two improvements?
One of our new elements that for me greatly improves immersion is what we’re calling “physicality.” The easiest example of this is in health and ammo pickups. In previous games you simply would stand near boxes and you would regain health/ammo. Now, whether it’s through an interaction prompt or automated animation, you will see your character physically pick up ammo and health. The player no longer relies on a small white text string to be informed that they’ve been healed, ultimately improving the usability while also enhancing the experience by receiving feedback through the character animation. I really like this change both from the perspective of immersion and how it reduces the player’s reliance on having to glean information purely from text to understand the mechanics.
As for squad play, one of the biggest things we’ve been taking a look at is what I call our “death flow.” We wanted to find ways to get squads to work together more, so we’ve done a lot of work to try and encourage this. First, upon the player’s death, they can now be revived by someone in their squad, and not just medics, giving the team more options. We feel we’ve also improved the “down state” screen here, giving players a more clear option to hold on and wait for a medic, or let go and opt into the spawn flow.
The original “Battlefield”, “Battlefield 1942”, came out in 2002. How has the UX changed since then?
I’ve been working in the game industry now since 2008, and the perspective I mostly have is that UI/UX has slowly but surely been growing in importance and focus as part of a product design.
The testing we do on it, the elegance of the presentation, and the attention to detail have become greater and greater with every passing year. I believe products like Adobe XD are a good reflection of this as UX designers now have their own tool specific to their function and contribution to the team.
You tweeted that the feature you’re most excited for in “Battlefield V” is “definitely co-op.” Can you tell us about this feature and why you’re so proud of it?
Selfishly, co-op is just my favorite way to play games in general. I always enjoy being able to team-up with a friend or family member, and am happy our players will get a chance to do the same thing. I feel like the co-op mode just plays right into all the improvements we’ve made to squads in “Battlefield V”.
Squads will now persist from in-game to the front-end, so you have the ability to get together with three of your friends, and jump between different multiplayer modes and co-op. The team was working on this before I joined the project, and there’s been a lot of work put into it, both in terms of tech and design. I feel very strongly that this is one of the most important UX improvements we have made from “Battlefield 1” to “Battlefield V”.
What do you feel is your greatest accomplishment with this project?
For me it’s been how well DICE’s Engagement team (which includes UI art and UX design) have been able to work with each other and other teams on the project. There’s a lot of mutual respect and I feel the directors and producers on the team did a really good job establishing a vision we were all able to rally around and understand.
This gives me a lot of confidence that we’re building a great team here that can deliver a really strong player experience for “Battlefield V’s” launch, live service, and eventually future DICE projects.
What do you want players/users to take away from “Battlefield V”?
First and foremost, DICE always tries to create great games and bring players new and fun experiences. I was most excited when someone mentioned the unseen, untold, unplayed pillars we had for the game. I saw it as a chance to let players experience some of the lesser-known battles from World War II. Because of this direction, I feel we can really deliver something that feels fresh, brings attention to a part of the history players maybe weren’t aware of, and creates opportunities for new gameplay experiences.
Should other UX designers use Adobe XD in the game design process? Why?
Yes, absolutely. It finally feels like a tool built just for the UI/UX team on a project. I think a big part of being able to get a feature or idea you have into a game is being able to clearly communicate it and have people understand its value. I’ve really enjoyed using XD to help me quickly create very polished wireframes and mocks that really help get everyone on the same page with what we want to accomplish.
I’m excited about the future of the XD product line. I can’t wait to see how other teams will start to use it in the future — and really push the UX design and prototyping process to a whole new level.
Topics: Creativity, Design
Products: Photoshop, Creative Cloud