Chapter 25: Setting Up User Interaction


Setting Up User Interaction

Two effects are specially designed to add and show opportunities for user interaction in a motion book: tap points and the Highlight effect. A tap point pauses motion book playback so the reader can take in dialog, narrative, and surroundings before tapping to go on. The Highlight effect adds a gleam to a layer to show that the layer is a hot spot that the reader can tap to select an option. A highlight typically appears while a motion book is paused for a tap point.

Using Tap Points

A tap point pauses motion book playback and presents a red arrow on the center right of the page that the user can tap to continue playback. A tap point pauses all currently playing effects, so if a motion effect is in the middle of moving a layer across the canvas, the motion will pause and then continue once the reader has tapped. The same is true of other effects such as transparency, rotate, and scale effects.

Two effects do not pause at a tap point: a sound effect continues to play even during the pause, and a highlight effect plays its three-second gleam regardless of a tap point.

A reader can step back through tap points in a motion book by tapping on the left side of the screen or swiping right. Each step back takes motion book playback to the previous tap point, rewinding effects to their playback state at that tap point.

Adding a Tap Point

Before adding tap points, consider page locations where reader pauses make sense. A page should have multiple tap points so that it doesn’t play back without opportunities for the reader to read and take in the page. Typical tap points occur right after a word balloon or narrative appears so the reader can parse the text at their own speed. Tap points might also appear after significant action has changed the look of the page—a new panel appears, for instance, or a new character has burst onto the scene.

To Add a Tap Point

1.      In the effect stack, click “+” in the Add new tap point button.

A dialog box asks where the tap point should start.

2.      Click an existing effect start or complete time or specify the number of seconds into the timeline that the tap point should execute, then click “Done.”

A red tap point dot appears on timeline at the offset you specified and a tap point effect box appears in the effect stack.

Note that if you select an existing effect start time, you make the tap point part of an effect group. Select an effect complete time or specify a value in seconds to place an independent tap point that’s not part of an effect group.

Figure 1:    A tap point effect box offers a limited set of standard effect controls because it has no duration.

Standard Effect Controls

A tap point effect box offers only a few effect controls, all of them standard, because the tap point is very simple and has no duration. You can change a tap point’s name or offset just as you would any other effect. You can also turn the tap point on or off or delete the tap point if you no longer want it in place.

Using a Tap Point With Other Effects

Consider your tap point placement among other effects. If you place a tap point in the middle of one or more effects while they’re playing back, the tap point will freeze any action and then resume it after the reader taps, which could look clunky to the reader. Motion book creators typically place tap points after other effects have finished playback.

Consider also what happens when a sound layer is playing back when a tap point occurs. The sound layer will continue to play during the pause, which is good for continuing the mood it sets, but a pause can last an indefinite period of time, longer than a sound layer is set to play.

If you know that a sound is likely to run out during a tap point pause, either create the sound file that fades out gracefully on its own or apply a Fade Out effect to the sound for graceful fadeout. If you want a sound layer to continue indefinitely during a tap point pause, set the layer to loop for a large number of layers such as 999.

It’s typical to follow a tap point immediately with one or more effects to start moving the story forward again. If you do, leave 0.1 seconds between the tap point and the beginning of the new effects to give the effects time to start correctly. Starting effects immediately on the tap point location can cause irregular results. One exception to effect spacing is the Highlight effect, which typically starts right at the tap point location.

Setting a Tap Point at Page End

There’s no need to set a tap point at the end of a page’s timeline because you can set the page to pause or not after playing back all effects on the page.

To Turn Page Pause On

l  In the Page properties box at the bottom of the page’s layer stack, click “Pause page at end” to check the option and turn on page pause.

The page pauses at the end of its playback in the Madefire Reader to wait for a user tap.

To Turn Page Pause Off

l  Click “Pause page at end” to uncheck the option and turn off page pause.

Playback in the Madefire Reader continues from the end of this page directly to the beginning of the next page without pause.

A page pause appears to a reader just like a tap point.

Using Highlight Effects

A Highlight effect adds a gleaming set of vertical bars to a layer. The highlight typically calls attention to the layer as a hot spot, a layer that’s linked to a URL or another location within the motion book. When a reader clicks on the layer, book execution jumps to the link. “Linking a Layer” on page 132 describes layer links in more detail.

A highlight effect has a set duration: it always plays for approximately three seconds and then stops. It presents gleaming vertical bars that move first right, then left. The bars fill in the shape of all the non-transparent parts of the layer to which they’re attached. If, for example, you set a word balloon layer to be highlighted, the highlight appears in the shape of the word balloon, not the full rectangular shape of the layer containing the word balloon.

Figure 2:    The highlight effect fills in the non-transparent parts of its attached layer, in this case a word balloon.

A highlight effect appears on the top of the canvas above all other layers so that the highlight points out its attached layer even if the layer is partially or fully obscured by other layers.

Once a highlight effect starts playing, the effect continues to its end whether or not it’s interrupted by a tap point. This is an important feature that allows highlight effects to present user options while the story is stopped. Highlights are typically placed at the same location on the timeline as a tap point so that the reader sees highlight gleams during the tap point pause.

A highlight is set to white by default, but may be set to any single color to stand out against the layer it’s highlighting.

Adding a Highlight Effect

Add a new Highlight effect just as you do any effect as described in “Adding an Effect to a Page” on page 56. You don’t need to set any effect-specific values during creation, and won’t have to specify a duration because the highlight duration is fixed at approximately three seconds.

When you’ve finished, a Highlight effect box appears in the effect stack. It has a single effect-specific control: Highlight Color.

Figure 3:    A Highlight effect box offers standard effect controls, but no duration because highlight duration is fixed. It offers one effect-specific control: Highlight Color.

A single square appears on the timeline to represent the highlight effect. The Motion Book Tool does not use an effect bar to represent a highlight effect because the effect has a fixed duration of approximately three seconds that can’t be changed.

Changing the Highlight Color

The Highlight Color box sets the color of the vertical bars in the highlight gleam. The default color is white. You should choose a color that shows up well against the layer being highlighted.

To Change the Highlight Color of a Highlight Effect

1.      In the effect stack, click the Highlight Color box in the Highlight effect box.

A standard color dialog box opens.

2.      Select the color and opacity you want, then close the color dialog box.

During playback the highlight uses the color you selected.

Standard Effect Controls

You can set a Highlight effect’s name, offset, and target layer as described in “Working With Effect Controls” on page 139. You can’t set duration because a highlight’s duration is fixed.

Placing a Highlight Effect

When you add a highlight effect to a layer, it’s best to place it so that it executes when there are no other effects playing back for that layer. If you place a highlight on a layer that’s moving, rotating, scaling, or changing transparency, you can get unexpected results.

Highlight effects are placed most often at exactly the same offset as a tap point. When the motion book pauses at the tap point, one or more highlight effects located there then gleam to show available hot spots.

To present a timed sequence of hot spots after a tap point, place all but the last highlight effect for the hot spots offset before the tap point, then the last effect on the tap point. The highlights then play back in the order you set them, and playback pauses on the tap point as the last highlight effect plays back.


Have more questions? Submit a request


Powered by Zendesk