4 UX lessons I learned from Dungeons & Dragons

The Dungeons & Dragons (D&D) role-playing game is about storytelling in worlds of sword and sorcery. It shares many elements with childhood games of make-believe. Like those games, D&D is driven by imagination. It’s about picturing the towering castle beneath the stormy night sky and imagining how an adventurer might react to the challenges that scene presents.

Put simply, Dungeons & Dragons is a set of rules that allow you to play any scenario you would like. There are pre-written adventures available, but most people end up creating their own stories and characters. This means you can have a wizard riding the tube in central London, or a knight wielding a lightsaber on a distant planet, the only limitation is your imagination.

Even if you’ve never played it, you have almost certainly come across it at some point, as it’s quite ingrained in pop culture at this point.

Exciting D&D action. Stranger Things — Netflix 2016

What can all this possibly have to do with UX?

1) Roleplaying takes empathy

When you play D&D you play a character in the game world. Well, actually it is more than that. The more you play, the more you get into your character.

Early on, your character is just a set of stats and personality quirks you’ve put together from a book, but the more you play and the more your character interacts with everything around him or her (or it) the more you start to know about them. As your character becomes more fleshed out in your imagination, you might find yourself making some decisions which, to you, seem counter-intuitive, or just plain stupid, but you know that’s what your character would do because they have their own personality now.

Some characters end up having mannerisms or accents and speech patterns (which players sometimes mimic when in character). They might have an over-fondness for gold or a problem with alcohol.

Eleven’s Character sheet. Bob Al-Greene, Stranger Things — Dungeons & Dragons Sheets

This makes for a very interesting situation when you have someone who lives only in your mind, but they feel like a real person. Not only that you’re expected to empathise with them extremely, knowing exactly what they feel and would do at all times.

Rhogar and the magic shield

Rhogar, the paladin

So Rhogar was this vengeance paladin I played a couple of years ago. Basically a big righteous knight in shining armour, whose main goal is to punish evildoers and bring peace and order to the world (think Batman). He was very strong and charismatic, but not the sharpest tool in the shed.

This story is about his shield: Once Rhogar went around town looking for a better shield, but couldn’t find one. So the rogue in our party bought a normal shield and gave it to Rhogar, saying: “An old man in a hooded cloak came out of the mists and handed me this shield, he said it’s magical and destined for you”. The rogue rolled deception, and Rhogar, the handsome brute that he is, fell for it. So he got really excited and wrote “magic” on the shield in crayon.

Later on, in the same session, we are getting our asses handed to us, and need to retreat. Rhogar stands between the party and the army of undead saying: “You guys go, I’ll cover you with my magical shield”. Rhogar nearly died that day, but it was totally worth it.

Users and the magic ISAs

Last year I worked on redesigning the Investments section of the Aviva.co.uk site. We did the whole user-centred design process, with personas and research data and everything. We ended up with these neat, streamlined product pages, that focused on product features and how great our company was.

The work went on for months with reviews and workshops and demos and a lot of patting ourselves on the back before I noticed something: Nowhere did we mention the ISA allowance.

We simply assumed everyone knew an ISA is a tax-free savings account, and up to how much. For all the work that went into discovery, I failed to truly put myself in our audience’s shoes for a long time.

Like with Rhogar and the magic shield, I needed to set aside my previous knowledge and “role-play” what someone without it would do.

2) People are unpredictable

No matter how hard you try, or how neat your experience maps, user journeys and flows are, people will generally always astound you.

The best way to predict user behaviour is to expect to get it wrong. If you account for this unpredictability you will be less surprised at what you find and it will be easier to let go of the work you’ve been doing for the past few months.

Cheapskates and the armour shop

The very first time I played, I was Dungeon Master. This means I controlled the world and all the non-player characters in it. It was my job to make sure the game was challenging and fair, but most importantly, fun for everyone.I gave my players their quest and then gave them the chance to get supplies before leaving town, which went something like this:

Player: “Is there an armour shop?” Me: “Yes, you find one down the street. It has all sorts of gear you can shop.” Player: “We want to rob it.”
Me: “What?”

The rest of the game that day was them staging a fight on the street to distract everyone and the others going around the back and trying to sneak in and steal as much as they could.

This was completely unexpected, counter-intuitive even, but I thought on my feet to create the scenario and everyone had a good time.

Users and the investments shop

In the same project, I mentioned earlier, about investments which I worked on last year, something interesting happened regarding fees and charges information. Working in financial products, there’s a lot of regulatory information we need to show people, enough that it’s reasonable to expect most people to skip over the “small print”. So we put this information after the nice product features and shiny call-to-action buttons.

