VectorPaint open-book illustrations: connect the spine, pages and fanned edges

English translation of the Chinese original, translated on 2026-11-08. Original publication dates, attribution, code and version notes are retained.

An open book has two page surfaces and a binding relationship between them. Repeated arcs alone can resemble a fan without a spine. Build an original blank book by establishing shared endpoints before adding a few page edges and text marks. This requires no automatic page turning, 3D model or book template.

Record the gutter and the two page regions

Create a 1200 by 900 pixel canvas. Place the upper gutter endpoint at (600,300) and the lower at (600,720). Approximate the left outer corners by (180,240) and (160,620), with the right page initially mirrored. These are illustration coordinates, not physical book dimensions. Mark the six points as separate pale references. Check that the outer edges lie on opposite sides of the gutter, without connecting one page’s lower corner across to the other. Save the initial draft and keep the title outside the book; do not substitute restricted real pages for this original exercise.

Close the two main page surfaces around a shared edge

Draw the left and right page surfaces separately with the pen, returning their inner edges to the same pair of gutter endpoints. Curve top, bottom and outer edges slightly if desired, without routing a curve across the gutter and merging the pages into one overlapping mass. Give them different pale fills first and inspect for unintended cracks without strokes, then add consistent fine outlines. Verify which page is selected during node edits. Moving a gutter endpoint requires checking both page paths; ordinary paths do not automatically maintain a binding constraint.

Reveal layered edges beneath the main surfaces

Add two or three page-edge traces beneath the main surfaces, exposing narrow strips along bottom and outer edges. Each should connect from near the appropriate spine side toward its outer edge, rather than radiating from one arbitrary canvas point. Prototype the left side and inspect whether traces invade the main text region. Shorten them or adjust stacking if they do; do not hide the fault under a thick gutter. Reuse the left structure for the right if helpful, then adjust it manually. Exact mirrored curves are unnecessary. A few clear edges should suggest thickness without dozens of lines forming a black mass.

Treat the gutter as a fold rather than a hole

Use a fine line or narrow dark band for the gutter, confining darkness near the fold instead of cutting a wide background-coloured channel through the book. The top and bottom of both pages should still return to their shared binding positions. If a tiny visual gap is desired, identify it as graphic separation rather than simultaneously describing the pages as perfectly joined mathematical planes. At reduced size, check whether the gutter overwhelms text marks. Narrow an overly dark band instead of thickening every text line to compete. The book silhouette should remain coherent with the dark band hidden.

Keep text marks within their respective pages

Use short strokes instead of real paragraphs, beginning with three to five lines per page. Vary their lengths without crossing the gutter. They indicate text placement and require no automatic curved-surface typesetting. Leave margins at both ends on each page; one stroke spanning the spread is not one line of page text. For an actual title, put editable text in a flatter region and test a short word first, without promising that arbitrary fonts survive every export. Group text marks with their page surface and inspect whether page-edge connections remain sensible when moving the page.

Recheck attachments when changing one side’s opening

Duplicate the draft for a second state and bring only the left outer edge inward while preserving both gutter endpoints. Rework its top, bottom, page edges and text marks, leaving the right page unchanged initially. Side by side, the states should show a different left opening rather than a horizontally squashed whole book. Therefore do not scale a group containing the gutter and right page. If text marks protrude, reflow their illustrative arrangement rather than suggesting that they pass through paper. These are manually constructed still states, not paper-elasticity simulation or automatic animation.

Check completion through outlines and actual output

Hide text marks, dark bands and references temporarily, inspecting the two surfaces and a few page edges for distinct spine, outer and bottom boundaries. Restore content and export a PNG at the intended viewing size while retaining the editable source. Open it to inspect white gutter cracks, merged fine page edges and text overruns. For canvas/output differences, simplify stacking and overlapping strokes in a copy one item at a time rather than deleting and redrawing an entire page. Describe a shared image as an original blank-book illustration; illustrative strokes are not readable real pages.

Troubleshoot cracks, crossing lines and dark edges separately

For a cracked gutter, inspect page endpoints before shadows. For edges crossing text, inspect path extents and stacking rather than blaming the export format universally. For thick dark borders, hide extra page edges and restore them one at a time to find overlapping strokes. If the two states seem to depict different books, check the gutter and unintended right-page changes first. Retain three forms of evidence: pale construction, undecorated outlines and actual output, each identifying the same attachment. Completion means recognisable opening/page structure, not a high decoration count.