I've been working on my card game, Nay Saga, more. Even though I know this was meant to be a physical game... well, I decided to create some digital programs as well to help with development!
I decided it would be easier to prototype and test by myself if I made a digital video game version. So I started with one of the versions of the game rules where you draw 8 cards and have to guess a character from the group after asking questions about the characters. I was able to get a basic version of this up and running in one day!
To start out, I wrote some basic JavaScript to prototype and test it faster, then I converted it all into RPG Maker.
I wrote a for loop to draw each card, then a do while loop to make sure the cards are random and no two cards are ever in the same set. After that, it pushes the random card into an array until there are 8 of them.
I stored some information like their Types and Traits in Classes/Armor/Skills in the RPG Maker Database so I could reference them at any time as well. Then I set up the clickable pictures with some basic prototype pictures and plugins. I got it functional where it'll give you points based on how fast you guess the character.
Then I started to think about how I plan to create hundreds of cards... and of how that PSD file would be huge to manage. So I decided I should make a program to help automate some of this! I started by creating a p5 JavaScript project to show the picture elements and then with the click of a button, compile it all, and save it as a PNG. This was a way for me to auto-generate cards. It worked pretty much how I wanted.
My next task was to figure out how to import the data. While this is a faster method than using Photoshop to type elements in, I'd still have to type data for hundreds of cards and click the button and save them out individually. I tried to import data from my spreadsheet with the information, but due to some preloading complexities with image files in p5, I wasn't able to figure out how to actually make this work.
I decided to move on to RPG Maker to see if I could solve it there. I've never saved images out of RPG Maker before, so I went on a hunt to find plugins that may do what I need. Unfortunately nothing existed that was exactly what I wanted. I found the KC_CompositeBitmaps plugin which saves out composited image files, but you can't choose the X/Y positioning of them or export text. I was also directed to the OrangeMapshotMZ plugin which can save out tileset maps but not pictures. I spent some time trying to interpret the code and see if I could combine them and update them for what I needed. I've never written an RPG Maker plugin before though, so I wasn't able to figure out how to achieve it.
So I ended up deciding to go with the Composite Bitmaps plugin for the time being. I made a workaround that would allow it to work for all of the elements aside from the character name text at the top, so I thought that I may just use a combination of importing the final card into Photoshop (or p5) if I have to. It'd still save me a lot of time that I would spend lining everything up in Photoshop.
From there, I started to build the code I needed to save out multiple cards with this plugin. I set up variables to pull data (like the Type/Traits) from the RPG Maker Actor Database and plugged those in to save out card elements based on what's in there (named character images, Types, etc.).
Then I created a loop that adds to the Actor ID variable so it'll save out all of the specified cards at once. I've tested it with 2 and it actually worked pretty well! Everything exports with my vision other than the text.
I took a break from the exporting process and came back to the playable game. I created a rough layout for elements I wanted to be tracked on screen to help with testing.
From there, I added UI elements like showing how many guesses you've done and your total points. I also added an animation for text to pop up if your guess is correct or incorrect to accompany the sound. Then I animated the chosen card for 30 seconds at the start instead of showing the text. This is still pretty placeholder, but works for now!
And then I started to think about how much additional work adding the text elements would be if I went with my RPG Maker method... so I went on another hunt to find an easier method. I started out with Dextrous. I kind of got some elements working, but I couldn't quite get the quality to match up with my Photoshop files, and had to do a lot of manual movements in the browser. So I decided to move on after a bit of testing.
I thought I might have to go back to my RPG Maker method, so I looked into how I could import my data from Google Sheets to RPG Maker. I found the official Database ConVerter on Steam. I created a bunch of new formulas in my Google Sheets to convert my data into numbers that could be read by RPG Maker.
So then I imported the data in... and had a lot of errors. I posted on forums and did a lot of searching online, but no one could seem to figure out the solution to the problem. It might be Google Sheets-related since I don't have Excel, but I'm not really sure why. It would import the data, but then make my game unplayable and remove the player start permanently from the game.
I did a lot of testing and research, and finally found a weird workaround. If I import the Google Sheets database into a dummy project, then Ctrl+C/Ctrl+V the entire Database over (in RPG Maker) to my actual project, it seems to import correctly. I'm not sure why it corrupts the data otherwise, but this is probably what I'll just have to do for now.
After all of this, I knew I still needed the data in RPG Maker for the digital copy of the game, but I was still determined to find a solution to the issues with exporting out files. I wasn't quite satisfied with how I was doing it in RPG Maker, if it would require me to still bring files into Photoshop and do manual work. There had to be a better way... so I found one. It's called nanDECK.
I was reading a lot of reviews about the software and they said it was a steep learning curve and the UI looked kinda older. I decided to try it out anyway, and it ended up working out to be exactly what I needed! It was a more coding approach and gave me much more control over positions and making edits, while still keeping the quality I wanted and everything. It has a visual built-in editor that you can use for previewing cards as you change code too, which is nice and allows for quick prototyping. I ended up making my entire card layout in there in about a day and it turned out exactly how I wanted!
It took a little getting used to, but I really like how it works. And I really prefer it being a software rather than browser-based. I will admit that the documentation is a little rough to get through, and even though the community is fairly small, they seem very dedicated. I was having an issue getting the first name and last name to position next to each other properly on the card, so I joined the Discord server and asked about it. Within a few hours, someone helped me out a ton and we got it all working!
So overall I'm making a lot of good progress! I almost split this into two posts, but it all felt relevant enough to keep in one. I'm glad I was able to get some automation working for the card generator. Even though it took me awhile to figure out the right approach, it'll automate so much and save me a lot of time in the end when I'm iterating and making a lot of big changes.