Entanglement on html5rocks.com

Curious about how we made the hexagonal tiles for Entanglement? I go into all the technical details in our case study on html5rocks.com:

This past spring (2010) I took interest in the rapidly increasing support for HTML5 and related technologies. At the time, a friend and I had been challenging each other in two-week game development competitions to hone our programming and development skills as well as bring to life the game ideas we were constantly tossing at each other. So, I naturally began incorporating HTML5 elements into my competition entries to gain a better understanding for how they worked and be able to do things that were nearly impossible using earlier HTML specs.

Of the many new features in HTML5, the increasing support for the canvas tag offered me an exciting opportunity to implement interactive art using JavaScript, which led me to try implementing a puzzle game now called Entanglement. I had already created a prototype using the back of Settlers of Catan tiles, so using this as a blueprint of sorts, there are three essential parts to fashioning the hexagonal tile on the HTML5 canvas for web play: drawing the hexagon, drawing the paths, and rotating the tile. The following goes into detail outlining how I accomplished each of these in their current form. 

And then I dive into all the HTML5 goodness. Click through to read the rest of the article if you enjoy programming or seeing how one part of Entanglement is put together.

Entanglement to be Pre-installed on Chrome 9

Derek Detweiler

Exciting news! Entanglement has been selected to be a pre-installed app on Chrome 9! Anyone who downloads and installs Chrome 9 will see Entanglement listed on their new tab page alongside a few more productive (but less tangled) apps like Gmail.

Todd Lewis

Todd and I also had a chance earlier this week to attend the revealing of the Chrome Web Store and Chrome OS in San Francisco. We were especially excited to see Entanglement demoed during the presentation as an example of running a web app offline.

Thanks to everyone who has given us great feedback in the Chrome Web Store. Your thoughtful reviews encourage and challenge us to continue making Entanglement better!

Entanglement Now in the Chrome Web Store

We have been busy further developing Entanglement to prepare for the opening of the Chrome Web Store. If you use Chrome and want to check out the latest iteration, install our app from the web store. This is a new web address and hosting service so at this time unfortunately your high scores and locally stored records will not carry over.

For the latest version we have further refined the art and audio. We also decided to add a swap tile to the Solitaire game and remove "Two Tile Tangle" since gameplay was not substantially distinct between the two. The leaderboards have also seen an upgrade with daily and weekly filters. Additionally, as an installed app from the Chrome Web Store, you no longer need an Internet connection to play!

If you don't want to install it as a web app, you can still check out the newest version by visiting http://entanglement.gopherwoodstudios.com/. Let us know what you think!

Entanglement Upgrade

We're happy to introduce the latest version of Entanglement. With a little help from some very talented friends we've made some significant enhancements to the game. These enhancements include:

• New snazzy graphics! We hope you like the new graphics because we think they look great.
• High scores tables! Logging in with your google id you can submit scores to the high score table. Find out how you stand up against other Entanglement players!
• A new scoring system. The new system gives you more points the farther your line travels in a single turn. You'll want to set up the longest moves possible to get the most points!

More upgrades will be coming in the next few weeks. We'll be sure to keep you updated as these are added. In the meantime, click the banner above to play the latest version. If you run into any problems or have an opinion you want to share, feel free to leave a comment or send us an e-mail!

Sand Trap Wins SPIL Games' September HTML5 Competition!

We recently entered Sand Trap into another competition, this one hosted by SPIL Games for their new HTML5 mobile phone portals. I had to rework quite a bit of the code from our original CGDC8 entry so it would scale to different phone resolutions, accept touch input, and run at a decent speed on such a performance-restricted platform. We placed first for September, the first month of competition! SPIL Games is hosting this monthly competition through February 2011 at http://www.html5contest.com/.

Here is the SPIL Games press release, and their US mobile web portal. Be sure to check out the other two September winning entries on the web portal as well: Block Dream by Bruno Garcia and Zombie Troops by Makar Osokin.

Conway's Pixel Invasion

Todd and I have broken away from our "Two Week Competition" model the past few months, primarily due to all the time we have been putting into our last two games. This latest "game" doesn't compare to some of our more polished games, but here's an update to Pixel Invasion I had fun working on this past weekend. It's Pixel Invasion meets Conway's Game of Life. I'm certain this has been done before, but I'm considering this to be a foundation for exploring more ideas.

I've also been playing with a new preview feature for our Facebook fans. If you're a Gopherwood Studios fan on Facebook and want to see projects we're currently working on that are not ready for a full release, check out our TOP SECRET preview page. If you don't like us on Facebook, no worries, it's not all that secret; come back in a few months and you'll probably see it around here somewhere. This week it's a sneak preview of our Entanglement app for iDevices.

Kim Komando Cool Site of the Day

Thanks to The Kim Komando Show: Entanglement is today's Cool Site of the Day! A big thanks to Kim and the rest of her team.

