How Tos‎ > ‎

How To Make A Game (ActivInspire)

Logo of Promethean Boards Bound: A Blog About Educational Technology featuring a cartoon map of the Upper Cumberland region

by MARK WEST 1/26/10

Mac Tips

Special Keys

The Mac Command Key

You probably call this the "Apple Key", but it's officially called the Command Key and it is located near your spacebar. It is used on a Mac much like the control key is used on Microsoft Windows®; example: control-c on Windows copies and on a Mac we use command-c; control-v pastes on Windows and command-v pastes on Mac OS.


The Option Key

The Option Key is located near the Command Key and is sometimes called the ALT key. This key can frustrate a Windows user, as it doesn't work as a Windows ALT key does (you'll often use the Command Key on Mac where ALT is used in Windows), such as when tabbing through open applications: on Windows it's ALT-Tab, on a Mac it's Command-Tab.


The Control Key

The Control Key is located near the Command Key and has special funtions on a Mac (see "Right Clicking" below).


Exiting A Bad Program

On Windows, Alt+F4 will quickly terminate a program.

On Mac OS, Command+Q will quickly terminate a program.


The "3-Finger Salute"

On Windows, when a program stops behaving properly, you can press Control+Alt+Delete to invoke the Task Manager to make an application stop.

On Mac OS, you can accomplish the same thing by pressing Command+Option+Escape; this invokes the Force Quit menu and you can make applications stop.


"Right Clicking"

Sometimes you need to right click. On most computers it's easy, as they come with a two-button mouse. On Mac OS, you typically find a single-button mouse.

You can plug a two-button mouse in to a Mac and it will work. The reason is because two-button mice work on Unix and Mac OS is a Unix variant that uses parts from FreeBSD's and NetBSD's implementation of Unix.

You can also "right click" on a Mac with a single button mouse. To do so, you can do either of the following:

  1. Press and hold the Control Key while clicking.
  2. (This one only works if you have a Mac with a touchpad - usually a laptop) place two fingers on the touchpad while clicking.

Creating A Game Template

Note: These instructions are for ActivInspire.


Step One: Create Your Initial Pages

Tip: making each of these with a different background will make them stand out better when you have to quickly look for a page. The page backgrounds below I made with the GNU Image Manipulation Program.

  1. The first flipchart page should be your game board page. This will ultimately be your game's main page.
    1. To make a picture background, we'll need your browser open. If the browser is rolled in, roll it out. If it's not visible, you can use the View Menu and choose Browsers (or press command and B).
    2. Choose the Property Browser
      the property browser
    3. On the Page section, click on the Background elipsis button (the three dots), which brings up this box:

      How to set the background
      Choose the Image option, then click Browse... to get to it ( -- I used a blue background called Gameboard.png); be sure to change it from tiled to Stretch Fit.

    Title Your Game

  2. Since this example is tic-tac-toe, create text that says tic-tac-toe.
    1. I'll use Verdana, 48 point, bold and move the text to the upper left hand corner.

    Create the Game Board

  3. Create a square for the Tic Tac Toe board. Make 8 copies of it and arrange it 3 x 3
    1. using the shapes object draw a square. Once drawn, use the select tool (the arrow) to click it and select it. Look at your properties browser, starting with the Outline section:
      Tweaking The Box's attributes
      The Style should be solid. Set the width to 2. Change the color to a medium gray. Click whatever color is there:
      Tweaking The Box's attributes
      looking at the bottom row, click the gray that's in the middle.
    2. Now focus on the Fill portion:
      Tweaking The Box's attributes
      The Style should be gradient. Set the Gradient option to radial. Change the top color ("Color") to white and the bottom color ("Color 2") to light gray.
    3. Now focus on the Position:
      Tweaking The Box's size and onscreen position
      Set the Left to 300. Set the Top To 140. Set the Height and Width both to 200 (or as close as you can to 200).
    4. If the box is not selected, use the selection tool. Press command+D and the box will duplicate. Using the Properties Broswer, go to Position. Set the Left to 500. Set the Top To 140 (it probably changed to 150).
    5. Duplicate that box with command+D. Using the Properties Broswer, go to Position. Set the Left to 700. Set the Top To 140 (it probably changed to 150). You now should have 3 boxes perfectly aligned:
      three boxes aligned
    6. Using your selection tool, click and drag across all three boxes. Using your Marquee Handles Toolbar, use the Object Edit menu to group these three:
      three boxes aligned
    7. Duplicate the row with Command+D. You can move it down manually with the Marquee Handles Toolbar (the X or Freely Move Object tool) or you can use the Properties Browser to place it with precision (the top attribute should be 340 (140 was the old attribute and the boxes are 200 tall, so the next box should start at 200+140=340). Warning: ungroup them before you edit the "left" attribute or all 3 boxes will have the same left attribute and thus stack on each other).
    8. Duplicate the second row with Command+D. You can move it down or use the Properties Browser (Top should be another 200 down, or at 540)
    9. Using your selection tool, click and drag across all nine boxes. Using your Marquee Handles Toolbar, use the Object Edit menu to lock all 9 boxes (with all 9 selected, just choose "Locked" and all 9 will lock in place). Hopefully, your page looks something like this:
      the page so far

    Create A Place For Question Links

  4. Create text that says Questions
    1. I'll use Verdana, 30 point, bold and move the text under the title of the game. Note that 36 is the closest option on the pull down menu; type in 30 there and it will make the text 30 point.
    2. Once you have the text in place (on the page where you want it), lock it.
      1. Using the select tool, click it to select it.
      2. Using your Marquee Handles Toolbar, use the Object Edit menu to choose "Locked" and it will lock in place.
  5. We can't make links to the other pages until we make the other pages, so we'll make them next.

