| ThingMaker Documentation Chapter 4) Working With Tools

| Tutorial 5: Shapes and Colors This Tutorial introduces you to the Shape and the Colors tools. The Shape Tool is the only Tool in ThingMaker that lets you create graphics in the Scene Window. Shapes can be treated like any other Thing. They can be made transparent and used as Hotspots that can reveal other Things.

The Color Tool allows you to change the color of Shapes, of graphics, and the Scene background.

Here are the steps you'll perform in this tutorial:

- Create a Shape using the Shape Tool
- Change the Color of the Shape
- Create a transparent Shape

  Getting Started
  1. Run the ThingMaker application.
  If its not already running, launch ThingMaker.

  2. If you don't have a blank Scene to work on, choose New from the File menu.

  Using the Shape Tool
  The Shape Tool draws polygon shapes that you can treat as Things by attaching Actions, creating Paths, or changing colors.

  1. Click the Shape Tool in the Tools Palette.
  This selects the Tool.

  2. Move the cursor onto the Scene window.
  The cursor changes to into a cross:

  3. Click and release the mouse.
  This creates the starting point of the Shape.

  4. Move the cursor away from the starting point.
  As you move the mouse, ThingMaker draws a straight line from the Shape's starting point to the cursor's current location, as if the line were a rubber band being pulled tight.

  5. Click to create a second Control Point.
  When you move the cursor away from the second Control Point, the line will continue following the cursor from the second Control Point.

  Extending the Shape

  6. Continue to click to create the Shape.
  You need at least three points to make a Shape, but a Shape can be as complex as you like.

  7. To finish the Shape, click on the first Control Point again, or double-click the last Control Point you made.
  The program will finish the shape by "closing it" - drawing a line from the last Control Point to the first Control Point.

  You cannot create an "open" shape in ThingMaker.

  When you finish the Shape, ThingMaker switches back to the Pointer Tool. You can now drag the Thing to a new location in the Scene or edit the Thing. If you want to create another Shape Thing, you must select the Shape Tool again.

  Editing the Shape
  Not happy with the Shape you drew? Edit the Shape by adjusting the position of the Control Points that define its appearance.

  1. Click on the Shape to select it.
  The shape will be surrounded by a dashed line. Its Control Points are the hollow squares that connect the line segments together.

  2. Move the cursor over one of the Control Points.
  The cursor changes from a pointer to an arrowhead cursor.

  3. Click and drag the Control Point to a new location.
  As you drag on the Control Point, a new line will appear as ThingMaker redraws the Shape.

  4. Release the Mouse.
  The Shape is updated.

  Now, you're going to create a slalom flag for the game you started in Tutorial 4. Adjust the Shape so that it looks like the flag. Note that if you don't create a shape with enough Control Points, you may have to create a new shape.

  Drawing and editing Shapes can be harder than it looks. Be sure to design your Shape with enough Control Points. A Shape with too few Control Points will limit what you can do with it. Unlike a Path, you can't Smooth and Unsmooth a Shape or add and delete Control Points. If you don't like the Shape you end up with or want to redraw it, you will have to throw your Shape away and start again. Our advice: proceed slowly and deliberately when learning to work with Shapes.

  If you want to make a Shape with Control Points that are closely spaced, it's best to place them about 1/8 of an inch apart and then use the editor to tighten the spaces, rather than laying down Control Points that are too close to one another.

  The Shape Settings Sheet
  Like other media in ThingMaker, Shapes have their own Settings Sheet.

  1. If it's not already open, open the Settings Palette.

  2. Click on the interior Color Selection Tool in the Shape Settings Sheet.
  Click the cursor on the Field next to to the word Hue. When the Color Choice window appears, click on a color. The program notes the change in the Settings Tray and changes the Shape's interior color in the Scene.

  3. Click on the More Button.
  This opens a Color dialog. Choose any color from the Parable Color Palette for your Shape here.

  4. Click on a green color in the color swatch.

  5. Click OK.
  The Shape's color becomes that of the selected color.

  6. Choose the Border Color.
  Click on the box next to Hue to choose a color when the Color Choice Window appears.

  7. Find the Border Width Field check box and use the Up Arrow key to thicken the Shape's border.
  ThingMaker allows you to choose a border thickness on a scale of one to five, with one being the slimmest and five being the thickest.

  The Color Tool
  You can also change the color of Shapes, all other graphic Things, and Scene backgrounds with the Color Tool.

  1. Click the Color Tool to select it
  This is the same Color Choice Window that appeared in the Shape Settings Sheet. Color selection works exactly the same way as color selection in the Shape Settings Sheet.

  2. Click on the red square.

  3. Move the cursor into the shape and click.
  As you move the cursor over the Scene, it changes into a brush tool. When you click the mouse, the interior of the shape changes to red.

  4. Click the Pointer Tool to switch out of the Color Tool.

  5. Change the Scene Background.
  Click on the Color Tool and select a color. Move the cursor to the Scene, and it will become a paintbrush. Click anywhere in the Scene: it will flood the Background with color instantly but leave other Things as they were.

  Finishing Up
  We want to use this Shape in Tutorial #7, so we are going to save it in the Gallery.

  1. Drag the Shape to the Gallery.
  The Shape is added to the Gallery and disappears from the Scene window. It will now be ready for use in Tutorial 7.

  2. Click the Save Gallery Button.
  To save the Gallery when you change it, click the Save Gallery Button. Then choose Save, when the Save Dialog appears.

  Where to Next?
  In the next Tutorial, you will learn how layering and related Actions help you further the goal of "Making Things Do Things."

  <--Previous | table of contents | Next -->