While I'm displaying badges, here's another for Entanglement that I never found a place to post. Chrome Experiments offered the first feedback from folks that Entanglement was indeed fun to play (as opposed to some of our earlier experimental and unfinished games).

And another badge! We have a few more days of judging for Sand Trap. Play and rate it if you haven't. Be sure to check out our competitors' entries as well!

Sand Trap

Casual Gameplay occasionally hosts a game design competition with the latest one having "sandbox" as the theme. Todd and I usually come up with our own topics and compete against each other, but we thought it might be fun to try out a *real* competition that includes *real* prizes. So we brainstormed and thought and pondered and contemplated and finally came up with a "box of sand" as our sandbox idea. Yeah, we're not too great at thinking outside of the box. (I imagine Todd is now hanging his head in shame at my pitiful pun.) Anyway, after several weeks of me coding, Todd drawing art, and my brother-in-law Clay picking at the guitar, we've created Sand Trap.

I hope you enjoy it. If you do, feel free to give us a good rating :-). If not, let us know why. Try out the other entries while you are there: our fellow competitors put together some really creative entries!

Oh, and Todd promised to mail out free boxes of sand to folks if we win! Right Todd? ...Todd?

[update 8/23/2010] Todd, looks like you're off the hook! Congratulations to Mateusz Skutnik and the other winners »

Casual Gameplay Design Competition #8

Contrary to our typical game competitions where Todd and I face-off in a furious two-week coding spree, we are now working together. At least until August 1st. We're finishing up an HTML5 game we are planning to submit to Casual Gameplay Design Competition #8. Sneak peek at right »

Hopefully our game will make the cut. In any case, be sure to check out all of the entries next week!

Perfect Score in Entanglement!

Update 2/9/11: This post is from prior to our update on how scores are calculated. At the time that this post was written, the number of line segments was the score. You can still only get a maximum of 169 line segments (the number in the center), but your score gets a bonus determined by how many line segments you can complete in a single move (the upper left number). Sorry for the confusion!

One of the limits of the solitaire game board is that the highest theoretical score possible is 169. That high score is no longer just theory: 'atomic' commented on the Jay is Games review with a screenshot of the perfect score! Truly impressive.

Entanglement Reviewed

A big thanks to all the sites that reviewed and/or linked to our latest game!

• Chrome Experiments
• Jay is Games
• Indie Games
• Gamershood
• Free Games News
• pocitace.sme.sk
• Indie Gameru
• woot!

I've been updating parts of Entanglement over the past month, some due to usability feedback (added white borders to the lines to make them clearer) and some as extra features (Two Tile Tangle). I have a few ideas for additional play modes, so check back occasionally or follow us on Facebook or Twitter to be notified when something new is added.

Entanglement

The more tangled you get, the better you'll do in Entanglement.

I neglected to stay on topic with this particular submission. The original topic two weeks ago was "trap" which produced my initial idea to do this. Our last topic was "bait", but I continued working on this and couldn't find a good way to get it to work with the new topic, so I didn't. I suppose Todd will beat me on this round.

Polar Bear Hop

The original topic for this one was "flip", but I didn't quite make it that far. The very first topic we implemented was "polar", for which I made a neat little board game I called "Polar Bear Hop". I made a few homemade Polar Bear Hop game boards and handed them out for Christmas a few years ago and posted instructions here.



One part of the game is "flipping" an iceberg over to your color when your polar bear lands on one of your opponent's icebergs. So, I thought I could make an online version with some graphical "flipping" when this happened. I didn't get to the graphical part, but I did get most of the rules implemented and a very simple AI computer opponent. Play Polar Bear Hop.

Village Simulation

Our latest topic was "village". I had pretty big aspirations for this one, but the deadline came a bit too quickly. All I was able to get functioning was this weird simulation of a village being created. You can click and shuffle huts and gardens around, but unfortunately at this point it's not much of a game.

Reverse Pacman

For the 'chase' topic, I made an odd map game where you were given 4 red guys who ran around the map until they captured all the blue guys. Our next topic was 'lost', so I took this same peculiar game and added dots - if the blue guys ate all of the dots before you capture them, you lose! After a bit of change to the graphics and color scheme, it remotely resembles Pacman. Remotely. Only, you don't play Pacman. You're a multiplicity of Blinky look-alikes.

Pixel Invasion

It's less "game" and more "game of life", but it was fun to make. This is my first try using the javascript canvas element. Play Pixel Invasion. I win.

Tower of Something

Okay, this was my entry for "strength" and then I developed it further for "airborne". The towers are strong, but the airborne cannon balls are stronger. And airborne. Play Tower of Something - your tower's name will be unique. Probably something better than 'something'. Oh, and you may want to find a friend to visit the game and play as well; otherwise the battlefield will be rather quiet.