Wired & Vogue iPad

No playbook

The iPad launched in April 2010. Six months later, Wired UK became the first magazine in the UK to ship a native iPad edition. There were no design conventions for this, no tools built for the job, no one to learn from. We were working it out as we went.

Adobe had killed Flash. The only available path was Adobe Digital Publishing Suite — a beta tool purpose-built for digital magazines that had never been used in production in the UK. We were its first real test case, and for a period we were the only team in the country using it.

Building the workflow from nothing

Because DPS was in beta, I was feeding back to Adobe weekly — bugs, constraints, missing features — and they were iterating. The skills required to make this work didn't exist anywhere else in the UK. There was no one to hire who already knew it, no tutorials to follow, no community to ask. We figured it out by doing it.

What we built: magazines with animated covers, embedded video, image slideshows, GIFs, and gesture-driven navigation between articles and sections. Producing each issue meant designing and bundling the entire app ourselves — designing and developing simultaneously, compiling each edition like a software release.

Working directly with Apple, we secured placement on the App Store homepage at launch — meaningful distribution for a product that had no established category to sit in.

The decisions that defined the format

The hardest design problems weren't the layouts. They were interaction conventions nobody had established yet.

Portrait or landscape? Wired launched supporting both orientations — every layout designed twice. The production overhead was unsustainable and the experience felt inconsistent. I made the call to go portrait-only. A single considered orientation was better than two compromised ones.

How does a magazine navigate? Print readers turned pages. Web readers scrolled. The iPad was neither. We had to design navigation signifiers from scratch — visual cues telling readers to swipe down through an article, across between sections, and into interactive content. We tested these with users, adjusted, and tested again.

Single column, not double. Wired launched with double-column layouts — the magazine convention carried over directly. A few issues in, the problems were clear: screen dimensions were smaller than print, and double-column fights reading direction on a touchscreen. When I moved to Vogue I made the call to go single-column, reading downwards, closer to a website than a replica magazine. It was the right decision and it shows in both videos — Wired's double-column against Vogue's single-column reading experience.

Vogue — leading from expertise

When I moved to Vogue, I was the only person at Condé Nast who had shipped an iPad magazine. I built a team of three designers, taught them the Adobe DPS workflow from scratch, and set the design direction as Lead Designer.

For Vogue I made a different orientation call than Wired: landscape. Fashion photography and video are horizontal — shoots are composed for landscape, and the full-screen editorial video Vogue needed played better in widescreen. The decision was medium-specific, not a contradiction of what I'd done at Wired.

I worked with the Creative Director, the Editor, and Condé Nast's head of digital, presenting work and defending design decisions at each stage. I also edited the promotional videos myself — the same hands-on, end-to-end ownership I'd brought to the production workflow at Wired.

Impact

• DMA Digital Magazine Awards 2011: Wired won Best Overall Digital Magazine and Best Technology Magazine

• DMA Digital Magazine Awards 2011: Vogue won Best Fashion Magazine

• Finalist, Digital Designer of the Year across both titles

• Featured on the App Store homepage at launch, negotiated directly with Apple

• UK's first native iPad magazines both Wired and Vogue launched before any comparable UK publication

• ~2,000 downloads per month at launch; later rolled out to all print subscribers

• National press coverage and outdoor advertising Vogue iPad promotional video ran on the London Underground and on large-format screens at Liverpool Lime Street

Looking back

What I'd do differently: Push for portrait-only on Wired from the start rather than learning it through production overhead. The decision was right; it just cost one issue of dual-orientation work to get there.

Where it led: This was the first time I owned something from technical constraint to shipped experience — understanding a new medium, building the toolchain, making format calls, testing with users, presenting to senior leadership. Those instincts run through everything I've done since.