Design, Gaming

Guild Wars 2 CCG – Part 1: The Concept

Introduction

The idea to make a Guild Wars 2 Collectible Card Game came last year, while playing Hearthstone I wished a game like this existed in a world I was a much bigger fan of; Guild Wars. I took a look online and someone had done it for Guild Wars 1 10 years ago, I knew I wanted to make something really special and fun that people might actually like to play. I had to start with the concept.

 

A Bit of History:

Like most people I collecting cards as a kid, I started with Pokemon and Yughio battling friends in the school playground. I had not played a card game other than Uno for many years until Hearthstone came out. I will admit I’m not that great at Hearthstone but I do enjoy playing it and that’s what matters. I played WoW and Guild Wars for many years as a teenager and I had a lot of fun in both games for different reasons.

I played Wow from just before Burning Crusade came out, I was a Troll Mage and had a blast raiding the enemy cites and ganking people out in the wild. I raided every week with my guild and was firmly planted in the gear grind, I left the game just before Cataclysm came out and didn’t look back. I never really got into the lore like I did in Guild Wars, They both have so much lore but there was always something about the Guild Wars Lore and Game that I fell in love with.

 

wow-roamy

 

Guild Wars was my first MMO, my first RPG, I don’t remember how I heard about the game or why I started playing but I got the game not long before Factions came out. To this day my main character in Guild Wars 2 has the same name and looks very similar to that original character. A Warrior named Light Templa. I split my time in Guild Wars 1 between PvP and PvE, I did a ton of Heros Accent and Guild vs Guild in Pvp. While in PvE I loved doing Under World, Domain of Anguish and flipping Ectos in the Temple of Ages.

 

gw1-lighttempla

 

I probably spend the same amount of time in Guild Wars 1 as I did World of Warcraft back in the day, but Guild Wars was always home. That’s why even with my busy life I still make time to play some Guild Wars 2. Anyway, back to the cards.

 

The Concept

The concept could be simple, I could copy Hearthstone 100% and design some new cards. In-fact that was my original plan, but when I started wire framing and thinking about the game play I wanted to make it feel like the Guild Wars world. So I started doing more research, looking all a ton of existing CCG games, the style, cards, game play and reading forums on people opinions on CCG game mechanics. Especially the parts they loved and hated about card games.

 

ccg-card-research

 

After figuring out what they all had in common as well as thinking about what elements I wanted In my game, I had a list of elements my card would need.

  1. Name
  2. Special Card Text
  3. Image
  4. Card Type
  5. Card Rarity
  6. Health
  7. Energy Cost
  8. Damage

 

With this information I started to wireframe as well as try to improve upon all the other CCG cards out there. I realized pretty quickly that Hearthstone did an amazing job with their card and game layout. Hearthstones cards are very easy to understand, Health, Damage and Mana are the easiest to read and rightly so. The cards and the game itself feels physical which just feels so right, the cards have depths and weight which interact with the board and other cards. The layout of the other elements like name, specialty text and rarity doesn’t really intrude on the information you need most. No other CCG has done card as well as Hearthstone in my opinion so my challenge now was to design something better than hearthstone and tie it into Guild Wars.

 

wireframes

 

Design is all in the process

 

The Layout Design

As you can see above I tried a lot of layouts, this is just 2 pages from a book I was drawing in out of 4. I used the method I would use when designing a logo or UX/UI for a website. I start with the basics and draw as many versions as I can/want, from there I keep what I like, remove what I don’t and try to improve on each iteration.

Design is all in the process, you sometimes see a logo, it looks so simple and you think “I could have done that” It’s true you could have done it, but always keep in mind the long process that went into what looks like something simple.

hearthstone2

 

Hearthstone was the benchmark for the card design or me after researching all the different CCG card designs out there. So how you improve on something, so simple and good. You ask questions:

Q: Does the card layout make total sense? A: Yes, But. Mana is the biggest icon here, when damage and health are equally if not more important than Mana. That being said, in Hearthstone, the Mana icon is remove once the card is on the board.

Q: Do the locations of the icons make sense? A: Yes but they could be better, I mean Attack is the forward facing ability, in Hearthstone a cards attack animation strikes above itself, if the attack number was at the top of the card this would make more sense. Also the health icon is tied directly to the thing we are looking at (image) it would be nice if they where closer together.

After considering a lot of layouts here is the directions I headed.

wireframes-2

 

I felt like I was making some real progress to something of an improvement but it still felt a little too much like Hearthstone. I needed to try something else, and I wanted to make it more obvious of the attacking and tie that into the card more.

 

wireframes-3

 

This Design layout felt strong, the attack number is obvious and the attack direction ties into it well. The health number is right at the foot of the image and the name is wrapping around it, giving it a nice personal feel. Below that you have the image type, specialty text and mana at the bottom.

 

The next phase is high fidelity design which will be in Part 2 of this blog post.

Thank you for reading, please leave any comments if you have any.

Luke Dowding
I’m a UX/UI Designer & Web Developer from the UK. I’m Vegan, love Cycling, Running, Gaming and F1. Aka: Roamy