Added mobile compatibility. (it’s not perfect, but it works)
Finished all card elements (including strengths and weaknesses)
– Thanks @pfm for the type info.
Original Post
Hello, everyone. I got inspired last night to create a website that allows you to make your own Alpha Prototype inspired cards. I was getting tired of manually moving things around in Photoshop and decided it might be easier to code this. The site is not fully completed (missing the very last section of the card), but I’ll try to keep working on it later this week.
Images I’ve had success with have been over 500x500 pixels. When using something like sprites, I like to scale them to 560x560 and then do some cleanup.
Here’s an example of Scyther that I created since no Scyther Prototype exists.
If you plan on implementing the typings, here is what they are:
草 - Grass
虫 - Bug
水 - Water
火 - Fire
電 - Electric
幽 - Ghost
飛 - Flying
地 - Ground
闘 - Fighting
超 - Psychic
毒 - Poison
竜 - Dragon
[blank] or 無 - Normal
The above are found on the actual prototypes. Normal types use a coloured blank circle but the later playtests use 無
氷 - Ice
岩 - Rock
鋼 - Steel
悪 - Dark
The above are offical.
Fairy has no official Kanji, it’s フェアリー (literally, “Fairy”). The japanese word for fairy is 妖精. You could use 妖 but that might more closely align with “spirit” than anything else.
Thanks. I knew the grass one, but wasn’t 100% certain on the rest. I’m thinking about adding a dropdown so people can select which one they want. I’m just tripped up on how to let people pick the number of them per move. Might be some weird JavaScript I’ll have to write.
I should probably add a link to Google Translate on the page so people can more easily add their own text. A lot of people might use the default which is text I translated about myself.
This is a really cool tool that you’ve built, thank you for sharing
If you’re interested in adding a dropdown pokemon select feature, I can give you a folder of the sprites, if not no worries.
Thanks for the offer. I may take you up on it in the future, but for now I might keep it URL based. I really tried to ensure nothing about the site related to Pokemon to protect the repo from a DMCA take down. I don’t think they’d take it down, but I made sure I used nothing of theirs and didn’t even use terminology like “Pokédex entry”. Even my fake data (moves, descriptions, etc) is made up.
I do appreciate the offer and can see how this might make the site harder for others to use. I’ll possibly add it in the future or I’ll share my repo here and let someone fork it to make that addition to their copy.
You can either fork it to your own GitHub repo, or you can download the files as a zip and then play around with it locally on your computer. Messing around locally might be easier than learning how to use GitHub to fork, make changes, and the sync them.
Good luck. Let me know what you create. I leaned heavily on ChatGPT to help me with the JavaScript. I’m more familiar with HTML and CSS.