However, during testing users got to the product page and looked for the fees and charges immediately, as opposed to anything else on the page. They clicked the in-page navigation and jumped straight to the bottom where that information was.

Turns out, people’s mistrust of financial institutions is so great that the very first thing on people’s minds most of the time is how the company is going to screw them over. Therefore the 1st concern if the fees and charges.

Once we worked on that section to make it easier to understand and brought it up on the page to before the call-to-action, people mentioned how great it was that we were so transparent, and it actually brought confidence up.

So, the boring information and tables about tiering fees structures turned out to be very important content on the page.

3) Imagination rules

Photo by Lacie Slezak. Unsplash

The characters are not the sheets

Perhaps the most iconic image of a game of D&D is a table full of sheets of paper, dice and perhaps even hand-drawn maps and miniatures.

All that is usually on the table, but it doesn’t really need to be. All that matters is the player’s imagination and the decisions they make. Everything else is just for support.

This means there is an enormous variety of tools at your disposal, from character sheets of all shapes and sizes, even digital, to fantastically detailed 3D printed miniatures or just Lego people if you like.

The point is, it doesn’t really matter the tools you use, what matters is your character and the game, neither of which live anywhere material.

The design is not the tools

Craft Freehand — invisionapp.com/craft

Likewise, as designers, UX or VD, we have so many tools at our disposal, some might say too much even. If you want to start a project, do you sketch on paper or do you go straight to the computer? Do you use Sketch, Photoshop, UXPin, Figma, Axure or anything else? How do you prototype? Do you go with InVision, Marvel, Adobe UX? We love to fight about our favourite tools and everyone has their own opinion.

My point here is that it’s so easy to lose sight of what’s essential. Regardless of what you use, our craft isn’t in those tools, or how proficient we are at using them.

4) To each their own pace

When designing user journeys at times we tend to hold on a little too tight to the user. In my experience it’s all too easy to design a user journey with every step meticulously thought out, thinking of the user’s as the perfectly logical beings that exist in math problems. This is how mapping is taught and it’s usually the right thing to do, but it can become patronising or even stifling.

Especially when designing websites, which are very open by nature, I’ve found it helpful at times to provide a more flexible user journey.

The mysterious city map

One adventure I ran was set in modern-day London. As the players were drawing close to the final confrontation with the big bad, I wanted to direct them to the London Eye for the final showdown.

However, I didn’t just want to hand it to them. So I had them find a list of 5 addresses, all somewhere in central London. As they visited each of them, they found elements to connect them, so they started to mark them out on a map. Much quicker than I had anticipated, they realised they made a pentagram over the map, with the London Eye dead in the centre.

My trust in them paid off, as they figured it out for themselves. Also, I had no exact plan over which order they completed the task in, or how they went about it. I simply provided them with all the information and let them figure it out themselves, at their own pace.

The flexible journey map

User journey mapping — Daria Nepriakhina, Unsplash

Likewise, users are capable of more than we sometimes give them credit for. Or that order of operations we carefully thought out and signposted very clearly to the user is disregarded because it just doesn’t make as much sense in context.

I came across an example of this when I was designing the financial product pages for Aviva. Because financial literacy is not only quite low in the general population, but there is a lot of mistrust of the institutions, we came up with this educational content hub, where we would explain all the basic concepts such as investment risk, and what a fund is. We already had a lot of this content, but it was unstructured and felt overwhelming to read.

So individual articles were created, divided into categories numbered from the least to the most complex. Each article page had a stepper at the top and a carousel of the other articles at the bottom.

Also, for each article the user read, the card for that specific one would have a checkmark on it, marking it as completed. All this was to encourage people to read through all the articles and learn about investments and pensions.

However, upon testing it, people tended to skim over the hub page and focus on articles out of order, according to the level of knowledge they thought they had. The information architecture still helped them find the information relevant to them, but they didn’t see it as a learning experience they needed to go through fully.

So I removed the progress stepper and the checkmarks from the pages. I left the carousel in so, in case they were linked to that page from somewhere without the context of the hub page they could still understand this was part of a larger whole.

Turns out, people didn’t need that much handholding, and would rather explore the information themselves. So the best UX, in this case, is simply to facilitate that exploration without being overbearing, empowering the user as opposed to railroading them.


As UXers we are constantly surrounded by learning opportunities in our lives. I’ve learned quite a lot from playing D&D, and I’d recommend you to try it out.

Originally published at goncaloandrade.com on April 16, 2018.