Why Use HTML5 For an Exhibition Game?

Web based HTML5 gives you the option of using a game across different devices at exhibitions/events. For instance you might want to set up your game on a PC with a large touch screen at one event, but scale it down to mounted iPads at another. It also gives you the added option of having a public web based version of your exhibition game with minimal changes if you wish, to help with your other marketing activities. Conversely, if you get a web based HTML5 game produced for a marketing campaign, you can easily get some slight modifications made to use it at a trade show on standard PC hardware or tablets.

There are a couple of different options for setting up a simple DIY interactive kiosk to use an HTML5 game at an exhibition, trade show or event. I'm going to try and cover the other (using mounted tablets) over the coming weeks/months. For now let's concentrate on using a PC...

What Hardware Will I Need?

Any PC with a screen (and input devices) connected can be used to run your HTML5 game on an exhibition stand. This setup also give you the greatest flexibility. You can choose the size of screen. Anything from a modest sized desktop screen right up to a giant touch screen display built into your exhibition stand, the choice is yours. You also get a choice of input devices, usually a touch screen or joystick/gamepad for more arcade style games. Although mouse and/or keyboard is out, for reasons I'll get to shortly (and in any case probably not right for game controls on an exhibition stand anyway).

Although most simple 2D games don't need a state-of-the-art games machine to run, I'd always recommend you test and set up the game on the actual hardware you'll be using at the exhibition well ahead of time. The last thing you want is to get to the trade show (with limited time on the morning of the first day) and set up for the first time. That's asking for trouble. So make sure you take a bit of preparation time to set up your game before the event, to make sure setup is stress free on the day.

Remove Physical Access to Hardware

The PC itself and any physical peripherals/input devices that would allow players to quit out of your game should not be accessible. Move them out of the way, lock them away, whatever you have to do. Any input devices and peripherals (anything players don't need or shouldn't have access to) should be disconnected from the PC altogether, where possible. If you need to connect a mouse and/or keyboard to set the game up on the PC, only connect when you need them and disconnect again afterwards. The only input devices accessible to the public should be the ones that they need to play the game (usually either a touch screen or gamepad/joystick).

It's also worth mentioning that any gamepads or joysticks you intend to use, should have some sort of secure mount on your exhibition stand. The last thing you want is for your controller to go walkies 10 minutes into the first day.

Use a Clean, Dedicated Machine

I'd also strongly recommend that you use a machine with a fresh, up-to-date install of Windows. Again it's about stripping the PC down to the bare minimum that's needed to run the game. No extra software that's surplus to requirements should be installed.

Under no circumstances should you use a regular in-use work PC for this. If a player does somehow manage to get out of the game and get access to Windows, you don't want them having access to all your sensitive files.

Windows 10 is ideal, as it's best equipped to set up and use touch screens and lock down the operating system for HTML5 games. Once we get to the details of setting up Windows, we'll be assuming we're working with Windows 10.

Don't Forget Power

Obviously, you need to make sure the PC you have the game set up on has sufficient power as well. If you're running all day, just a laptop with one battery pack isn't going to do it. You'll need either mains power or sufficient battery packs to last the duration.

Also, make sure any wireless, rechargeable input devices have sufficient charge to last the duration of each day of the trade show and you're able to recharge them in the evening. If you're using a gamepad or joystick that needs charging, make sure it's fully charged and consider having another fully charged spare on hand just in case.

Internet Connection

Usually you'll need a live internet connection on the PC you'll be running your web based HTML5 game on. Features like scoreboards, data capture forms etc. usually rely on server-side scripts and storage. So again, check in advance that you'll get access to Wi-Fi at the exhibition, if not you'll need to organise some other way to set up your game at the exhibition.

It doesn't generally need to be particularly fast (for scoreboards and data capture we're talking about transferring tiny amounts of data), but it does need to be there and not dropping out all the time.

Running in Full Screen Mode

You'll need a full screen mode button incorporating into the exhibition version of your game to enable this mode via the HTML5 fullscreen API. We do this anyway in all the web based HTML5 games we create and it's fairly easy for your developer to add one.

