Embedded Files
Welcome everyone, to a new AToM update! Today we'll be talking about... Getting framed!
This is going to be a long one, so if you're interested in the ins and outs of frame choices and design, stick around!
Otherwise skip to the end to see the new (hopefully final?) card design!
Framed!
Framed!
Like many others in my position, making a game for the first time, when I first started making Apotheosis... I had no idea what I was doing! I only havea little bit of an idea now, to be fair, but that little is way more than the nothing I knew when I started!
Among the many, many, things I needed was a card frame. Stands to reason... making a game primarily about cards... Kinda going to need a frame for said cards, right?
So... What's in a frame? A year or so ago when I first started making my game a real thing my answer was "...I have no idea! Borders...?". On top of that I hadn't done visual design of any kind in about a decade at least, and even then it was more heavily free style hand drawing more so than vector art or graphic design of this kind. So I was well and truly lost.
For a more experienced designer that might not have mattered. Who cares, move on, figure out the details later, right? True, but for someone in my position at the time I felt I needed a frame to start "grounding" my design into something real, something I could put some placeholder art in, do some decent looking computer-based prototypes that I could print and take to playtest, show off, etc... Bring it out into the world.
So I reached out to a friend of mine, Jeanine Stette, to make a frame I could use.
...I gave her nothing to work with, direction wise, besides something along the lines of "Fantasy card game about mages dueling. With magic. I need space on the top left and bottom right for numbers, rules and flavor text around the bottom half to 2/3rds, a title up top...Highlight the art, that's the center piece". That's not a lot of information, especially given she had never card frames before. No real guidelines, color scheme... I mean, I had no idea what my game's aesthetic even was at the time.
But she delivered beautifully.
Frame 1
Frame 1
It's a pretty nice frame. It hit everything I've asked her: The focus is on the art, it has space for all the elements I asked, fairly minimalistic, it highlights the art, has a nice feeling of magic and fantasy, and even the little details it does have, like the "arcane", kinda alchemy-looking tiny details on the top right and bottom left that act as slight coutnerweights to their opposite numbers.
I'm quite fond of it. And for a year that's been the frame of my game from prototype with sketchy placeholder AI-art, to displaying Singhakawi's temporary blockouts and through several of the beautiful final renders.
I've cut around this frame hundreds of times to create and test new prototypes, and I've played it thousands of times.
And as we slowly approach the production stage, it meant looking into producing "real" prototypes (mostly just been sleaving paper prints on top of other playing cards of similar size), as well as industrial printing for commercial production.
...And then we hit a few snags.
Original frame
Card template provided by The Game Maker.
Sizes and limitations
Sizes and limitations
Before anything else, I'd like to point out I chose to make this game in standard poker card sized card, with rounded corners, for a simple reason: it's kind of the industry "standard", and as someone who has played a lot of TCGs before, I thought it would be nice if you could use your standard sized sleeves, deck boxes, folders and everything else you might already own, for Apotheosis too. I know I will.
So, anyways, first time I noticed something "off" was not too long ago while making my "nth" batch of test prototypes - again, by placing paper printouts over a normal poke sized card, I suddenly realized that boy...the edges of the print out sure do stick out! Not a lot, but enough that after rounding the corners we'd be cutting a bit close to the numbers "circles" on each side.
Alright, might need a tiny adjustment, but that's fine...
Also, minor nuissance, when I comissioned the frame I totally forgot to ask for some kind of space at the bottom to put some info like artist's name, copyright, etc. Usually the "details" you don't need to be big but want somewhere on the card.
Well, all the art is done by one artist! Just credit them in box and booklet right?
...Well, what if I get the chance to print different editions with different arts? I mean... I could deal with it then, I mean, it's not a given that'll happen even, but... that would be messy, and it would really suck if my original artist, the one that's making the permanent base version real, wasn't credited on the cards...
"But wait, there's more!"
While researching the requirements of physical industrial printing I've come accross the concept of "bleeding" - extending the frame slightly past the cut off point to guarantee any tiny innacuracies in cutting ... Uh oh... We... Don't have that...
In fact the frame here kind of has a "hard edge" type thing with the beveling effect. And I think that looks neat... But if the cutting isn't perfectly precise then yeah, the effect is ruined.
...Uh oh... That's... a bit more... critical...
The coup de grâce however, would come here:
The overlay is provided by The Game Crafter, but the measurements are overall industry standard.
The blue outline there is the "DON'T PUT ANYTHING RELEVANT OUTSIDE THIS LINE!"
...Did you spot the problem? Yeah... My entire frame and like a third of my card's cost and speed markers are outside of that line...
...This might have been really important information to give the artist who made the frame before she made it...
...Oops. My bad.
This suddenly meant I did not, in fact, have a functional card frame.
I needed a new frame.
I COULD commission another frame... But that would be an unexpected hit to the budget, and... well, things are a bit different now.
Since I started this project I've been brushing up on graphic design. I'm by no means an amazing graphic designer now, but I've gone from "completely clueless, what the hell, how do I draw straight lines in this thing??" level to... actually having a bit of a clue.
I've also since been designing and redesigning the card back as I learn and improve my technique, which, along with the art and theme coming together, also has given my game a bit more of a graphical identity to work with.
Suddenly I'm not just floudering around for where to even start. And I do like doing things myself when I can...
Alright, let's do this I guess!
...Oops...
First steps
Reframing the issue
Reframing the issue
Ok, so, where to start?
Again, I am happy with the general frame, so I think we can keep the general concept of the frame, but start by changing the framing dimensions and spaces. Move all the elements inside the "safe zone", and to keep things simple in cutting and bleeding, turn the border a solid colour so we can extend the edge as much or as little as needed for printing - And if it's going to be one solid colour, no gradients... Black border. Old school TCG player thing I guess.
I messed around with different types of "buttons" and otherwise round shapes for the element holders on the top left and bottom right, mostly just to get a "feel" for it while deciding the rest of the elements. General shape and size felt mostly alright, so good enough for now.
Now, I knew I wanted some ornamentation on the sides that also kind of connected or flowed into the title at the top... But I wanted it to be relatively small, so as to not cover up the art as much as possible.
...This is the point where I went deep diving into card frame designs from the giants like MTG's 30+ years of card frames history, to the more obscure ones like Decipher's Lord of the Rings: The Fellowship of the Ring trading card game from 2001 (I own the Aragorn starter deck! Don't think I've ever played it!)...
After hours of research, I started sketching.
I kept thinking about a line my wife said to me when I was discussing my game. To paraphrase:
"The magic in your game doesnt feel like it comes from the ground, from nature. It feels cosmic. Universal."
I agree. Magic in AToM is closer to something that permeates the universe. Mana exists in the same way that molecules do - it's just part of the universe. So I started thinking universally. Geometrically.
So, I knew I wanted thin lines and relatively simple, because I wanted the frame to highlight the artwork, not compete with it. Just a little something extra on the side to frame your view.
I also knew I wanted to borrow the repeating diamond motiff I used in the new card's back.
I quickly arrived at an almost lightly art deco-inspired design, of simple parallels that overlap and intersect in the corners.
Sketching and experimenting
Early lateral design
That settled, and after some minor experiments with the text box, honestly... It was just a lot of minor trial and error, experimentation, and overall small adjustments. Once I settled on the overall design it was more of a matter of finding the exact proportions and details.
Once that was settled... Just a matter of re-adjusting everything, and then adding the elements I was missing, such as artist credit and copyright information.
Finally... I was about to call it done, when I thought.... Hold on. My game has very few cards... I have an oportunity here.
A big "rule" of card game visual design: keep the most immediately relevant information in places where it's easy to see when you're holding a bunch of cards in your hand.
... I had some "empty" space on the opposite quadrants of the frame to the cost and speed... What if I added a small round element there, to visually counterbalance the cost and speed elements, but instead of just some ornament it was a small icon that represented the card...?
Because while my game has a fairly small number of total mechanically unique cards, it does make you hold a slightly bigger number of cards in your hand than your average TCG (10, in this case). A slightly more experienced player could simply look at the top or bottom edge of their cards and immediately know which one it is, which would make scanning for the right cards just a tiny bit more convenient, while also adding a little unique quirky element to each card.
And just like that, minor adjustments aside, we were done.
So ladies and gentlemen, without further a do... The current look of Apotheosis: Tournament of Mages:
Front side
Back side
See you all next time!
Page updated
Google Sites
Report abuse