Rapid prototyping tool

I made a tool for generating prototype cards for tabletop games.

https://github.com/zmobie/PrototypeCard

My design process includes a lot of spreadsheets. I make a spreadsheet for every card game I've ever created. The problem is that I have all these spreadsheets, and don't have an easy way to take the data from a spreadsheet, and put it in a page layout program. I've tried just doing it manually, but editing layers of gimp documents to change a 2 to a 3 and the wording of one card is a total nightmare. Any resistance I have to making a new set of cards will hinder my design process, so I needed a better solution.

I know there is some neat functionality with Adobe InDesign, but I'm not a designer or a student, so it's not economically feasible for me to buy a license for that program... so I figured... I'm a programmer, I could probably whip something up for myself.

I made a simple local html doc with some javascript that can import a CSV file, and a CSS file and generate pages of cards for you. If you use spreadsheets for cards (and don't mind learning a bit of CSS), this tool should be useful for you.

Today I printed cards for a game I came up with, played the game, made a bunch of changes during playtesting, edited my spreadsheet, and printed new cards for the next version of the game within an hour.

Instructions: Go to the above link and click "Download zip", then unizp the folder. Then you should be able to find an index.html in there somewhere... Open that up. Then you need your CSV file. Use any spreadsheet editing software and find the option to export your spreadsheet as a CSV file. (note: read the README for some formatting hints for your spreadsheet. You need to have row one be a list of all the fields of your cards. Type, Number, Damage, etc... all the other rows are the specific cards)

Then, after you open the CSV file in the little app I made, you can style it using the in-browser inspector. I use chrome and liberally use the right click -> inspect element tool. You can then add styles to your card elements. (Tip: the fields of your cards, Type, Number, Damage, etc, are the classes of the divs used in the individual cards. So adding a style to .Type will do the trick)

After you get it looking how you want it, you can save the stylesheet to its own file somewhere, and load it up again next time you want to generate some cards.

I hope someone else finds this useful. It's in a pretty rough state right now, and if anyone wants to help me work on it, please clone it on github and send me a pull request! Thanks!