OLO: An Experimental Touch-Based HTML5 Game

Up front, I’d like to admit that I’m no coder. My knowledge of HTML is rudimentary at best – simply formatting tags for text often give me a run for my money. But I like to think I can recognize when something really cool is happening in the web development space. I remember watching one of the first demonstrations of HTML5 a while back: Google had changed their homepage logo (as they sometimes do) to a cluster of floating bubbles that reacted to the position of your cursor pointer. I was really impressed by this, because it was the kind of thing that typically required flash, or some similar technology. The implications of this were huge, particularly for flash-like functionality on iOS devices.

OLO is a simple, web-based, two-player game designed with CSS3 and HTML5 by the folks at Sennep. It is meant to be played on a touch device–the same webpage that will execute the game on a touch device is simply instructional on a desktop browser. In addition to playing in the browser of your touch device (for my tests, I used the iPad), you’re invited upon visiting to add a shortcut to the page to your home screen, which enables offline play.

How To Play

OLO is best described as a variant of games like shuffleboard or paper football. The object of the game is to end up with more OLOs (your round playing pieces) in your goal than your opponent. Each player starts out with six OLOs, taking turns attempting to flick them into the zone between their goal lines. That’s it…I wasn’t kidding when I said the game was simple!

The starting player is chosen at random.

The starting player is chosen at random.

There are a few things that make the game a bit more interesting, however.  OLOs can be knocked out of the goal zone (think Bocci ball) with other OLOs.  Combined with the fact that there are three sizes of OLOs, and that the bigger ones travel with more power and momentum, this is ultimately where the strategy comes in. Say you’re trailing behind, and your opponent as a small OLO in their goal near the center line. If your next move is a large OLO, you have the potential to knock your opponent out of the scoring zone and score a point for yourself with one, well aimed flick.

A game in progress.

A game in progress.

One last “catch” to the rules of the game is that OLOs (from either side) can be reclaimed by either player. The zone on the edge of the screen, where you flick from, is called the Home. If an OLO stops in that zone, say, from overshooting the scoring zone, that player reclaims that piece and can use it again.

Touch the center line to display the score.

Touch the center line to display the score.

To keep track of the score, touch the centerline of the game board. Play continues until all of the OLOs have been used. When the game is over, the player with the most OLOs between their target goal lines is the winner.

The end of the game.

The end of the game.

What It Means

As I mentioned above, I’m not a web developer, so I’ll abstain from trying to comment on the more technical aspects and implications of HTML5. However, from the perspective of someone like me, it’s easy to see that the new(ish) technology is changing the way we interact with the Internet. If you examine the history of the nature of webpages from the original proliferation of the Internet to the present, it’s easy to see that we’ve moved (and continue to move) through a change from static pages of information to increasingly interactive experiences.

OLO may be just a game, and likewise a simple example of the way HTML5 continues to change our interaction with the web. However, it’s implementation makes clear the fact that evolving technologies and web standards are breaking down the walls between what we consider to be native applications and web applications. After adding the shortcut to my home screen on my iPad, OLO was indistinguishable from an app I might have downloaded from the App Store.

In the spirit of promoting the developer, as well as sharing some really cool stuff, I would encourage you to visit Sennep’s R&D page to see some neat interactive “toys” they’ve created using the same and similar technology to that of OLO.

Conclusion

OLO turns your tablet (or other touch device) into a multiplayer game surface. It’s a joy to play, and while it makes for a good time waster (like playing paper football while waiting for my food at a restaurant), it is also frustratingly addictive. The game is fun, simple, and well executed, but perhaps the coolest part is that the game is designed in such a way that you are playing the Internet.

OLO was designed to be played by visiting the webpage on your iOS device, but can also be downloaded from the Android Marketplace. The developers also welcome any feedback on how the game functions on other touch interface devices. Admittedly, I’m curious if any of you have tried playing OLO on a non-iOS device.

Have you, dear readers, played any great web games (or seen any great HTML5 implementation) lately?

 


Summary

OLO is a simple, browser based HTML5 game designed for touch interfaces.

10
theatre-aglow
theatre-aglow
theatre-aglow
theatre-aglow