← All posts Design · 9 min read

A field guide to mobile-first flipbook design

If you analyse the device split of any flipbook with public links, mobile is now the majority of traffic on most issues. Designing the flipbook desktop-first and then hoping it survives mobile is therefore designing for the minority of your audience. The mobile-first discipline is not new — web designers have been preaching it since 2012 — but it lands differently when the medium is paginated.

Designing for the thumb

The reader's thumb sits on the bottom right of their phone, which means the page-flip control sits there too in every well-built flipbook viewer. Resist designing CTAs in the same zone — readers will tap them by accident when they meant to flip. The safer place for the primary CTA on each spread is the right-third, slightly above centre, where the thumb naturally reaches when the reader pauses to consider. Test by holding your phone in one hand, like a real reader.

Also worth reading: our glossary of digital publishing terms is a useful jumping-off point if any of the vocabulary in this article is new.

Body type, big

The body-text size that reads as elegant at 12pt on print reads as squinty at 12pt on a phone, because the phone's effective viewing distance is about a third of an arm's length. Bump the body to 16pt in the source PDF and the flipbook renders comfortably on every device. Headlines can stay smaller proportionally; the reader will accept a tight headline if the body is generous. The bonus is that the same generous body type performs better on desktop too, where reading distance has crept closer over the last decade of laptop use.

Compare your stack: our independent reviews of the major flipbook platforms cover the trade-offs in pricing, custom-domain support and analytics depth.

Spread density, low

A print spread can carry 600 words comfortably; a phone spread tops out at about 350. Above that the reader scrolls within the spread instead of flipping, which destroys the rhythm a flipbook is supposed to create. Splitting a long article across two spreads instead of one is almost always the right call, and gives the page-flip animation something to do — which is the whole reason a flipbook exists in the first place.

Tooling we mention in this article

  • FlipHTML5 — Feature-deep flipbook platform with custom domains, analytics and rich interactivity.
  • Heyzine — Lightweight, fast flipbook tool that nails the basics at the cheapest paid tier in the category.
  • Canva — Design-first tool that exports any document as a fluid, page-turning flipbook.
  • Issuu — Veteran flipbook platform with its own discovery marketplace and strong publisher tooling.

Further reading

Open the step-by-step how-to library →