Skip to main content

Indie game storeFree gamesFun gamesHorror games
Game developmentAssetsComics
SalesBundles
Jobs
TagsGame Engines

First video devlog, and the card layout problem it did not solve

A topic by Tkayyy created 12 days ago Views: 104 Replies: 2
Viewing posts 1 to 1
(1 edit)

Put up my first video devlog this morning. Three months of a creature card battler that started as handwritten index cards in penny sleeves on my desk, through a tabletop sim so people who were not in the room could play it, then a C++ rules engine that plays the game against itself, then the browser build, then the first commissioned paintings.

It is about four minutes. Making it was its own strange milestone, and also a moment to quietly cry that i've sold a part of my soul to be a blogger to try and market this project.

The reason I am posting it here rather than just leaving it on my page is that making it forced me to look at three months of card faces in a row, and I came out of that with a problem I still have not solved. It is barely in the video because I only really understood it while cutting.

Something happened on the way to the rendered version that haunts me a bit, just because the _v1 of the cards were handwritten. Name at the top, the die and its rows down the middle, whatever the card did underneath. No layout, no grid, no flavor, just my handwriting and however much room was left.

The rendered face is better in every way I can measure and slightly worse at its actual job, which is being read from across a table (from a screen) without clicking on it.

Two things I think I lost.

  1. The die rows used to be one column of handwriting, so your eye ran down it in one pass. On the rendered face every row sits in its own little box. Tidier. Slower. The box edges give your eye somewhere to stop, and it stops at all of them. I built a grid and then had to look at every cell in it.
  2. The other one is worse because I did it to myself. Handwriting had no room for a paragraph, so an effect had to fit in about six words. The rendered version has room. So the effects got longer, and the flavor i was so excited to add in made it too. I don't think they got any clearer, just busier.

The part that actually stings is how I found out. I printed the current roster to test a balance change, sat down with the paper copies, and read my own cards faster on paper than I read them on the screen I spent weeks on - oof...

So I have started pulling things back out. Flavor text is off the face for now, which hurt after how pleased I was to finally have room for it, and I am redoing how the card shows which delegation a creature belongs to. Both are out with a few friends for feedback and I do not know yet if either is right. That is probably the next video.

The layout itself I haven't fixed completely. Next pass is going to put one column against boxed rows in front of actual people at actual table distance, instead of me at 200 percent zoom deciding it looks fine. 

So the thing I actually came here to ask: do boxes around numeric rows help at table distance, or is a box only ever helping the person who laid it out? I have gone back and forth on this for weeks and I have never been sure either way.

And if anyone has a card game whose cards you could read across the table without picking one up, I would love to know what it is so I can go look at it!

Here's a preview of the changes i've made so far featuring the next completed card art: 

(+1)

Your comparison image contains the experiment, so I measured it instead of guessing.

Both cards render 775 px wide. I blurred them progressively — Gaussian sigma as a stand-in for distance — tracking how far the box stroke stands proud of what is either side of it, against how far the ATK numeral stands proud of its background.

v4, stroke 3 px (0.24 mm on a 63 mm card). Prominence 64 at sigma 0, 17 at 2, 5 at 3, 0 at 4. The numeral is still at 106 at sigma 3 and 70 at sigma 6. The outline dies about three steps before the number it surrounds.

v5 splits it. The green stroke dies identically — 13, then 0 by sigma 3 — but the dark fill behind the stat panel holds a 53-point step out to sigma 8, flat.

So: a box drawn as an outline helps the person at 100% zoom. A box drawn as a tone step survives as long as the digit does. You already made that switch, whether or not you meant it as the answer.

No table-tested game recommendation from me. I sell UI asset packs on itch, so weigh that.

Thanks for actually measuring, that's the most useful reply I've had.

You're right about the outline. I checked and the thin green line vanishes long before the numbers do.

But I don't think the box is why the new one holds up. The panel is nearly the same dark on both cards. What changed is behind it: the old one sits on a dark background, the new one sits on a bright road. That gap is doing the work.

Which means it breaks on dark art. A lot of the roster is night scenes and dark animals, and those would look fine up close and disappear from across the room.

So the panel probably needs to shift with the art instead of being one fixed color - worth a test but thanks for helping me see it!