The challenge.

Hundreds of recipes. One list.

Guild Wars 2 is a Mass Multiplayer Online RPG that was released in 2012, with its third expansion, End of Dragons, releasing just this year. However, the current crafting menu, which hasn’t seen much change over the years, is growing increasingly difficult to navigate as the number of available recipes goes up.

Additionally, the game has a unique item naming system, with over 30 different equipment prefixes, each prefix indicating a specific combination and weight distribution of attributes. Each prefix is considered a unique recipe. Faced with learning both the crafting menu and the attribute combinations, new players often make costly mistakes. Meanwhile, veteran players have to wade through long lists of recipes to arrive at the item they want to craft.

Players of all experiences need a way to intuitively use the crafting menu, so that they can spend less time trying to find the recipes they want and spend more time playing the game.

Our Concept.

Emma and I researched and redesigned the crafting menu’s navigation experience in a way that allows players of all experience levels to quickly and accurately find the recipe they want to craft, regardless of the item type, name, or attribute prefix.

01. RESEARCH

Asking the Players

As a longstanding MMO, Guild Wars 2 has a wide spectrum of players, from those who have been playing since release, to those who only recently picked up the game. In order to gain a better understanding of how different types of players experienced the game, we interviewed players with a variety of experience levels about their crafting in GW2, as well as their experiences with video game crafting overall.

Despite the wide range of experience between the players we interviewed, there were striking similarities - players overwhelmingly consulted websites and other third party tools in order to find recipe and item information. Additionally, players had trouble with the Ascended equipment, which had a different naming convention for the attribute prefixes, often resulting in a costly mistake - crafting the wrong item. At the same time, the redundancy in the recipe names made it difficult to quickly skim the recipe list.

In order to pinpoint where we could make focused improvements to the experience, we created a user journey map for our persona, The Confused Crafter.

02. DESIGN

Balancing Familiarity with Innovation

As an existing menu in game, we needed to maintain familiarity so that current players wouldn’t be alienated, while redesigning the navigation to be more intuitive and convenient.

In our early sketches, we kept the main format the same, while adjusting secondary features and adding in more navigation options.

Based on what players had said in their interviews, once they found the recipe they needed, it was relatively smooth sailing - provided that they could find the correct recipe. As we moved forward with our redesign, we focused on two main points: improved readability of the recipe list, and more options for navigating and filtering.

02. (RE)DESIGN

03. TESTING

Building and Testing with Players

As we moved into prototyping, Emma handled the initial layout and flow while I designed the new menu elements and built the components. We prototyped several methods of navigating to the recipe in order to simulate a variety of user preferences: Using filters, using global navigation, and simply navigating by collapsing the categories or scrolling down.

To evaluate our design decisions, we usability tested with 5 participants, 4 Guild Wars 2 players of varying experience levels and 1 non-Guild Wars 2 player. Participants were tasked with navigating to and crafting the Ascended scepter with the Berserker attribute prefix, named in game as Zojja's Wand.

Why Not Collapse All?

When it came to using the Collapse All button, I was puzzled because participants would gloss over it completely, even when asked to navigate the menu in a different fashion. When asked about it, they said the same thing: They thought having a Collapse All button was so obvious, they assumed it was already an existing feature in the game.

"I like how easily navigable it is."

From the participants who were both novice and veteran GW2 players, the positive feedback was overwhelming. However, there were a few spots where there were consistently errors, so we made some adjustments as we moved into high-fidelity.

"There's only improvements to the crafting system."

At the end of six weeks, we had redesigned and prototyped, and tested a reimagining of the Guild Wars 2 crafting menu.

By adapting to the unique naming conventions of the game's items, redesigning what and how recipe information is presented to the user, and adding more options for navigation, we created a smoother experience that allows for quicker navigation and minimizes the chance for incorrect crafts.

- Guild Wars 2 player of 7 years

LEARNINGS & NEXT STEPS

Takeaways

Design with the entire game screen in mind.
- Originally, we redesigned thinking only about the crafting menu itself, since it seemed similar to designing for a browser.
- However, game menus don’t exist in a vacuum, and we should have designed on top of a standard full screen resolution to ensure our design choices would achieve the effect we wanted.
Interviewing and testing players of all experience levels is critical.
- Although the players we interviewed had common experiences and pain points, they also had feedback that was unique to how long they had been playing. For example, one of the older players mentioned that the search bar couldn't be deactivated, but one of the newer players didn't see that there was a search bar in the first place.
- By gathering feedback from both demographics and more, we were able to create a design that was intuitive and friendly for players of all experience levels.
Figma is fun!
- As the lead visual designer in our team of two, I needed to recreate the game’s painterly aesthetic and extrapolate new and updated design elements. This was a big challenge for me, but I learned a lot and had the opportunity to design with elements and tools that I normally wouldn’t use.
- Midway through the project, Figma rolled out its component and auto layout update, so I took the opportunity to experiment and improve my efficiency with variant and nested components.

Next Steps

We’ve reached the end of the project, but our work isn't yet done:

Learning Unreal Engine 4
- As designers interested in the gaming industry, Emma and I will be building this prototype in Unreal Engine 4 as a method of learning the software.
Designing for players who are levelling up crafting
- In our redesign, we added colors into the recipe titles in order to indicate item rarity. However, the recipe color is currently being used to indicate how much crafting experience a user gains from crafting that recipe.
- Given the time, I'd like to research and prototype a more intuitive way for players to understand which recipes will give them crafting experience and how much they will receive.
Prototyping more information access in-game
- One of the major pain points that came up during user research was needing to reference the Wiki to find out what items crafted into which recipes, or where to find materials.
- Given the time, I'd like to research this idea further and design what it would look like to access that information in-game.