The EditorSpeech Bubbles

Speech Bubbles

Add and style speech balloons in the PanelWave editor — ten balloon types, narrator caption boxes, inline text editing, tail control, character styles, and per-locale dialogue.

Speech bubbles carry your dialogue. In PanelWave they are real comic balloons — rendered by the same balloon engine the open-source player uses — so what you see in the editor is exactly what readers get. Balloons size themselves to their text automatically and inherit their look from a style cascade you control at three levels.

Adding a bubble

Pick the Speech Bubble tool

Select Speech Bubble in the tool palette (shortcut S), or right-click the canvas and open the Add Speech Bubble submenu.

Click where the balloon should sit

A balloon appears at the click point, styled by your work's default balloon style, and the inline text editor opens immediately.

Type the dialogue

The balloon grows and shrinks live as you type. Press Ctrl+Enter (or Cmd+Enter) or click outside to commit; Escape cancels.

The right-click Add Speech Bubble submenu lists every balloon type directly — Normal, Rectangle, Narrator, Thought, Shout, Whisper, and Connector are placed at the click point, while the placement entries snap to the panel border for you:

  • Narrator Top / Narrator Top-Left / Narrator Top-Right — a sharp-cornered narrator caption box, flush against the panel's top border (centered, in the left corner, or in the right corner), created without a tail.
  • Panel Top / Panel Top-Left / Panel Top-Right — the corresponding cut balloon types, whose open cut edge sits exactly on the panel border.

To edit text later, double-click the bubble on the canvas — the inline editor reopens, using the balloon's own font and size. You can also edit the text in the Inspector's Text field.

Moving, resizing, and the tail

With a bubble selected:

  • Drag the body to move the balloon — its tail moves with it.
  • Drag a resize handle to change the balloon's width or height — its Max Width / Max Height, which are the size the balloon is drawn at. Text that needs more room than the box is cut off; the inspector then warns "The text doesn't fit this balloon", and Fit height to text sizes the box for you. Resizing works symmetrically around the balloon's centre, also for a caption box that sits on the panel edge.
  • Drag the tail tip to point the tail at a speaker. The editor converts your drag into the tail's angle and length, and the tail base stays attached to the balloon edge automatically.

Fine-grained tail settings (position angle, length, curve direction, curve amount) live in the Balloon Style panel described below.

To move a bubble to a different panel entirely, right-click it in panel view and choose Move Bubble to Panel — the submenu lists the other panels by the same titles the structure tree shows. (The inspector's panel picker does the same and also reaches panels in other chapters.)

When you drag a Narrator or Panel Top caption box, the panel border is magnetic: within a small distance the box snaps flush to the top or bottom edge, the left or right edge, or the horizontal center — so hitting the border by hand is easy.

The ten balloon types

The Type dropdown in the Balloon Style panel offers ten shapes:

TypeUse it for
NormalStandard rounded speech balloon
RectangleCaption/dialogue box with slightly softened corners
NarratorTrue sharp-cornered rectangle for narration caption boxes
Panel TopBalloon cut flat along the panel's top edge
Panel Top-RightBalloon tucked into the panel's top-right corner
Panel Top-LeftBalloon tucked into the panel's top-left corner
ThoughtCloud-style thought balloon
ShoutJagged burst for yelling
WhisperDashed outline for quiet speech
ConnectorJoined balloon segment for multi-balloon dialogue chains

Caption boxes stay on the border

The Panel Top / Top-Left / Top-Right types are glued to the panel's top border by definition — the cut edge is the border. The editor enforces this everywhere: in panel view, in page view, after text edits, and after switching device formats, the top edge always sits exactly on the panel border (corners additionally keep their side). Narrator boxes re-glue to whichever border edges they touch, but you can also place them freely anywhere in the panel.

One work, many formats

Bubble geometry is stored relative to the panel artwork (the same normalized shape box the format defines), so a bubble keeps its position on every device format — author in DIN A4, and the balloon points at the same spot on the artwork in Square or Bigscreen layouts, in the editor and in the player. That also holds when the artwork changes: giving a panel its first image, dropping an image onto a panel in page view, or replacing the background keeps every bubble and hotspot on the same spot of the artwork (bubbles written before a panel had an image used to end up above or below it).

Lettering size is handled per format: text keeps the same comfortable reading size on each target screen — unchanged in A4-sized formats, moderately larger on big screens, smaller on phone formats — instead of growing with the artwork. Balloons re-measure around their anchored position when you open a panel in another format, so captions never end up half-empty or overflowing. The open-source player applies the exact same rule at playback time (see Balloon renderer), so what you letter is what readers get on every device.

In page view, panels are much smaller than in panel view, so balloons get a readability boost: they may grow until their text is comfortably legible at your current zoom, but never beyond three quarters of their panel, never below their authored size — and tail tips and glued border edges stay exactly where they belong.

The style cascade

You rarely style bubbles one by one. A bubble's effective look is resolved through four levels, each overriding the one before:

  1. Work default — in Work Properties, the Speech Balloon Style (Work Default) section defines the base style for every balloon in the work.
  2. Character override — each character in the Characters manager can carry its own balloon style. Assign a speaker to a bubble and the character's style applies on top of the work default.
  3. Balloon preset — a named style (caption, shout, voice-over, …) the bubble picks under Style preset; see Balloon presets.
  4. Per-bubble override — anything you change in a bubble's Balloon Style panel is stored for that bubble only.

Only the fields you explicitly change are stored at each level. That means restyling the work default, a character or a preset instantly updates every bubble that didn't override that field — across the whole work, in the editor and in the published player output.

If a bubble has its own overrides, a Reset to inherited style button appears under the Balloon Style panel. Click it to drop all per-bubble changes and fall back to the character/work style.

Balloon presets

A preset is a named balloon style you define once and give to any bubble — the caption look, a character's voice-over box, a screen readout, a shout. Presets are part of the format (settings.typography.balloonPresets, referenced by the bubble's styleRef), so they travel with exports and imports.

