BloomingLate

I recreated a card game ("Set") in HTML, CSS and Javascript

Recommended Posts

UPDATE FEBRUARY 7

Here is a download link (select "Download all/everything" to get a zip file) for people who do not have an account: https://drive.google.com/open?id=1rgHFBD_guHkzvbAjFKTxaAeon2Sd0GEh

Updating the attached .zip file with the latest version, which is also smaller due to the removal of an unused image that was adding much to the weight.

---

My wife and I are somewhat into board- and card games (I more than her) and it was she who introduced me to a game called Set. In this game, all players compete simultaneously as they try to combine cards based on two simple rules: three cards either have any of their properties all the same, or all different. The game contains 81 unique cards that each has the property color, shape, amount and filling. It is a pretty fun and challenging game that requires quick thinking.

To make a long story short: I was thinking about strategies which lead to asking myself how many possible combinations could even be made with any given card. That quickly led to summoning  the aid of the computer and within the month I managed to recreate the entire game in HTML and Javascript. Though it was a massive distraction from my musical projects it was a welcome distraction and one that stimulated my mind and my problem solving abilities. It was a good exercise in patience, planning and perseverance (I tend to burn out half way through projects or get stuck in an endless loop of restarting from scratch). So I'm appropriately proud of this little achievement and would like to share the end result with you.

You can find the game attached to this post as a zip-file.

It is a .zip file containing a simple folder structure, some images, documentation etc. Simply download, extract and open the html file (same_difference_game.html) in your web-browser. Full screen mode is recommended. Refer to the in game instructions on how to play (immediately visible after passing the Title Screen).

I should note that I have done some testing and the game should be fully armed and operational. That said, I have not tried it in many different browsers. I can successfully run it in Firefox and MS Edge seems to work too. So I would recommend going with Firefox for now.

I'm currently looking into how I can turn it into a Desktop application, but I should probably get back to my musical projects first!

Enjoy the game, and let me know what you think! If you catch any bugs, please let me know.

same_difference_preview.jpg.f63a8d8e7c395db25702976442640a99.jpg

 

Same Difference (february update).zip

Edited by BloomingLate
Updated version and included download link for non-registered/logged in people

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.