You'll also need the exhibition version of your HTML5 game to automatically disable any in-game buttons you don't want players to have access to while playing in full screen mode. The most important being the full screen button (so once the game is up and running in full screen mode players can't quit out of it). You might also want to consider disabling any settings controls, pause and mute buttons to keep the game running consistently throughout.

Stopping Players Accessing the Operating System

You need to make sure your PC is set up properly to lock it down. Otherwise players will be able to exit out of your game into Windows to mess with things they shouldn't. On PC this will require changing some Windows setting and utilising Google Chrome's "Kiosk Mode".

Again, once you've locked the machine down, test thoroughly to make sure there are no ways to quit out of the game using any of the input devices that will be accessible to players.

Setting up Windows 10

Google Chrome Kiosk Mode

I'd recommend using Google Chrome to run your HTML5 game at a trade show. It provides the best support for touch screens and other input devices and avoids some quirks that make some of the other browsers less than ideal for running an HTML5 game at an exhibition or event. It also provides a built in Kiosk Mode. This allows you to set up a shortcut to open your game directly in windowless browser mode.

First of all you'll need to download and install the latest version of Chrome, if you don't already have it.

Right click in a directory where you want to store your game shortcut and select New -> Shortcut.

Click "Browse" and find the Google Chrome program file (usually at "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe") then click "Next".

Give the shortcut a name, then click "Finish".

Right click the shortcut you've just created and select "Properties".

Edit the "Target" field and put --kiosk followed by the web address of your game, after the last quote marks of the existing text and click "OK". So it should read something like...

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --kiosk http://www.thedomain.com/the-exhibition-game-url/

Double click the shortcut icon to open Google Chrome in Kiosk Mode, automatically opening the game page, which you can then full screen (via the in-game full screen button). You'll need to press Alt-F4 on a keyboard to quit Chrome while in Kiosk Mode, but once it's up and running you hopefully shouldn't need to.

Disable Screen Edge Swipe Functions

Windows 10 has built in functions that occur when you swipe at the edges of the screen (including opening Task View, dragging in the "Action Center" sidebar etc.) You need to disable these, otherwise players will be able to quit out of the game or get into PC settings.

This setting isn't available in the standard Windows settings and requires a quick registry change. You can either (create and) set the key manually (not recommended), or download and run these handy registry files to quickly enable/disable this feature. In case you're interested, the relevant registry key is:

[HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\Windows\EdgeUI] "AllowEdgeSwipe" - set to 0.

Either way you'll need to restart Windows for the changes to take effect and you should be able to test afterwards that the edge swipe functions no longer work.

It's also worth mentioning that messing with the registry can do bad things to a Windows install. So don't change anything but this one key. This is yet another reason to use a dedicated machine with a fresh Windows install to run your game and again, set this up ahead of time. You really don't want to be making registry changes on an important work machine if you can help it.

Turn Off Action Center Notifications

Action Center is a new feature built into Windows 10 that allows installed software to deliver mobile-like push notifications, as well as giving easy access to certain Windows settings. This can be useful on a standard machine, but these are often clickable (taking the user into the relevant program or settings) and can be distracting. For these reasons we need to make sure we disable these notifications, to stop them popping up over our game. To do this:

Open Windows Settings, by selecting the cog icon.

Select "System".

Select "Notifications & Actions" from the list on the left. Under the main "Notifications" heading, on the right, you'll see a list of notification permission toggles. You need to make sure all of these are switched off. Otherwise pop-up, clickable notifications will allow players to click away from the game.

There's also a long list of program specific notification toggles below. The top toggle we've just switched off (labelled "Get notifications from apps and other senders") should have automatically disabled these (greying them out), but just double check these are all disabled as well.

Switch Off Sleep Mode

This is worth doing to make sure the game keeps running continuously and the computer doesn't hibernate if it's left idling. The last thing you want is for the screen the go black every few minutes, if no one is playing your game in that time.

Go into Windows Settings, "System" again.

Click "Power & Sleep" on the left and switch both "Screen" and "Sleep" to "Never" via the drop-downs.

Put Windows Into Tablet Mode

This is necessary to make sure the on screen keyboard appears when you select a text entry form (such as a scoreboard entry form) on a touch screen. However, even if you're not using a touch screen it's worth switching to tablet mode anyway because it helps with locking out access to features such as the Windows task bar when you're running your game at the exhibition.

The easiest way to toggle this on/off is to open "Action Center" by clicking the square speech bubble icon in the bottom right of the Windows task bar. Then just press the "Tablet Mode" button to toggle it on/off.

You're All Set

You now have everything set up to use your HTML5 game at an exhibition or event. Players should be totally locked into the game, taking up the full screen area, so you shouldn't be able to tell it's a web based HTML5 game either.

We get lots of interest from businesses looking for ideas for using a game at a trade show, so I thought it's about time I write up the main options you have.

I'm not going to go into specifics of possible gameplay concepts. That's very much dependent on your industry, target audience and the products or services your business is promoting at the exhibition. (Please feel free to get in touch if you're looking for ideas for an exhibition stand game).

What I am going to do is give you some options on how you can implement and use an interactive game on your exhibition stand, as well as getting the most out of it. I'm also going to go over some best practices that you should be aware of.

Hardware Considerations

Using a Tablet in Kiosk Mode

It's no longer essential to use PC hardware with an external and potentially expensive touch screen (assuming you want touch screen controls that is). If you're happy with the smaller screen sizes, it might be more cost effective (and easier, in terms of transportation and setup) to use a tablet (or multiple tablets) at a trade show.

A "kiosk mode" is available on most modern mobile devices and tablets. So you can lock the device to the game and stop players exiting out and messing with things they shouldn't at the exhibition. It just requires a bit of configuration in the operating system settings ahead of time and you're good to go.

If you're going to be using a tablet, always make sure you allow for a charging cable on your exhibition stand. You're going to need to preferably have it plugged in throughout the day, for the duration of the event, continuously charging. Otherwise the battery will be dead before the morning is out. So make sure any housing or mount you use on your business's stand allows for this.

Alternatively, if it's not going to be possible to have the tablet plugged in all day, you're going to need some external battery packs that you can rotate throughout the day of the show to keep you up and running.

Using PC Hardware

With PC hardware you're not tied to a fixed screen spec, you can configure it however you wish. With no limits on screen size, you get the option to really make your exhibition game stand out by going big.

You also get more options on input devices for controls. You're probably not going to want to use a mouse and/or keyboard to control a game at a trade show. As well as it being fairly cumbersome as a control method in that environment, it might allow players to navigate out of your game and get access to the PC running it. But that doesn't mean you're tied to using a touch screen at an exhibition either. PC hardware makes controlling with any standard gamepad or joystick an option. This is great for more arcade type games and gives you options right up to building a mock retro arcade machine right on your exhibition stand.

There are downsides to using PC hardware at a trade show though. Transportation and setup is going to be more of an issue, with more bulky hardware needed. It's also likely to be costlier, especially if you want a large touch screen on your stand.

Again, don't overlook power. Even if you're using a laptop, you're going to need it plugged in throughout the day to prevent the battery from running out.

Sound/Speakers

Don't overlook sound as a possible way to attract visitors to your stand at an exhibition. Plus sound effects and background music can really enhance a gaming experience. If you don't have any speakers though it's a wasted opportunity. So if you're going for a big screen, always try to get some external speakers that will project the sound in the immediate area of your trade show booth where possible.

Development/Deployment Platforms

Web Based HTML5

Assuming the device or PC you'll be using at the event will have a live internet connection, an HTML5 game is a valid option.

The web browser's built in fullscreen mode allows your exhibition game to look like an installed software application.

Going web based on PC no longer limits you to keyboard and mouse or touch screen controls either. The HTML5 gamepad API allows you to use any standard gamepad or joystick (provided you're using a compatible web browser).

The big plus side of HTML5 is because it's web based you can get a version of your trade show game to use on your website, to integrate with your other marketing activities outside the exhibition. This usually only requires very minor changes for your website build. So as long as it's built into the original plan, it shouldn't increase the production costs above and beyond just use the game on your exhibition stand. This also means you could potentially give out the web address for visitors to play on their own devices, away from your stand at the exhibition.

Installable Mobile App or PC Game

The other option is to go down the installable software route. This can give you a more polished end product, but development can be more complex because the end product is tied to specific target platforms (requiring a separate build for each). It's also likely you'd be locked out of having a web based version of your exhibition game for your website as well.

If you want to use a tablet on your exhibition stand you'd be limited to Android only, because iOS won't easily let you circumvent Apple's app store to install an app on a device.

Always Plan Well in Advance

I can't stress this enough. The problem we see most often with any type of branded game is thinking about it far too late.

If you're thinking of using a video game at an exhibition or trade show, you need to consider how you're going to present it and plan for the hardware you're going to need (as well as any associated build requirements for your stand).

It's also going to be useful to the game developer you use to know the exact hardware spec you'll be using at the event.

So ideally, I'd recommend you start thinking and planning a game for an exhibition at least 3 months ahead of time. This will not only give you plenty of time to plan the hardware side and test the game on that exact hardware, it'll also mean you have plenty of time nail down ideas for your exhibition stand game. The earlier you can start planning, the easier and less stressful the whole process will be.

Always Test on the Actual Hardware

Don't make the day of the exhibition the first time you set the game up, that's asking for trouble. Always make sure you test on the hardware setup you'll be using on the day, well in advance. The last thing you want is to be tearing your hair out, trying to figure out why you can't get the game to work, as visitors are already coming through the venue doors.

It's also worth mentioning that testing on any tablet or PC isn't good enough. Make sure you test on THE exact setup you'll be using at the exhibition. Otherwise any variation in operating system, hardware spec or installed application software are still unknown variables that could potentially cause issues.

If you get this all done and setup well in advance, it'll make your setup on the day of the event easy and stress free.

Competitions and Data Capture

Because of the way game scores are stored in a scoreboard making it open to cheating, we strongly advise clients not to run competitions based on game outcomes such as player scores.

If you're using your devices on your stand only, then to some degree it's locked down in a controlled environment. Players don't get access to the computer or device outside of the game, so this may somewhat mitigate the risk. But it's best not to risk it.

There are some ways around this, if you want to collect data at the exhibition, such as including a free prize draw entry form.

Visibility and Promotion

I've written about promoting a branded game and how it's never a good idea to just expect people to magically find it before. Although this doesn't technically apply at an exhibition, physical location on your stand and the visibility that provides should be a primary consideration.

As with any piece of content, it's there to increase engagement, get people staying on your stand for longer and hopefully generate buzz at the exhibition. However, most of this relies on getting those initial players to get the ball rolling. So maximising visibility on your stand and doing a bit of creative promotion at the venue is essential, to help get the most out of your game.

It sounds like a no-brainer, but hiding your game round a corner or behind another part of your exhibition stand is obviously going to affect how much interest you get. Designing your stand so that your game gets good visibility to visitors walking by is essential.

Using a PC powered giant screen is going to get you the best visibility and interest from passers by. However, I understand unless you have a big budget for your stand, it's probably not going to be feasible.

If you're using smaller devices such as tablets, or a modestly sized screen attached to a PC, there are still some ideas you can use to maximise visibility at a trade show or event. For instance, why not consider incorporating some prominent signage into your exhibition stand to highlight the game. Something as simple as a "Come and Play" sign could make a massive difference.

An exhibition game can be a great promotional hook as well. So why not make the most of it. If you're speaking to visitors at the show, handing out flyers or even doing pre-exhibition "come see us at stand X" type promotions, why not leverage the game there. "Come play our game on stand X" certainly sounds a lot more inviting.

Unleash Your Creativity

Hopefully this has helped give you some ideas and point you in the right direction. What creative ideas can you think of to get the most out of your exhibition game?