Docs/Dynamic Components

Backgrounds

A Background puts a picture, a video, or a flat colour behind your story, and lets you draw the part of it the text sits in. You build it once, give it a name, and a Trigger raises it wherever the scene starts. Another Trigger takes it back down.

Where to find it

You can find Backgrounds in the sidebar, under Dynamic Components. The list shows every Background in this book: click Add Background to create one, or click a row to open and edit it.

Note
A Background is the only Dynamic Component that opens nothing. There's no window for your reader to close and no outcome to wait for; it changes what the page looks like, and the story carries on.

Picture, video, or colour

A Background shows either a picture or a flat colour, never both at once. You can switch between the two with the Picture or video and Colour buttons, and switching keeps the side you left, so you can try a colour and come back to your picture with the framing intact.

  • Picture or video: choose from the book's media or upload something new, the same picker the rest of the editor uses. Video plays muted and on a loop, and readers who ask their device for reduced motion get the first frame held still instead. A background video can be up to 30 seconds: it repeats for as long as the scene lasts, so a longer one is a download your reader never reaches the end of.
  • Colour: a flat colour, from the eight presets or any hex code you type. No file, no upload, nothing counted against your media quota. Good for a blackout, a dream, or the red of a fight.
Note
Story text goes white over a Background, so dark colours read best; all eight presets are dark enough. If you type a light one the editor will say so, but it won't stop you. It's your composition.

The frame

One square, every screen

Every Background is composed in the same square frame: the Frame tab lets you drag your picture around inside it, and the Zoom slider pushes in. Whatever ends up outside the square is cut off.

Your reader's page isn't square, so the square is scaled up until it covers their whole page and the overflow is cropped away. A phone keeps a tall slice of the middle; a laptop keeps a wide one. The Phone and Desktop buttons above the canvas draw both slices over your composition, so you can see what survives on each before you save.

Note
It's worth keeping what matters near the middle. The crop leans toward your text area once you've drawn one, but a face in the far corner of the square is the first thing a phone loses.

The text area

Draw where the words go

Switch to the Text area tab and drag a loop around the part of the frame the story should sit in. Drag the dots afterwards to reshape it, or drag from inside the shaded area to move the whole thing without changing it. If you'd rather start over, begin the new loop outside the shape you already have, since a drag that begins inside it moves it instead; Clear text area removes it altogether. Leave it undrawn and the story keeps its ordinary column, still over your Background.

The text follows the shape line by line. Draw around a doorway and the text fills the doorway; pinch the shape in the middle and the lines pinch with it. Where your loop closes completely, the page breaks there.

Under the canvas the editor tells you how much fits: "About 60% of a page of writing fits here on phone" - the ending names whichever device you're previewing, since the same shape holds a different amount on desktop. Two notes can appear beside it, and neither blocks saving:

  • The lines are narrow. It tells you the widest line the shape can hold, in characters. Comfortable reading is 45 to 75; narrower than that is fine for a few lines and tiring for a page.
  • A page doesn't fit. Nothing is lost and nothing is squeezed: your reader gets the passage a page at a time, every page in this same shape. Draw a bigger area if you'd rather they saw it in one.

Strength, backing, gap

  • Image strength: how strongly the picture shows through. Lower is calmer and easier to read over. Pictures and video only.
  • Text backing: a dark wash between the picture and the words. Raise it when the picture is busy and the text is fighting it. Pictures and video only, and it starts at 40%.
  • Text gap: the breathing room between the edge of your text area and the words themselves. It only does anything once you've drawn an area, and if you push it too far there's no room left for text at all, which the editor tells you.
Note
A flat colour skips the first two on purpose. There's no picture to fade, and a wash over a colour just renders a different colour than the one you picked.

Your own story colours

Turn on Your own story colours and you can set three separately: the story text itself, the headings, and the mentions - the glossary links inside your writing. Headings can sit brighter than the text under them, and mentions stay a different colour on purpose so a reader can still pick them out.

Leave the switch off and your reader gets the ordinary reading colours, which is the right answer for most Backgrounds: the text backing above is already doing that work. Reach for these when the picture is pale or warm enough that near-white text disappears into it. The editor warns you when the colour you picked is too close to the background to read comfortably.

Raising and removing one

A Background reaches your reader the same way every Dynamic Component does: a Trigger result pointed at it. Once raised it stays up. It follows your reader through the rest of the chapter and into the next one, until something changes it.

Two things change it. Another Trigger raising a different Background replaces it, and the Remove the background option takes it down and leaves the page plain. That option sits at the top of the Background list when you pick a Trigger result, and only there: it's something a Trigger does, not something you build.

Note
A scene that ends wants a Trigger that removes the Background, in the same way it wants one to raise it. Otherwise the deck at night follows your reader indoors.

What your reader sees

The Background fills the page the story is printed on, the reader's own menus and buttons stay where they were, and the text turns white with a soft shadow so it holds against a busy picture. If you drew a text area, each passage is set into that shape; if you didn't, the ordinary column sits on top.

A passage longer than the shape arrives a page at a time, each page cut to the same shape and landing in the same place over the picture. Your reader scrolls through it the way they scroll through everything else.

Published backgrounds are locked

Once a Background ships in a published expansion of a book, it locks: its row shows a lock icon and no longer opens for editing. Hover it and click Duplicate to get a copy with (Copy) appended to the name, and work on that. The original keeps serving readers of that expansion exactly as they bought it.

Validation

The list marks broken Backgrounds with a warning icon and sorts them to the top. The publish check rejects any book with an invalid Background.

  • Nothing to show. A Background with neither a picture nor a colour renders as nothing, so saving one is blocked.
  • The picture was deleted. Deleting media that a Background uses flags it and blocks saving until you pick another one, clear it, or dismiss the notice. Giving it a colour instead also clears the flag.
  • The text area is unusable. It has to be a single loop that doesn't cross itself, cover at least 10% of the frame, and be at least 30% of the frame wide somewhere. The editor names whichever one is wrong while you're still drawing.

Deleting a Background that's in use breaks every Trigger pointing at it. The editor warns you before it deletes, so you can cancel or fix the Triggers afterwards.