Tomelet

Design notes

How the crease became a spine

Every foldable phone has a line down the middle. For most apps it’s something to work around. For a book it’s the most natural thing in the world: books have always had one. This is how Tomelet’s reader learned to treat the fold as a spine, and the design rules behind it.

Free, with no account. Facing pages are part of the free reader.

The problem: a phone page, stretched

Open a foldable and a phone-shaped app simply gets wider. Lines grow too long to read, text runs across the crease, and a button can land on the fold. Close the phone and the screen is rebuilt, a page or a chapter from where you were.

Apple published design guidance with the iPhone Duo; Android has its own for foldables. They agree on more than they differ, and Tomelet follows both with one reader, on an iPhone Duo and on a Galaxy Z Fold. Five rules shaped it.

1. The fold is a reserved region

Apple calls the fold a reserved region: a part of the screen an app should keep clear. Android tells an app exactly where its fold is, and Tomelet puts the gutter between the two pages right there, keeping tap zones, buttons and selection handles out of it. A pen stroke that crosses the fold is split between the two pages, so each page keeps the ink that belongs to it.

On iPhone Duo, Flutter, the toolkit Tomelet is written in, doesn’t pass the fold’s position to apps yet (flutter/flutter#192515), so Tomelet centres the gutter on the screen.

That is the step from crease to spine. In a printed book nothing is printed in the gutter either. It’s where the two pages meet.

Two facing pages of a novel with one phrase highlighted in yellow on the left-hand page; the text on both pages stops short of the gutter.
Two pages, one gutter: the text stops short of the middle, and the highlight stays on its words.

2. Folding is not leaving

Apple asks for a continuous experience as the device opens and closes. Samsung asks apps to keep the scroll position and any text being typed. Tomelet treats a fold as a change of screen size, never as navigation.

Page numbers can’t survive that: the cover screen shows one page at a different size, so the book has a different number of pages after every fold. Tomelet remembers your place as a position in the text instead: the first character on the left-hand page. It lays the book out again and opens the page that holds that character, and the previous frame stays on screen until the new one is ready. Highlights, notes and ink are anchored to words, so they move with them.

Nothing reopens and no ad appears: folding never takes you out of the book.

3. Size, not rotation

The iPhone Duo’s inner display ignores an app’s rotation lock, and Android 17 does the same on large screens. So the way a phone is turned can’t decide the layout. Tomelet looks at how much room the page has: two pages when each one stays comfortable to read, one when it wouldn’t. The same rule runs on a tablet, a phone turned sideways and a desktop window.

The pairs come from print, not from a photo carousel. The first page stands alone, then 2–3, 4–5, so a spread the publisher designed always lands as one. Arabic, Hebrew and vertical Japanese books start on the right and turn leftwards. A fixed-layout book that declares an orientation gets a one-line hint you can dismiss; the reader never rotates your phone for you.

4. Posture changes the arrangement, not the book

Apple’s guidance says the hinge angle is “for interactions and effects… not for layout”. Tomelet agrees, so no page effect follows the hinge. What a posture changes, on Android, is the composition around the book.

On an Android foldable that reports it is half open, held like a book, you get one page on each side of the fold with the controls on the outer edges. Set the Android foldable half open on a table and the page moves upstairs while the controls move downstairs: page slider, contents, notes, appearance. It’s the Flex Mode idea, built into the reader on Android.

On iPhone Duo, Tomelet keeps the open-book layout at every angle, ready for the day Flutter passes the hinge state to apps.

5. The keyboard

Fold the phone with the keyboard up and the search field or note you were typing keeps its text, its focus and its caret.

Sharing the screen

Next to another app, in Split View on iPhone Duo or split screen on Android, Tomelet shows one page, makes no guess about where the fold is, and keeps its controls on the outer edges.

A pen in the margin

Apple is bringing Apple Pencil (USB-C) to both iPhone Duo displays, and Tomelet’s pen tools are ready to meet it: write in the margins of EPUB and PDF alike, highlight a line with one stroke, ink with the Pencil while your fingers turn, pan and zoom. Ink is anchored to the text, so a margin note stays beside its paragraph when a fold lays the page out again. A stroke drawn across the crease is split between the two pages.

What we didn’t build

Page effects that follow the hinge angle

A page shouldn’t wobble as you adjust your grip.

A second Tomelet window on iPhone

One window that shares the screen well is enough.

Why a spine

A book is the oldest folding screen there is. Its spine is where it bends, where nothing is printed, and where two pages agree to meet. Treating the crease as a spine wasn’t a metaphor laid over the engineering. It was the shortest path to a reader that behaves the way a book already does.