Define presets

Open Work Properties → Typography → Balloon Presets. Type a name (letters, digits, - and _; spaces become -) and click Add preset, then style it with the same controls as the work default. A preset stores only what differs from the work default, so changing the default later still reaches preset balloons in every field the preset leaves alone. Click a preset's name to edit it again; the bin icon deletes it. Save Properties stores them.

Give a bubble its preset

Select the bubble and pick the preset under Style preset in the Speech inspector (— None — removes it). Picking a preset drops the bubble's own overrides of the fields the preset sets — a caption that was a plain rectangle takes the preset's type, colors and font right away — and keeps the rest (its size, a hand-set tail).

A bubble that names a preset the work no longer has shows it as (missing) in the dropdown and uses the remaining levels of the cascade; Validation reports it. Saving Work Properties keeps presets and text-style presets that came in with an imported manifest.

Fitting balloons to their text

A balloon is drawn at its Max Width × Max Height. When the lettering grows (a larger font in a preset, say) or a translation is longer than the original, text no longer fits — and in a work with hundreds of balloons, resizing them by hand is no option:

  • Fit height to text — in the Speech inspector's Balloon Style section, for the selected bubble.
  • Fit All Balloons to Text — right-click a chapter in the structure tree: every balloon of the chapter, the open panel included.

Fitting keeps each balloon's width and sets its height to what its longest language needs (between 30 and 600 px of the reference size), so one fit holds in every language and — because sizes scale with the lettering per format — in every format. The balloon stays centred where it was. Fit again after adding a translation or changing a font.

The Balloon Style panel

Select a bubble and open the Inspector's balloon tab. Under Balloon Style you get a live preview plus the controls below. The preview is drawn by the same canvas renderer as the editor, from the selected bubble's real geometry — its text-measured box, corner radius, line wrapping at the bubble's actual width, and its tail — with the panel's live values applied and scaled down to fit (never enlarged). What you see in the preview is the balloon as it sits on the canvas. The work-default and character-style editors, which have no particular bubble to show, keep a generic sample balloon instead.

  • Type — the ten balloon types above.
  • Roundness — corner roundness slider (hidden for Rectangle, Thought, and Shout, which have fixed shapes).
  • Max Width / Max Height — the balloon's box size (in reference pixels, scaled per format). See Fitting balloons to their text.
  • Font and Font Size — comic lettering fonts, grouped in the dropdown.
  • Fill, Stroke and Text colors, and Border Width. Text sets the lettering color (black by default), e.g. amber letters on a dark on-screen display.
  • Tail — enable/disable, plus Position (0–359°, compass-style), Length, Curve (Straight / Curve Left / Curve Right), and Curve Amount. A Curve Amount of exactly 0 draws a straight tail even when a curve direction is set.
  • Hide Border Segment — hide part of the outline (set Angle and Arc Width), useful for balloons that bleed off a panel edge.
  • Reset to Defaults — reset the panel's controls.

Assigning a speaker

In the bubble's Basic Properties, the Speaker dropdown lists every character defined for the work (or — None —). Assigning a speaker:

  • applies that character's balloon style (level 2 of the cascade), and
  • shows the character's name as a small label above the bubble on the canvas, so you can see who says what at a glance.

If the dropdown is empty, add your cast in the Characters manager first.

Dialogue in multiple languages

Bubble text is localized. The Inspector's text field is labeled with the locale you are editing — for example Text (en-US) — and the locale switcher in the editor header changes which language you are writing. Enter each language's dialogue while that locale is active, or manage translations in bulk on the Localization screen. A balloon has one size for all languages: after translating, use Fit All Balloons to Text so the longest language fits. See Localization concepts for how fallback locales work.

How the editor handles the languages behind one bubble:

  • Every bubble keeps its full set of translations. The canvas, the inline editor, and the Inspector show and edit the text for the editing locale; switching the header locale redraws every bubble in that language at once, in page view as well as panel view (this is not an undoable edit and does not mark the work unsaved).
  • If a bubble has no text in the editing locale, the editor shows the work's default language (or the first available translation), so a half-translated page never renders empty balloons.
  • Edits are written back only to the locale you are editing; the other languages are untouched. Typing into a bubble never creates an empty translation, and clearing a field only clears that language.
  • Bubbles created before per-locale editing existed carry a plain string; the editor treats it as the work's default language.

The Balloon Style preview wraps and measures the translation you are currently editing, so it is a quick way to check whether a longer translation still fits the balloon's maximum width.

Audio and TTS

The bubble's Audio section lets you attach an audio asset (voice acting) or click Generate TTS to create text-to-speech audio from the bubble text. See Audio.

Conditional bubbles

The Visibility Condition section (Visible If + Build Condition) shows or hides a bubble based on story variables — for example, only show a line if the reader made a certain choice. Conditions reference the variables you define in the Variables designer; see Variables concepts for the underlying model.