moleitau.work

BERG: Mag+

An approach for bringing paper magazines to digital media, with a special focus on touchscreen tablets — built with Bonnier and launched as Popular Science+ on the first iPad.

A Popular Science cover, 'The Human Jet', rendered on a touchscreen tablet resting on a breakfast table

The Mag+ video prototype imagined a Popular Science issue on a touchscreen tablet — December 2009, a month before the iPad was announced.

Company
BERG
Year
2010

Mag+ was an approach for bringing paper magazines to digital media, with a special focus on the touchscreen tablets we could all see coming.

Team: Jack Schulze, Matt Webb, Timo Arnall, Campbell Orme, Nick Ludlam, James Darling, Lei Bramley, Phil Gyford, Tom Armitage and Tom Taylor.

BERG began working with Bonnier R&D in October 2009 on what reading a magazine on a tablet might feel like. We made a video prototype that December — a month before the iPad was even announced — to think the experience through as a piece of film rather than a spec. When Apple revealed the device on 27 January 2010, we had a head start, and raced to build it for real. Popular Science+ launched on 3 April 2010, the day the iPad went on sale in the US.

The original Mag+ video prototype, December 2009 — made before the iPad existed.

Five principles

Underneath the work were five ideas about what a digital magazine should protect from the world of apps and browsers:

  • A magazine is mono-task — a calm, single thing to do, so we gave it a ‘silent mode’ away from notifications and the open web.
  • An issue has a clear structure — a beginning, middle and end you can feel.
  • Reading is built on fluid motion — direct, gestural, never modal.
  • It should be comfortable to read for a long time.
  • And it should feel like one thing, not a pile of separate articles.
A flip-chart sheet covered in red and blue pen, mapping reading gestures
Mapping the core gestures — a vertical 'read' axis crossed with a horizontal 'look / browse' one, and a two-finger push-up for the service drawer.

Thinking through making

We worked fast and physically: taping up pieces of real magazines and filming them with an iPhone to test layouts at full size; making video prototypes with live-action footage; and mapping every interaction as a gesture before writing a line of code.

A studio wall with printed magazine spreads pinned above hand-drawn wireframe storyboards
Working the structure out on the studio wall — printed spreads above low-fidelity interaction sketches.
A BERG specification sheet titled PopSci, showing greyscale reading states and gesture diagrams
Interaction specification sheets for PopSci+ — reading states, the 'dog-earing' gesture, and section breaks.

To make it real and repeatable we built an authoring system, tools that flowed straight out of InDesign, an e-commerce back end, and a new file format (‘MIB’) for issues.

An iPad running Popular Science+ showing a 'Touch Is Key' article, next to a MacBook running the iPhone Simulator
PopSci+ running on a real iPad, next to the build environment, around the April 2010 launch.

Steve Jobs liked it

When Apple showed off what the iPad could do, Steve Jobs singled out Popular Science+ — built on Mag+ — as an example of the kind of reading experience the device made possible. Praise from an unexpected quarter for a tiny London studio.

“Steve Jobs Loves Popular Science+ on the iPad” (Popular Science).
Mag+ live, with Popular Science+ running on the iPad at launch, April 2010.

Mag+ went on to spin out of BERG as a publishing platform in its own right — but the part I remember is how much of the future we got to feel out, on paper and on film, before the hardware to run it even existed.