Getting Started with HTML 5 Games
This tutorial will help you get started with our HTML 5 Games. The video covers the basics on how to use the games. View the other tutorial videos for more detailed information. Make sure that you make a copy of the game files so that you always have an original to go back to. Important: You must use a modern browser to edit and view these games. For example only IE9 and newer will work. Two Editing Methods Method 1: Edit on a Server (Preferred Method) Upload all of the files that you downloaded with your purchase to a web-server. (Game...
read moreAdding Images to Questions in HTML 5 Games
This tutorial shows you how to add images to questions in the HTML 5 games. Images can be added to the Introduction, Question, and Conclusion areas. Each game is a bit different on where the images is placed and how it is sized. The game will try to auto size your image but you may need to do some additional sizing. Insert your image and preview it. Then you can get a feel for any additional sizing that’s needed. To add an image you must use the <img src> html tag. The image tag will need to specify where your image is located....
read moreChanging Visual Elements, Backgrounds, and Colors in HTML 5 Games
There are many ways to change the visual elements of the HTML 5 games. This tutorial lists some of the changes you can make. All of the changes are done in the Design tab (Design.ini file). Working with Colors You can use HEX, RGBa, and HTML colors in the games. Use the color wheel in the bottom right of the game editor (config.html page) to choose colors. HEX Colors Here is a sample: #ffce0c. These colors start with a # sign and have 6 characters after them. Use the color wheel in the editor to get these values. HTML Colors There are...
read moreWorking with Audio in HTML 5 Games
This tutorial explains how to add question audio and change game sounds in HTML 5 games. Note: .wav files are the most universally compatible with browsers and devices. (However, only .mp3 works in Internet Explorer.) Adding Question Audio You can add your own audio to each question. Here are the steps to add audio: 1. Copy your audio file to the questions folder in your game files. 2. (Questions tab) Uncomment the audio code line on the question. (For example: q1_audio=xxxxx.wav) You should see one audio code line in each question...
read moreEditing Questions and Answers in HTML 5 Games
This tutorial shows you how to edit questions and answers in the HTML 5 game templates. (Note: Most of the games have all of the features below but not all of them. At times a certain feature doesn’t make sense with the structure of the game.) Two editing methods for the games: Edit on a server: Upload all of the files that you downloaded with your purchase to a web-server. You can then point a browser to the config.html file in the game folder. That will launch an online editor. You can make design and text edits and click the Save...
read moreCreate Custom Locations for the Worldrace HTML 5 Game
Here’s a quick tip on using the HTML 5 Worldrace game. (Note: This is the same game logic and steps to edit the path on the Gridlock and Marathon games also.) Let’s say that you want the game piece to follow a custom path around the world map. Maybe you want it to start in Utah USA, and then go through Rome IT, Sydney AU, Rio BR, Mexico City MX, and finish back in Utah. (Just in case you’re wondering, eLearning Brothers is based in Utah.) Here’s a demonstration of our customized game. Game Path Logic Important: First...
read moreUsing XAMPP to Edit HTML 5 Games
This tutorial shows you how to use XAMPP to edit HTML 5 games. Download XAMPP. Tips: - You only need the “Apache” module running in the XAMPP Control Panel - Copy your core and game folders into C: Drive / xampp/ htdocs - Point your browser to http://localhost/(then the name of whatever folder you created in htdocs to hold your core and game...
read moreHow to insert an HTML5 game template into a Captivate HTML course.
One question that we have had a lot lately is how to insert one of our custom games from our Interaction Builder into a Adobe Captivate HTML course. In this post I wanted to take you through step by step how you would get your game into a publish Captivate HTML project. There really is no way within Captivate itself to insert the external HTML. You can link to it but it takes you out of your Captivate course completely with really no way to get back to the course unless you link back to it within your HTML. While that is an option it just...
read moreUpload HTML 5 Games to Moodle
Here are the steps to take our HTML 5 games, place them into a SCORM wrapper, and then upload them to Moodle. The video below shows you how to prepare the files for upload into Moodle. The steps to upload into Moodle are below the video. Note for Library subscribers: If you are a library subscriber then download the HTML SCORM wrapper first. Note for Interaction Builder subscribers: Contact us to get the SCORM wrapper. (use the chat window or our contact form.) Also, when you download the game zip from the Builder you’ll notice an...
read more