Create the Question Page

  • The second flipchart page (Insert -> Page -> Blank Page After Current) will be your first question page.
    1. To make a picture background, we'll need your browser open. If the browser is rolled in, roll it out.
    2. Choose the Property Browser.
    3. On the Page section, click on the Background elipsis button (the three dots) and choose the Image option, then click Browse... to get to it (I used a silvery background called overlay.jpg for questions); be sure to change it from tiled to Stretch Fit.

    Title Your Page

  • Since this is Question 1, create text that says "Question 1"
    1. I'll use Verdana, 48 point, bold and move the text to the upper left hand corner.

    Type A Question

  • Type in a question of your choice.
    1. Type in something, such as "Thermidor and Newberg are recipes for which type of marine animal?"
    2. I'll use Verdana, 48 point (not bold).
  • We'll place a link after we make our answer page.
  • Create the Answer Page

  • The third flipchart page (Insert -> Page -> Blank Page After Current) will be your first answer page.
    1. To make a picture background, we'll need your browser open. If the browser is rolled in, roll it out.
    2. Choose the Property Browser.
    3. On the Page section, click on the Background elipsis button (the three dots) and choose the Image option, then click Browse... to get to it (I used a golden background called overlay2.jpg for questions); be sure to change it from tiled to Stretch Fit.

    Title Your Page

  • Since this is Answer 1, create text that says "Answer 1"
    1. I'll use Verdana, 48 point, bold and move the text to the upper left hand corner.

    Type An Answer

  • Type in an answer of your choice.
    1. Type in something, such as "Lobster. Lobster Thermidor and Lobster Newberg are popular recipes."
    2. I'll use Verdana, 48 point (not bold).

    Create A Question Link

  • Using the Page Browser, go to the game board page (page 1).
    the pages so far
    Create text that says "1"
    1. I'll use Verdana, 30 point, bold, underlined and blue (like a webpage hyperlink) and move the text under the word Questions.
      1. Using the select tool, click it to select it.
      2. Use your Action Browser. Toggle it from "All Actions" to "Page Actions"
        the Action Browser
      3. Choose "Another Page". Under the section "Action Properties", set the Page Number to 2.
        the Action Properties
        Click the "Apply Changes" button (at the bottom)
    2. Click the link and move forward to page 2 (your question). If it didn't work properly, recheck these steps.

    Create A Link From The Question Page to the Answer Page

  • You should be on your question page. Create text that says "Go To Answer"
    1. I'll use Verdana, 36 point, bold, underlined and blue (like a webpage hyperlink) and move the text to the bottom of the flipchart page.
    2. Once you have the text in place (on the page where you want it), make it a link and then lock it.
      1. Using the select tool, click it to select it.
      2. Use your Action Browser. Toggle it from "All Actions" to "Page Actions".
      3. Choose "Next Page". Click the "Apply Changes" button.
      4. Using your Marquee Handles Toolbar, use the Object Edit menu to choose "Locked" and it will lock in place.
    3. You should be able to click the link and move forward to page 3 (your answer).

    Create A Link From The Answer Page to the Game Board Page

  • You should be on your answer page. Create text that says "Go Back To Game"
    1. I'll use Verdana, 36 point, bold, underlined and blue (like a webpage hyperlink) and move the text to the bottom of the flipchart page.
    2. Once you have the text in place (on the page where you want it), make it a link and then lock it.
      1. Using the select tool, click it to select it.
      2. Use your Action Browser. Toggle it from "All Actions" to "Page Actions".
      3. Choose "First Page". Click the "Apply Changes" button.
      4. Using your Marquee Handles Toolbar, use the Object Edit menu to choose "Locked" and it will lock in place.
    3. You should be able to click the link and move to page 1 (your game board).

    Step Three: Add More Pages Of Questions And Answers

      Adding A New Question

    1. Use the Page Browser to find a question page such as page 2. From the Edit menu, choose duplicate (or press command-D). If it doesn't appear as the last page, click and drag it to be the last page.
    2. Choose the new page in the page selector
    3. Update the question number (such as "Question 2").
    4. Change the question to something else, such as "How much?".
    5. Adding A New Answer

    6. Use the Page Browser to find an answer page such as page 3. From the Edit menu, choose duplicate (or press command-D). If it doesn't appear as the last page, click and drag it to be the last page.
    7. Choose the new page in the page selector
    8. Update the answer number (such as "Answer 2").
    9. Change the answer to something else, such as "A Lot.".
    10. Link To The Question From The Game Board Page (Page 1)

    11. Use the Page Browser to go to page 1.
    12. Switch to Design Mode (Blue "Snow Flake" to Red "Snow Flake - or you can go to the Edit Menu and choose Design Mode)
    13. Find a link to a question page (such as the "1" you made earlier). Click it and duplicate it
      1. From the Edit menu, choose duplicate (or press command-D).
    14. Move the link to where you want it.
    15. Change the link text (such as from "1" to "2").
    16. Change the link.
      1. Using the select tool, click it to select it. Click on the properties box on your Tool Box.
      2. Use your Action Browser. Toggle it from "All Actions" to "Page Actions".
      3. Choose "Another Page". Choose the correct page (multiply the question number by 2, so question 2 is on page 4).
      4. Click the "Apply Changes" button.
    17. Switch to Presentation Mode (Red "Snow Flake" to Blue "Snow Flake - or you can go to the Edit Menu and uncheck Design Mode). This will enable the hyperlinks.
    18. Click the link and make sure it links to the question page. The question page should automatically have a link that will send you to the answer page when clicked. The answer page's link should send you back to the game board page.
    19. Repeat the process listed under the headings "Adding A New Question", "Adding A New Answer" and "Link To The Question From The Game Board Page (Page 1)" until you have all the questions you need.


    20. When you have added all the links to the questions, I suggest you lock them into place.
      1. Using the select tool, drag it over the group of question links (1 to whatever).
      2. Using your Marquee Handles Toolbar, use the Object Edit menu to choose "Locked" and all will lock in place.

    References

    Burleson, W., & Picard, R. (2004). Affective agents: Sustaining motivation to learn through failure and a state of “Stuck.” Proceedings of Workshop of Social and Emotional Intelligence in Learning Environments, in conjunction with the 7th International Conference on Intelligent Tutoring Systems Maceio, Alagoas, Brazil.

    Chang, Y.K., Plass, J.L., & Homer, B.D. (2008). Development and validation of a behavioral measure of metacognitive processes (BMMP). Featured Research presentation at the annual convention of the Association for Educational Communication and Technology (AECT) in October, 2008 in Orlando, FL.

    Domagk, S., Schwartz, R., & Plass, J.L. (in press). Defining interactivity in multimedia learning. Computers in Human Behavior.

    Leutner, D., & Plass, J.L. (1998). Measuring learning styles with questionnaires versus direct observation of preferential choice behavior in authentic learning situations: The Visualizer/ Verbalizer Behavior Observation Scale (VV–BOS). Computers in Human Behavior, 14, 543–557.

    Mandryk, R.L. (2008). Physiological measures for game evaluation. In K. Isbister & N. Shaffer (Eds.) Game usability: Advice from the experts for advancing the player experience. San Fransico: Morgan Kaufmann.

    Plass, J.L., Perlin, K., & Nordlinger, J. (2010). The Games for Learning Institute: Research on design patterns for effective educational games. Paper accepted for presentation at the Game Developers Conference, San Francisco, March 9-13, 2010.


    ċ
    TicTacToeINSPIRE.flipchart
    (545k)
    Mark West,
    Jan 26, 2010, 8:21 AM
    Comments