I’ve always been fascinated by dense data visualization projects. I’d wanted to try my hand at designing tools like Warcraft Logs. So when a tool cropped up in a gaming community I was a part of (Guild Wars 2) I reached out to see if they needed any help with the design. The small team of developers was very welcoming and excited to have me help improve the visualization of the site.

The general idea with these types of sites is a way to gauge performance in a massive multiplayer game. They spit out massive amounts of data and it’s the interface’s job to help the player understand what would make them perform better next time. Having used these tools for years, ingrained into the community using these tools I had a unique perspective to bring to designing them.

My Involvement

• UI/UX Design
• User Flows
• Branding
• Design System
• Logo Design
  
• Front End Development
  
• Information Architecture
  
• Community Engagement
• Accessibility

My first step was to do an interface audit. This was mostly to start the conversation about what I felt needed to be fixed and to see where our constraints were with this project. This gave me a good idea of what I should focus on. Where the big wins would be without breaking the all-volunteer team’s bandwidth.

I carved out a two-step approach. First some quick wins to get me familiarized with the system. These were quick typography changes and color adjustments to help with the legibility of the data in its current structure. The second step was to rework the visualizations from their core, which would take considerably more time and effort.

After the first step was done I got to work on foundational pieces: Design system and branding. If this project was going to have longevity getting this stuff set up now would be key for its success.

Once we had that foundational layer, which went through a round of feedback from the team, I started developing the front end. I worked with the back end developers to inject the correct data into the new designs, slowly and steadily transforming the application into a more usable and enjoyable experience.

We launched the new design to the community. Traffic to the site increased 112% during the launch week and remained about 25-50% higher after the initial buzz died down. We also launched a Patreon to help with funding the site as the primary creator was paying a large amount every month simply to host the site for the community.

Along with the launch we received a fair amount of feedback about usability of the initial color scheme. Many felt like it was a lot of cognitive overhead to remember which color applied to which percentile. So we quickly rolled out a better primary color scheme which had a steady color gradient making it much easier to understand percentiles at a glance. Along with this we rolled out the option to change the color scheme even introducing a scheme for color blind users. With this slight tweak the community openly embraced the new design.

We rolled out several more features including leaderboards for the more seasoned players to compare times.

Sadly the project was always plagued by a high hosting cost. While the folks who contributed via Patreon helped it was never enough to break even and the founder simple couldn’t continually to operate at a loss, especially with the waining support of this gameplay mode from the game developers. Eventually the team moved onto other projects and the site was shut down.

The experience of working with this type of project helped my hone my data visualization muscles and I’m still proud of what we were able to create as a little side project.

Let's make great experiences together

Pasadena, California
andrew.richardson.j@gmail.com
@AndrewR_Design

© Andrew Richardson 2021