Tappable overlays are technically still in beta testing, but everyone is free to try them out.
​
-
Readers are now able to tap on the screen in the same way you would tap on a choice, but instead of choice bubble, you would tap on overlays.
-
In order to understand tappable overlays, you must first be very familiar with how overlays work. Click the button below to learn how to place and animate overlays.
Setting a Tappable
​
tappable
"OVERLAY_1" {
​
} "OVERLAY_2" {
​
}
​
-
To set a tappable, use the same exact coding as a choice, but replace the word "choice" with "tappable"
-
Instead of option titles, you will use the overlay names in all capital letters.
-
Unlike a choice, you do not need to have dialogue to set a tappable.
-
All overlays must be onscreen in order to be tapped.
-
Overlays cannot be stacked on top of each other. The top layered overlay will be the only available overlay to tap.
-
The overlay will darken once tapped.
-
Overlays can have an opacity of 0 (invisble onscreen) and still be available to tap. You can layer an invisible overlay over a character or a certain spot on a background and readers would be able to tap that character/spot.
-
The tappable area of an overlay is the rectangle around the entire overlay, which includes the transparent background of the overlay's PNG image.
-
You CANNOT invert the scale size of a tappable overlay. Doing this will result in the overlay being un-tappable.
​
​
​
Using Tappable "else"
​
-
If you'd like to set a condition where no overlays are tapped, you can use the "else" option.
tappable
"OVERLAY_1" {
NARRATOR
You tapped on option 1.
​
} "OVERLAY_2" {
NARRATOR
You tapped on option 2.
​
} else {
NARRATOR
You did not tap on either option.
}
​
​
​
Using "ui" to Pin-to-Camera
​
@ui OVERLAY_NAME create
@ui OVERLAY_NAME shifts to 50 100
@ui OVERLAY_NAME scales to 1.0 1.0
@ui OVERLAY_NAME opacity 1
​
-
You can pin an overlay to the "camera" where the overlay will stay on the screen in the same spot even in you pan to another zone or zoom into a spot.
-
To do this, use "ui" in place of the word "overlay"
-
A "ui" works in the exact same way as an overlay.
-
You can create it, shift it, scale it, change the opacity, clear it, and even duplicate it.
-
You can also use it for text overlays and for tappables.
-
Changing the background will remove the "ui" overlays just like with regular overlays.
-
"ui" overlays placed at top or bottom of screens will not be visible to readers using tablets.
-
You do not need to add a zone number to the "ui" shift command. ui's are defaulted to zone 1. Placing a ui in a different zone will make them be offscreen. Since ui's are "pinned" to the "camera", if you place a ui in a different zone, you will never see the overlay even if you pan or cut to the other zones.
​
​
​
Panning Tappables
​
tappable [pan:1:2]
"OVERLAY_NAME" {
}
​
-
You can now drag the screen around through the zones during a tappable choice.
-
Use the tappable "pan" command, where 1:2 means the reader can pan anywhere between zones 1 and 2. If you want readers to drag the screen between zones 2 and 3, you woud use [pan:2:3]
-
Once an overlay is tapped, the panning between zones will stop.
​
​
tappable [pan:1:2:hor]
​
tappable [pan:1:2:ver]
​
-
Add ":hor" or ":ver" to limit the reader to horizontal or vertical panning/scrolling.
-
You must be zoomed in to vertical scroll.
​