A narrative design studio

IN a new year it’s always tempting to think about new beginnings, only later to realize that the calendar is arbitrary, and change is non-linear. This year in publishing there is great hope for new beginnings, and the fear if we don’t find the restart button, we many not have the established magazines and newspapers much longer.

Late in 2012, the death of the print Newsweek and the all-digital The Daily caused much harrumphing from the I-told-you-so crowd. “Print is dead, and the old guys just don’t get it.” Yeah, yeah, yeah. But these casualties were more the result of bad business models, bad management and bad content, than the general decline of the media.

Newsweek failed to preserve any of its equity under the Daily Beast regime, discarding the “news” part of its name. It lacked a multi-platform strategy (the Newsweek.com site was actually shut down when Tina Brown took over), and the rethought magazine seemed too little, too late. The Daily came on as a megaton app, with some interesting breadth, but with none of the depth of the great news sites. Distribution was limited to iPad, which even now misses 80 percent of the market. Strange that Rupert didn’t repackage the WSJ and the London Times instead of starting from scratch. It was more of a case of too much (in the sense of download time), too soon.

We should avoid generalizations about these deaths, but there are important object lessons, as we push along toward new models. While funeral notices flooded in, we started to hear background murmurs of a counter-trend. This was the arrival of some new stripped-down digital publications, led by Marco Arment’s The Magazine .

The idea is to put together a simple collection of articles, each with a bit of artwork, and wrap them into a small iPad app. Fast to download, and easy on the credit card. (The Magazine is $1.99/month, with a seven-day free trial.)

The estimable Craig Mod calls this form, “subcompact publishing,” named after the first subcompact, the Honda N360, a welcome rethink of the automobile after Detroit bloated their cars with so many features it is surprising they could even move.

Mod defined subcompact publishing in a November post with these characteristics:

• Small issue sizes (3-7 articles / issue)

• Small file sizes

• Digital-aware subscription prices

• Fluid publishing schedule

• Scroll (don’t paginate)

• Clear navigation

• HTML(ish) based

• Touching the open web

Hamish McKenzie, the alert reporter at Pando Daily, jumped on this idea, and pointed to a new example, The Awl’s Weekend Companion, an app spinoff from the content-rich website, The Awl.

“Premium micropublishing” is the term offered by McKenzie.  “Premium” means “not free.” A low-priced subscription model may allow bloggers to move up a step in the media food chain and get a little compensation. “Thanks to our increasingly mobile-centric reading habits,” he says, “subscriptions may be making a comeback.”

McKenzie cited the announcement of The Periodical Company, which started in a hack-a-thon and was inspired in part by Mod’s subcompact idea, and perhaps by Arment’s 60s-style generic brand name. Periodical is planning to offer “digital magazines as a service,” with a CMS and design themes, distributed to the web and to the iOS Newsstand.

Cool. It will be interesting to see the design. Mod’s model makes sense (except of course for the “scroll, don’t paginate” part). Mod likes readable publications in the way that Readability is readable. Nice, almost pretty Typekit fonts. Good margins. Lots of leading. One column.

The iPhone version and the iPad version of The Magazine.

The Magazine is designed in this style. It depends on the writing for excitement; it looks more like a journal or a diary than a magazine. In fact it is a reader, with the UI derived from smartphones. Simple one-column layout, and so stripped-down, to get to the nav on an iPhone, you have to scroll back to the top. On the iPad, the TOC scrubber is a drawer that rolls out when you hit a little icon in the upper left corner. Nevertheless, I like this experience better on the phone, which it is clearly designed for. The iPad version seems a little, uh, bland.

Mod got a great reaction to the subcompact idea, and he replied to some of the feedback, around the time The Daily perished. That thing was a boat, a 70s Mercury Marquis, fully loaded, and it deserved to be towed to the junk yard. But is the subcompact the answer, or just an answer?

The 1976 Mercury Marquis. I was going to show a 1967 model, but I kind of liked it!

Dan Neil’s review of the Ford Focus ST notwithstanding, what I want is an Audi 6 in metallic gray, or maybe a Cayenne Turbo with 500 horses and tough off-road tires. Particularly for a long trip, on and off the blue highways.

The subcompact is like a shower. It’s efficient and economical. But sometimes what you want is a Jacuzzi. Magazines are like that, too. While a brisk five-minute glance of sThe Economist in print, with its classic newsmagazine layout, can be refreshing and helpful, sometimes you want to dive into a more beautiful body of water, like Esquire, or Vogue., or the FT’s How To Spend It.

Mod is a fine designer (look at that web site!), but he may have been conditioned by growing up with a web that is a rushing stream of items. We’re used to this river of stuff from everywhere, served up raw by Google News, or nicely repackaged by Flipboard (where he worked for a while). You could get drowned in this flood of content, and never get clean.

Web sites have not provided that gourmet bathing experience (remember Wet magazine?!). Nor do the digital replicas of rusty old Mercuries that you see in the Next Issue app. The water comes out too slowly, and by the time you get in, the bath is cold.

This subcompact model won’t provide that either, useful though it may be very useful, for emerging digital-only publishers . . . and readers. In order to attract and keep an audience, publications, even niche publications, have found that they need more stuff: a variety of approaches and story lengths, and some strong visual content.

Mod doesn’t want to bulk up his little vehicle with a bunch of crap, but, as Mario Garcia pointed out in iPad Design Lab, people have come to expect a little digital fun in an app, every so often. (And advertisers do, too.)

Savory, our Treesaver-publication-as-service startup, has the ambition to be more than just transportation from Point A to Point B. Once we get a lot more themes and iOS and Android wrappers—planned for 2013—a Savory pub can be immersive, fun, and it will run on all platforms. The idea is to have a rich, immersive experience, which you don’t get on a Kindle, or The Magazine—except if you get swept away by the writing.

Okay, so maybe the Cayenne metaphor is a bit heavy, and eco-unfriendly. How about a plug-in Tesla Model S? Three-hundred mile range, and 0-60 in 6.5 seconds. That’s the digital publishing model I’m looking for.

BAD branding, of course. This is a design blog, so I won’t go into the confused voice and personality of the campaign. But Romney was cooked as soon as they unveiled that toothpaste RRR logo. It had all the quality of a logo on the “For Sale” signs of a big realtor in Ohio. (Maybe that was the idea.)

But after the widely praised big O of the Obama 2008 campaign, we are expecting better design from our politicians. A great leader in this Steve Jobs legacy era would have taken one look at the R’s and told them, “Get outta here.”

Of course a practiced corporate art director would counter, “It’s all about the applications.” Staging this logo successfully would have required a white, or near white background all the time. In a red-white-and-blue universe, you only get white one-third of the time.



A sign goes up at the Republican convention in Tampa last August. (Getty Images)

So the art department started adding a white border around the logo, creating an awkward shape that has all the grace of a dead catfish.

Typographically the Romney effort was a step up from McCain’s bland Optima trademark, last time around. That must have been specked by a left-wing mole who was told to come up with something well-designed and familiar. Like the Helvetica and Times Roman used for thousands of campaigns, the real problem with Optima is that is too familiar. The result, though, is a timid design that adds nothing to the effort.

Romney, taking more than a page from the Obama type book, came on strong.



After the convention, Romney-Ryan’s branded aircraft.

* * *

Those disenchanted with Obama over the past four years can point to the softening of the President’s own visual brand. Charged with the big Gotham “CHANGE” posters and the street-ready Shepard Fairey icon, it would have been hard to keep up that energy, particularly after four years of soft-and-elegant Whitehouse.gov typography.

But the slogo, (as David Berlow calls workmarks) became “FORWARD.”  Not so strong. (And wasn’t that period oddly small?) The last-minute addition of the bang at the end, the correct punctuation for this imperative, was the typographical October Surprise. It may not have been responsible for the last-minute uptick in the polls, but it could not have hurt.

The Obama team, which believes that that the groundwork is what counts on election day, deployed thousands of cards set in Hoefler Frere-Jones fonts. But so did the Romney people.



Michelle Obama at a Forward! rally



A Romney rally has plenty of type signs, too

Romney matched Obama’s HTF Gotham with HTF Whitney. (The logotype is set in Adobe Trajan, to give that nice Presidential dignity.)

While Obama used a serif font a lot more in 2008 (with a Perpetua logo), we didn’t see much of the HTF Sentinel, chosen for 2012. It was all Gotham. But there was plenty of it.

In Salon David Rainbird wrote about the strange move by the Romney campaign to block his opponent’s messaging—with fonts from the same foundry. “Whilst Obama freely admits to borrowing some of Romney’s ideas, like Massachusetts healthcare reform, Romney wouldn’t dare admit to stealing anything from Barack. But the Massachusetts governor is clearly cribbing from Obama’s campaign typographic strategy.”

When Obama’s squad rolled out a non-HTF script font, so did Romney—Wisdom Script (evidently failing to get a license for it, according to a report in the Content Strategist. Obama also added the gothic, Revolution, perhaps to provide a little relief from all this “good design.” It’s based on old Cuban graphics.

[This paragraph was updated on Election Day. Revolution and the script, MVB Mascot, are described in a post on Types in Use.]

* * *

The end result we’ll know election night. When you have millions of people out of work, and big structural problems in Washington that are preventing any solutions to our problems, the choice of fonts and the visual branding of candidates may not seem to be important.

But in an election this close, bad branding may have been the stick that broke the Republican elephant’s back. On one side we have a comprehensive, relentless, “good design” approach that makes the brand police and the Design Observer bloggers happy. On the other an imitative typographical program that failed to create “Real Change.” Can a great nation elect a President with a bad logo and copy-cat typography?

I left it to the people to decide.

AT the Cleveland conference of the Society of News Design this week, I was honored with the SND Lifetime Achievement Award. I was surprised, since I am not one who has toiled in newsrooms my whole career. Which is maybe why I can keeping putting energy into news design. And I am truly grateful for this award. The SND is the one organization devoted to the idea of visual journalism, which is something I believe in.

I got to thinking about what’s worked for me in this field. It’s always been a struggle, never more than now, to get publishers and owners to understand that readers want visual content in their news publications, as well as text. And to get them to understand that the art director’s role is more than just “presentation,” important as that is.

Here are the ten work rules I’ve collected over the years that may serve the new generation of publication designers.

As Grocho said, “These are my principles. If you don’t like them, I have others.”

1. Pages.
News design is not just about page design anymore.  I’ve been thinking about the design rules—the relationship between text and pictures, headlines and text, and the styles that mark different kinds of content.

2. Content.
As Lou Silverstein said, “Ask yourself what is the news content before you take a design to the desk.”

3. Information.
To succeed as a visual editor, you have to be as well- or better-informed on the news and political issues than the text editors. The way to stay ahead of changes in the media world is to be a reporter—observe everything as you go.

4. History.
I wanted to know the history of newspapers, printing, type and graphic design. By standing on the shoulders of others you can see farther, and avoid starting over.

5. Design equity.
Hold on to the good parts of a publication’s design. Some papers and sites have redesigned so much, readers can’t recognize them.

6. Inspiration.
Design ideas come from the real world—the city, art, and nature—not just the design world.

7. Technology.
Technology is your friend. A designer doesn’t have to code, but I had to know understand how code works, and what I can do with it, to make the transition to the new world.

8. People.
The best news design happens when the process is open and the best ideas get published. I never just handed out sketches, but worked with the team. And if the team is happy, you get great design.

9. Readers.
The best publication designers think of themselves as the agents of readers. They are in the newsroom to get the content across to the end users.

10. Life.
With all the stress around deadlines, the meltdown of the media and the economy, it’s easy to get lost in your work. Somehow I’ve been able get outside often enough—for me it’s to the ocean or the desert—to keep a little perspective, and have more fun. And to spend some time with my partner in life, Foster.

THE New York Times released an HTML edition for the iPad this week, without much fanfare. Of course, the HTML crowd was enthusiastic. Mediabistro (not as breathless as the clipped headline on Google News indicated—“The New York Times’ New iPad Website Could Mean End of Apple. . . .”) wondered if this meant that the paper would phase out its iOS apps.




The Times’s new web app home page

This HTML app takes it place beside the daily paper, the web site, the iPad app, and mobile apps for iPhone and Android. They share design elements, but there are interesting, sometimes annoying differences. I use all of them, and am as any critical as any reader who started reading the paper in the days when the logo had a period, when many of my friends preferred the Herald-Tribune. I bow to long-time readers as the ultimate judges of publication design, and I qualify as a sharp critic as a subscriber to The Times for nearly 50 years. Plus, I spent four years at the paper in the early 80s.



The iPad app home page

In printed publications, a brand is made from the written voice, the editorial perspective and the visual personality of the pages, including the type. As a typographer I’ve always felt that the core element is the body type, and my job as a designer is to make a publication easy to read. In the case of The Times, Lou Silverstein chose the Intertype font, Imperial, while he was still promotion art director. It never occurred to me to change it, since it printed as well as anything on their ancient letterpresses and cheap paper. By then, Imperial was The Times, at the reading level.

In the digital arena, a reader’s direct relationship of the brand is similar to print, and the body type is a readers direct connection to the content. Of course on the web you didn’t get much choice of fonts until recently, and The Times picked Georgia, when Microsoft introduce it with the web “core set” in 1996. The same typeface was used on The Times  iPhone app, and then the iPad app, and it seemed that Georgia, too, was The Times—until the Android came out, and they had to substitute Droid Serif. Whatever you think of Droid Serif, it is not The Times.

There is an additional branding component: user interface design, UI, or user experience design. (I reject the UX term on the grounds, as I have said before, because if design is not about user experience, then what the hell is it?)

So while the designers can strap together cross-platform products like the newspaper, the web site and the apps, the UI is going to be different due to constraints of the OS and the devices—and different definitions of the products.

*    *    *

This new product is more like the mobile apps than their native iPad app. It has a one-column layout with scrolling stories, which I hate since I always lose my place. There are UI experts like Oliver Reichenstein who swear by scrolling. Nevertheless with scrolling you can’t do multiple-columns without enraging even Reichenstein. This new web app sidesteps that issue. When you turn the iPad to landscape view, there’s enough room for another column, but the app fills moves the story index to a sidebar, and starts the first story in the remaining space. There should be an iPad law:

Content in landscape view = content in portrait view.

These landscape section fronts look cluttered, particularly if there is an ad. The landscape story pages get crowded with an ad, sidebar on the left, and vertical chrome on the right. The web app begins to look like, uh, a web site.




The section front portrait, and landscape

Worse, it places ads at the top of stories, not just the section fronts. It’s like the whole news report was written by . . . Lincoln. (And that is one ugly grill on that car.) In the old days of church-and-state, this would never happen. (I’m lighting a candle for the late Punch Sulzberger.) It’s even worse than the the two-column iPad pages I complain about it, where you see ads at the top of a page—next to a picture.

It’s a relief when you get to a full-page ad, which you can swipe past. Sadly, it’s the same Lincoln, and the same ad, page after page.



A full-page ad

Ignoring that car, let’s start reading. You can swipe sideways to get to a new story. To get to a new section front you tap on a little grid icon that you find in the side chrome. (The Times is consistent across platforms with icons.) A list opens on the right side. On the iPad app, you tap the screen to reveal the chrome at the bottom, hit the grid icon, and get a section list—on the left side of the screen. Hmmm. The web app sections are one-column lists; to get to the next sections you swipe horizontally. On the iPad you swipe vertically to get to the new sections.

Did the designers imagine that readers would use just one of their products? You can argue about the mobile style here versus the ebook-like approach to the native app. But here’s another universal truth that they missed:

UI = your brand.

Readers (customers) move across platforms. I pick up TThe Times on desktop, mobile and tablet. I can’t be the only one who expects that the interface that I learned on one should be useful on the next one.

*    *    *

Let’s back up for a minute.

Ten years after I left The Times, it became an early entrant on the content web, and has since made steady improvements, including the gratifying success with the paywall. It’s worth a spot check of the Way Back Machine  to see how they’ve moved the ball down the court. The site continued to change as screens got bigger and content more complicated. The last big redesign was done with the help of Razorfish in 2006. The work is often credited to Khoi Vinh, but he arrived at the end of the project. Some say that the final result was produced more in-house that with the outside agency. The design added more structure, smaller display type, and more items on the home page and section fronts. While it has been tweaked by Vinh and his successor, Ian Adelman, it’s remarkable that it has not needed to change more. The mark of a good design.

With the authority, scope and range of The Times, NYTimes.com became the most important news site in the world, yet many in the newsroom were not satisfied because of the tension between newspaper values and web values. The design differences point out the conflict. The layout of the print product is able to show the editors’ priorities. There are nuances of presentation according to importance and tone of each story.

The web site seems the same every day, and by the time you see it, the moment-in-time of the last night’s “close,” has passed. So the breaking news headline . . . is gone.  Frequency and currency trump perspective and background on the web. It’s more a matter of “this just in” than “you gotta read this article.”

The day after the first Presidential debate, the paper ran a five-column headline in Cheltenham Bold Italic. This signaled it was an important story, but not earth-shattering news. On that kind of day, the type is bigger, and Roman caps, not Italic upper and lower.

On the site, you lose those priorities and nuances, and the same with the iPad app. The home pages on the mobile apps—and this new HTML app—are little more than story list. (For a number of news web sites, I’ve designed alternate “big news” home pages, but they always forget to use them.) Every home page looks much like the last one. And very story—news, opinion or long feature—looks alike.

I have a different experience with each product. If I happen to pick up a printed newspaper after I’ve “finished” reading the paper on the iPad, I find things I missed. And I enjoy the the section fronts, find features inside that I didn’t see. Among other things, information graphics are still not translated very well into the digital targets. What I am looking for is a richer, more satisfying experience. This HTML app moved the wrong way.

*    *    *

So,  a web site is not a newspaper, and an iPhone app is not a web site, and an iPad app is not an iPhone app. (Neither is an Android app, but that is another kind of problem.)

On one level, you don’t even want to read a web site the way you read a paper. Half the time you are “parachuting in” from a link, and never care about the home page. And how often do you actually read to the end of any story on the web? The publisher’s efforts to inflict page views on their readers drives them away. The anecdotal statistic is that a story loses half of its readers on every page jump.

Web sites are great for browsing headlines, finding facts, sourcing data and making transactions. Long-form reading? Not quite there. Out of habit, due to the development history, and as a result of the design—we just don’t expect to read on a web site. E-books and particularly the Kindle, showed an alternative digital format, made for reading, but few web site designers took note.

I think the apps miss something by not bringing people to stories via links. At Sporting News http://tablet.sportingnews.com you can share a link in the iPad app that sends people to the Treesaver edition on the web. The analytics show that people tend to read all the way through these stories—and then go on to look at more of the publication. It’s like giving a friend a magazine folded to the story you want to share, rather handing them a clipping. (And they might even see an ad.)

In the double-0 decade, Microsoft, like Sony and others, experimented with e-books and related devices like tablet PCs—focusing on reading. Six years ago, before the whole smartphone thing took off, Microsoft persuaded TThe Times to build “The New York Times Reader” (which I helped design, as mentioned in previous posts). The idea was to make a digital edition that was as easy to read and just as immersive as print. The company had spent some time on the body type issue, and had come up with ClearType, a sharper font rendering scheme, to improve screen readability. The home page on the Reader was more like a front page than a home page, and content was divided into pages that advanced horizontally by clicking a button, like a Kindle. It was a Windows app. It used Imperial for text, and Cheltenham for headlines, like the paper. Sadly, it never caught on.

While the Reader adapted to different screen sizes, it only worked on Windows. A scratchy, bulky Macintosh version was made in Silverlight, but it didn’t catch on either. (I think it was a PNG-flipper, a horrible precursor of the Adobe Digital Suite.) Then Adobe came to the newspaper and offered to rebuild it in Flash, or Air, so it could work on both Macs and PCs, and The Times said, “Sure.” But that also didn’t catch on, internally or among readers, although you can still download it from The Times. http://www.nytimes.com/content/help/extras/downloads/downloads.html#tr

Nevertheless, the project made a big impact on my thinking, and lead to Treesaver, which is the Reader concept turned into an HTML app, and designed to be responsive so it fits on all screen sizes.

*    *    *

The Times did launch an HTML effort two years ago, which no one mentioned in the news about this new app. It’s called “The Skimmer.”  http://nytimes.com/skimmer As a freestanding web app, just called “NYTimes,” the Skimmer was distributed through the Chrome Web Store, and still is.

The Skimmer doesn’t have the printy feel of the Reader, but it has right fonts, and it’s responsive—up to a point. You can resize windows on a laptop, it works fine on an iPad, but this web app fails on the iPhone. It just goes blank.

The new app, too, is not fully responsive. Right now its restricted to the iPad. I can’t guess why. You get a an error message when you try it on an iPhone, “Sorry — to log in or install this app, you must be on an iPad® running iOS 5.0 or later.” Never mind that you might be running iOS 6.0 on the iPhone.

So now the Great Gray Lady has added one more target for its distribution system.  One asks,  what are they up to?  Most news organizations don’t have enough developers to keep up with the updates for just one of these clients. The Times has over 100 coders. They’re managing the iOS apps, Android 2, 3, and 4 apps, plus the Kindle and Nook versions, and the huge web site including these web apps and the cool Opinion section which, while not responsive, actually looks different, and more elegant than the news sections.

This big tech staff built their own CMS. I have no idea how it connects to the printed paper, but it does manage the content feed to all these targets with consistency and zero down-time. If you compare the home pages of all the apps, they are running the same headlines in Cheltenham.

With designers as good as Adelman and Tom Bodkin, the AME for design, we can expect more products and more design improvements. Their challenge is to unify the UI, and to design distinctive templates that respect the differences between news,  opinion, and feature stories. If, among the big publishers, The New York Times can’t find a way to bring ab immersive reading experience—and the fun of looking at newspaper—to all these targets, then I don’t know who can.

WHEN we started Treesaver two years ago, I suppose it was natural for me to think of it as a step in the evolution of my publication design work. Treesaver is a publication platform, and I had been designing big magazines and newspapers since the 70s. The genesis of the idea came during a design assignment for Microsoft—The New York Times Reader. That’s where I first met the great Filipe Fortes, and after MS killed the project it was Filipe who suggested that “we” could in HTML.

As Filipe wrote the code, I took the idea around to my friends and acquaintances in magazine and newspaper publishing, to all the big groups—Hearst, Time, and The Washington Post Co. I remember one big presentation at the Condé Nast building on Times Square for about 30 editors and designers. Among them was Fred Woodward and David Remnick. The meeting was set up by David Carey, then publisher of Portfolio, who I knew from a tablet PC project for the New Yorker.

There were a number of advocates of Treesaver there, including a group from the Wired.com web site, but the print folks won out and they decided to go with the Adobe Publishing Suite, which converts an issue of, say, Vanity Fair, to an iPad app that weighs half a gig. (How did that work out?)

That story was repeated at Time and Hearst. The web folks were generally interested, but the print guys kept thinking of digital publishing as something like the print product—created with the same workflow. So they went with Adobe (with or without Woodwing) for the iPad. Yet there was no multi-platform strategy, just separate strategies for different targets—the web, mobile and tablets.

There were similar meetings at other big publications. Some ordered up a “proof-of-concept” editions. Sporting News, part of Advance, gave us a major commission, the Treesaver hybrid iPad app that launched a year ago. Now it has several hundred thousand regular users and big advertisers. The un-promoted web version of the app can be shared by Pad readers—to people who don’t have iPads. This publication is published daily with a 5:00 pm update. In a heavy sports season, with all the team pages that a reader can include in a personalized edition, Sporting News can have 1,500 iPad pages. And all this is done without a production staff. Treesaver does the layout.

So while I was thinking that Treesaver was a success, it wasn’t really catching on quickly with my traditional clients. Not that they had any better ideas, the big publishers just weren’t ready to commit to a multi-platform strategy.

Savory launched with two design themes, one for magazines and one for news publications. The department grid from the magazine theme “Glossy” is seen (at about one-third size) on a MacBook Air, an iPad and an Android phone, the Samsung Galaxy Nexus.

Then, late last year we got a call from Milan. A small server-side developer called ZephirWorks had become fascinated with Treesaver. They integrated the open-source code and grids into a Ruby on Rails content management system, Locomotive. This made Treesaver feasible for small publishers—or for experiments at the bigger companies without a big commitment of resources.

Andrea Campi and Andrea Granata, the principals of ZephirWorks, had complete command of the server side of the effort. They were ready to set up a hosting service, like a grown-up version of WordPress. They asked if we could help with the front end, with the design of the templates and the web site. They wanted to call the start-up Savory.

The more I talked to the Andreas, the more I liked the idea. I missed them when they first came to New York, but Scott Kellum, the first designer-developer at Treesaver, met them and was enthusiastic. So we set up a joint-venture on a virtual handshake.

Of course we thought it would take no more than a couple of months to build Savory, but it took eight. This is a true bootstrap. Neither partner spent a lot of money—just time. And last week Savory launched.

The theme designs started with grids from Scott, tweaked by Mike Mitra and Kevin Muncie. Mario Valencia built the web site (conventional at launch, but soon full responsive). If you don’t like the design, you have to blame me.

The Milan team built out the CMS beautifully, with good on-screen cues. And they wrote user guides—in English—that really helpful. They designed the server structure and the e-commerce part. At launch, the site is based in Europe, with transactions in Euros. This fall, the U.S. server should be up and the dollar-denominated payments enabled.

And so Treesaver is making a pivot. While I’m still talking to my friends in the established press about big Treesaver editions (two meetings this week!), Savory is the entry-level platform that people have been waiting for. The first to contact Savory are editors and publishers outside the big groups or refugees form them; weekly and alternative newspapers; what I call the digital-onlies; and non-profits.

These publishers and wannabes are the future of publications. They “get” the social media, crowd sourcing, iterative live content, and the idea that readers increasingly want to participate in a conversation rather than just sit there and read.

Savory’s feature set was kept pretty lean to get through the launch. In the pipeline are variations on the themes, new features, and new designs. Check it out, and let me know what you think of what we’ve done, and what you want to see.

As we used to said in the 60s, it’s all about to happen.

ADVERTISING has been ruining the design of content web sites for nearly 20 years now. Crazy clutter, disorienting push-downs, annoying forced page-views and scary teeth-whitening ads combine to make an repelling UI brew. It’s all a result of the unlimited inventory of web pages driving prices to the bottom—moving publishers to take anything that comes in.

Can we stop the ugliness from creeping onto the iPad? Of course publishers welcome an increase in ads, but readers can see that as clutter. Content apps like the Los Angeles Times have started copying the useless banners. (Think, “Ringtones!”) Polished news apps like BBC or the Washington Post Politics settle for a single ad position: a banner across the bottom of every page. That’s easier on readers than disconcerting interstitials and unstopable pre-rolls on the videos.

For ad layout, the big print magazines came from the other direction—from print. Zinio-style “digital replicas” were easy for publishers, and the ABC let them include digital circulation in their totals. The user interface was easy; nobody ever had to read an info-graphic to learn how to operate a magazine. Zinio followed the process onto the tablet, and offered the first magazine newsstand on the iPad.

So far so good. Swipe to turn pages, like an e-reader, and when an ad comes along, take a look, and if you aren’t interested, keep swiping.

Titles from Time Inc. and Condé Nast upgraded the magazine-on-the-tablet approach, using Adobe’s Digital Publishing Suite. Whatever you think about the download size and readability issues (David E. Wheeler convincingly condemned those last spring), nevertheless the the ads work well as print ads. Or no worse.

A simpler, cleaner extrusion of a print magazine is the app for The Economist, which is fast to download, has clear, resizable body type, and advances through pages like a Kindle. Pages work in portrait or landscape, with no vertical scrolling except for the balky contents page). Ads are presented as simple full screens—no partials allowed.


Two pages from this week’s Economist iPad App. Of course, it’s not a spread.

Publishers and ad agencies wanted more on the tablet, if only so they could charge more. They missed the “interactivity” of web ads, and were afraid that ads needed to be more assertive to be effective. Ads appeared in places such as The Wall Street Journal app that interrupted the reading experience. Like pop-ads on the web, a simple swipe wouldn’t advance them, you had to find that “Back” button.

Over the last six months, we’ve started seeing a paradigm that could be come the winning standard. The ads are full-page ads that work like those in The Economist. You just swipe along until you get to a full-screen ad, and then you can stop or keep going.

WSJ has more complicated navigation, moving up, down and sideways, but the simple full pages ad are working.



An HP ad right after a WSJ section front. It links to the mobile version of the HP site.

TheSporting News, which runs on Treesaver, has pushed the idea another step. The publisher offered sponsorship deals to advertisers such as Toyota and AT&T. Sponsors get prime positions, including “inside covers,” bumpers between big stories, a sprinkling of partial-page ads to provide immediate editorial adjacency, and branded features like scoreboards


The cover of The Sporting News app, is followed by an interactive “inside cover ad.”

Now with with 250,000 downloads, the daily magazine has plenty of positions with as many as 1,500 pages a day (if a reader orders up coverage of every league and every team). But they carefully limit the sponsorship avails so that readers are sure to see the ads. The result is a scalable model that may actually turn digital publishing into profitable business.


An inside page, with a spot for Toyota that links to an iPad-friendly web page. Note the big honking “Back” button.

The key is that sponsors can do more than they can in print. Readers can click buttons that changed the colors of a new car without turning pages. In a recent issue of Huffington, Toyota ran a game. I didn’t bother playing it, but it was a cheerful addition to the magazine, which is one of the best converted print magazines, except that they don’t bother to print it first.

At the simplest level, advertisers just include a big button that links to an iPad-friendly web page.

As the model gets traction, sponsors are building mini apps purposefully designed for the iPad—or are fully responsive. For example, the Toyota ads in The Sporting News iPad app look fine on phones—and laptops. (You can see the publication outside of the iPad, here.)

This is the digital equivalent of bind-in ad sections. The payoff is a shopping cart at the end of the insert.

The New York Times app is showing off a mini app from Charles Schwab. Still sparsely coated with paying ads, the Times has sold Schwab multiple app positions including spots—over several days or weeks.


This friendly mini app for Charles Schwab, can lead a reader right into a branch office.

There are some rough spots in getting sponsorship packages to work. The Times, suffers from a bad combination of too few templates and too few ads. The result are some awkward pages. For example, you often see a story where a single picture is jammed up above a house ad you’ve seen a dozen times before—today. This layout in the Times ended with a partial text page. With no premium on space, it would have been easy to enlarge the photo on the second page—and kill one of the house ads. When you look at the story overall, you wonder why they can’t write some rules into the code that (1) doesn’t crowd the art, and (2) doesn’t allow filler ads to be endless repeated.

Often the house ads run above the text—which in the old days was against the law.

I can’t complain too loudly about this situation, since a very similar page shows up in The Sporting News, and for the same reason—not enough templates, too few rules. Above, you may have noted a Toyota spot in SN that is placed above an editorial picture and text. This is just wrong.

But these details can be worked out. The important thing is to see sponsorship emerging in a number of iPad publications. The strategy avoids the unreadable jumble of the content web and create new opportunities for advertisers to connect with customers.Scarcity is key. But the big win is that shopping cart at the end of the mini app.

We have a new chance to make digital advertising work for readers—as well as publishers and advertisers. Let’s not blow it this time!

TRYING to ignore the Facebook IPO was like closing your eyes during the train wreck scene in The Greatest Show on Earth, even watching it on TCM 50 years later. The columnists, bloggers and pundits have offered every possible explanation of the kerfuffle, from banker greed to technical hangups. The root problem was simply that they set too high a strike price.

Ross Douthat, who occupies the William Safire desk on The New York Times Op Ed page, wrote with some satisfaction about the IPO fizzle. Like many pundits he doubts the company’s value proposition. “The Internet is a wonder when it comes to generating ‘cheap fun,’ but because ‘so many of its products are free’ . . .  the online world is rather less impressive when it comes to generating job growth.”

Well,  that has certainly been true for journalists, as Douthat points out, but stock prices are seldom a function of job creation, and by itself a low employe count won’t hurt Facebook’s valuation—at a P/E ratio of 100. (Apple’s is around 14.)  Nevertheless, like AOL and Yahoo, Facebook shares will have a great ride despite the awkward IPO. More billionaires will be made before reality sets in. (Fréderic Filloux has a long list of reasons why it won’t last forever.)

In the meantime, we had better get used to it. As the internet continually expands, like the universe, at an increasing rate, there is a need for ways to make sense of it all. And there is something reassuring about having a familiar home page when you open a browser. Facebook can provide that (or the app equivalent) and populates it with your “friends.”

Portals were invented as self-contained places that have everything you want, although now it seems that they are more like Residence Inns than self-contained resort destinations. AOL, MSN and Yahoo(!) are all still doing better than 100 million U.S. monthly uniques according to Comscore—and while they may be in decline, still book revenue in the billions. Yahoo started as a “directory” of web sites, and now has its own newsroom and sports site, and magazines like Shine, which I never hear mentioned. Yet Yahoo it says it gets a 1.65 billion monthly page views.

AOL of course predates the web, and we tend to forget that it started as a PC app with a dial-up connection and internal e-mail (I was assigned the user name Roger1000). As such it provided a series of important early social networks, and was copied by Microsoft (MSN) and even Apple (eWorld). When the commercial web got started in 1994, AOL became the first big internet service provider (ISP), gradually adding more content until now it is a concatenation of its own topical areas, acquisitions like TechCrunch and Huffington Post, and affiliates like Sporting News.

MSN is much bigger and, like Yahoo offers mostly its own content, with a few partners like Fox Sports.

Facebook is a different kind of portal, focusing on connecting its users (who already have e-mail addresses). Its idea of content is really shared content, links posted by users and their friends, and by advertisers. Every company now has a Facebook page, but I hate it when they ask you to be a friend, or even to like them. Most Facebook promotion pages seems to be just that, very thin promotion pages with very little content. But now it is essential for every cause and company to have a Facebook presence, and if they are paying attention it is a way to get some feedback from customers, users, viewers . . . or readers.

My tendency is to think of the online content world as split between web sites, apps and Facebook. This may be too coarse a division. The apps are now divided among iOS, Android (including Amazon’s and the other variants of Android) and soon Windows Phone. Facebook is not the only portal. There are the old portals just reviewed, and now there are bunch of mini-portals, helper-apps or view-portals as I like to call them, all hoping that you will make them your guide to digital content and to the coarsing river of Tweets and Facebook postings. They aggregate content and news in what they hope will be an interesting and useful blend. Flipboard, Float, Zite, Flud, Pulse, Taptu, Trove, News.me, Digg Mixer, Stumblupon, Hitpad, News360, Readability, Instapaper and Pocket, to name a few. (There’s an interesting chart of these players on the Globe & Mail site.

It is this full-tilt rush of aggregation that makes many think that the molecule of digital content is the story, a one-celled organism. We follow links from our Twitter and Facebook feeds, all the recommendations on the web, and in apps, and just go to one article at a time. But this a simplification, too. People want the whole animal sometimes. As with digital music, which has devolved from albums to songs for the most part, written narratives can be found and shared, but often you want the whole album—or the live concert performance (which for musicians is now where the money is).

More to the point, the money for written content providers is still in print, and it is dwindling fast. And, like musicians, writers and photojournalists are not going to make a living from single downloads.

A shared link to a story is analogous to getting an analog clipping from an old-fashioned friend. But sometimes I want to share the whole magazine, or the whole section of the paper. Most the web sites just don’t make you want to keep reading, and if you are at the airport and someone suggest you check out an app, sometimes the bandwidth is just not with you. And the view-portal “editions” (e.g., AOL Editions) all look alike. I want the Economist to look different from The New Republic. And I want a long think piece in the Washington Post to look different from breaking news.

We need to define a more evolved organism in the digital world, a better “publication space.” Readers like a place place where they go to take a short dip in some good editor’s narrative flow, in some fine curator’s collection of pictures, and just get lost in the stories.The New Yorker iPad app comes close (if you ignore the inconsistent UI and the hellish file size). For a news site, I am still happy with the Sporting News Treesaver edition, and when a freind shares a single article there, the link takes you to a story that’s sitting . . . in the publication space.

This is a big design challenge right now, getting this right. If we do, and do it quickly, the business model will follow. An attractive, immersive digital publication can attract real sponsors, and paying readers.

In a future post I’ll try to set out in more detail what it will take make this publication space not only survive but flourish in a world where Flipboard is just a syndication deal for publishers and Facebook is not the destination, but simply an entertaining and sometimes gratifying social layer.

LIKE an ROTC cadet, I spent two days last weekend at the Poynter Institute “Revenue Boot Camp.” The idea was to take a fast course in building a profitable business model for content sites. And I am delighted to say it worked. Wendy Wallace at Poynter packed in a full semester course on Monetizing Digital Content in two days.

It was great, in any case, to go to a conference where I did not have to speak. That changes the whole dynamic. You can just sit there and try to learn something.

I had no real expectations about this Boot Camp, but it sounded like a good idea considering how stressed the legacy news industry has become as its business model melts away, and how challenged digital publications are to be profitable. I was curious to see how Poynter’s main mission, training working journalists, was surviving the change.

This non profit institution was founded by the publisher of the St. Petersburg Times (now the Tampa Bay Times), Nelson Poynter. I’ve been coming since I was at The New York Times—attracted by a superb graphics program in the 80s, led by the great Mario Garcia. And it was Poynter that I met my partner, Foster Barnes. So I like the place.

At Nelson Poynter’s death in 1978 the newspaper ownership passed to his Institute. For years this excellent regional daily, which became the largest in Florida, fueled an effective and influential school for working journalists. More recently the non-profit set-up may have saved the Times, and at least prevented it from being sold to a chain that later became bankrupt. As newspaper profits evaporated, the Poynter Institute was itself stressed, and last year the trouble was compounded by a series of internal missteps that led to the departure of Poynter.org’s star blogger, Jim Romenesko.

In the background Poynter may be straining to come up with their own revenue strategy, but they put on a revenue seminar with a good deal of tactical tips for digital startups.

The program lead off with Mark Briggs, who has a new book out, Entrepreneurial Journalism . Briggs, a Poynter fellow and a co-founder of Serra Media which makes software for hyper-local sites, is now in charge of the digital side KING-TV in Seattle. He dived right into the degree of reluctance (mixed with ignorance) with which most news folks approach business. The idea of becoming an entrepreneur has about as much appeal to journalists as it does to Marxists. The sentiment is reciprocal; certain business people would say that all journalists are Marxists.

Briggs quoted David Boraks, founder of DavidsonNews.net, a lively and successful local-local site: “Journalism is an entrepreneurial venture. We’re not the future, we’re the present of local journalism.”

Mike Orren, founder of Pegasus News in Dallas and now a consultant,  followed with a rapid-fire briefing on making money at a small content site. Every. Possible. Which. Way.

His tactical approach was persuasive, although a publishers have to gate their time and resources according to what works best and what does not. Cheap network ads go into the latter category. Don’t imagine they are going to fund your operation, unless you’re Google or Yahoo, Orren said. Don’t talk about CPMs to advertisers. Instead go for sponsorship. Show a big advertiser how to build a relationship with your readers.

“Selling ads to someone who doesn’t believe in advertising is like getting an atheist to go to your church.” Orren said. “First, get them to go to any church.”

Bill Mitchell, who heads the Poynter entrepreneurship program, and Jeremy Caplan, another Poynter fellow and director of an entrepreneurial journalism at CUNY’s J-School, added a tactical quick-course on subscription revenue.

Chris Seper, founder of the thriving vertical, MedCityNews, stepped up next, with a similarly astute and rapid-fire tactical presentation focused on how how to exploit premium content with partnership deals ranging from custom publishing to “paid posts.”

This is not what Rafat Ali meant when he started Paid Content. (He showed a slide from the Way Back Machine when that startup was just a blog called Paid.) At the high-point of the conference Rafat shared his lessons of doing a startup, and gave a bunch of solid, Tweetable pointers to the Poynter audience. I Tweeted three:

: “Anytime you use the words ‘data’ plus ‘dashboard’ you get money. Investors love those terms.—@rafat #RevCamp

: “Intelligence is a word investors also like.”—@rafat #RevCamp

: “People will never respond to [a pitch e-mail] that’s longer than the longest Facebook status update you ever wrote.”—@rafat #RevCamp

To a rapt room, Rafat gave a personal account of the roller coaster of startup emotions, emphasizing it takes a certain amount of guts. If you don’t want to charge up your credit cards, you don’t want to get into digital publishing.

A good attitude in the face of all of it is essential. “If you are not foaming at the mouth when you tell your idea to an investor, then you are not motivated enough,” he said.

Rafat sold Paid Content to the Guardian at the right moment, although the buyer, like many buyers, had no real idea what to do with the company. After eight years, he is moving on to a new startup, Skift, a data-based travel site, and is now closing on a seed round of funding. Sounds like a much better investment than Facebook.

The 25 publishers and wannabes in the seminar were swept away with the conversation from the whole seminar—with topics like fundraising, revenue and how to handle “paid posts.”

The take-away for me was the conviction that out in the long tail of digital publishing, you want every kind of revenue you can get. Subscriptions. And sponsorship.

Missing from the seminar was much talk about design, or promotion. But, hey, if you are going to pack in a whole semester course into two days, something is going to fall off.

If Poynter can continue to provide content as useful as the Rev Camp, it deserves to survive. To do that, it’s going to have to have its own revenue boot camp, and find a business model that will continue to great Nelson Poynter legacy.

IT’S GRATIFYING when someone you disagree with comes around to your point of view, even part way. Recently Scott Dadich, now the Vice President of Content Innovation at Condé Nast, changed course on the design approach for iPad magazines. “Instead of building a product and a workflow to support,” he was quoted saying in Paid Content, “we’re trying to flip that to build a workflow and a system to support these multiple design outputs . . . adaptive content.”

This lesson was learned the hard way at Condé, by spending a lot of money and getting a very small return. There are customers for the apps, and there are advertisers, but the cost of producing them pixel-by-pixel, extruded from magazine layouts, is prohibitive. And while the iPad has 90 percent of the tablet market, there’s the smart phone market to consider. As a yardstick, the social portal Flipboard added 20 percent to their iPad audience the first week after launching their iPhone app. And an Android app might bring more.

Dadich was interviewed by the alert Paid Content correspondent, Robert Andrews. In another post, he defined the problem: “As publishers extend their print titles to iPad, they can choose either to repurpose the paper originals, which can seem lazy and ill-suited to the touch screen, or to custom-produce interactive apps with a native interface in mind, which is expensive.” Mike Goldsmith, editor of the British magazine Future, told Andrews that if his magazine group made custom apps for all their 60-plus titles, it would “bankrupt the company.”

Meanwhile, Dadich, who called Ready-Media templates “a huge setback for designers and magazine makers,” is talking about adaptive design. He may still want to design all these magazines by hand, but the move to multi-platforms has led to some rethinking of production time and budget. He now realizes that that print and digital editions need to be designed together. The goal is “to take a piece of content and put it on 15 different screens and still have a very consistent look and feel.” Which means: “Print considerations are really being heavily influenced by design conventions in [the] tablet.”

Condé is an Adobe partner, and Dadich is looking forward to CS6 and the liquid layout feature that adapts page layouts to different screen sizes and proportions. (There’s a video demo from Adobe Max with the Paid Content story, and also on YouTube.)

Once you start working with adaptive design, you use templates whether you like it or not. A plain template contains the geometry and the style sheets to make a page. An adaptive template adds the rules that make these elements work together on different page sizes—and maintain the feeling of the design. As with dynamic web sites which have been around for a while, a designer realizes that the combination of changing content and frequency forces you to use templates. There is no time to do everything by hand. Changing the target page size adds complication. Adding updates and news sections adds more. So you tend to limit the number of different kinds of pages, and settle on a reasonable number of templates that can be adjusted to fit the content.

I’ve yet to try the Adobe offering, but the video shows two important features. With its liquid layout, the Digital Publishing Suite creates a single file instead of separate files for landscape and portrait views on the iPad and other size screens like the seven-inch Kindle Fire. And rather than pictures of text, the new DPS uses fonts. This should make the file size of these DPS apps much smaller than the half-gigabyte tonnage that the Wired app is famous for.

The idea that Adobe is making adaptive design tools is a delightful thing. Designers are familiar with Adobe tools, and magazine designers will find it easier to make the transition away from fixed-size page design if they can do it in InDesign.

But whether you are writing code or the software does it for you, adaptive design requires a different mindset. It’s not page design as we used to know it. Now we have to think about the relationship between the elements—between the pictures and the text, between the headlines and the decks and so forth. Defining the rules that adjust these relationships is the essence of adaptive design. With InDesign, the designer will set the preferences for the “struts and cushions,” just as a designer twiddles the CSS knobs and switches in Treesaver or adaptive HTML.

You can’t worry about the exact position of objects, the “pixel-perfect” details of page layout. Instead you concentrate on the visual content and the things people have come to expect on web sites like the ability to share and comment.

Scott Dadich and other magazine designers took Ready-Media for one-size-fits all design, and they didn’t like it. But this venture is really about adaptive design, which has more to do with the way you use templates than what they look like. Now Ready-Media is working on adaptive web sites that match the print design themes. When the new version of DPS is released, we’ll produce templates for Adobe’s liquid layout as well.

Most customers supplement Ready-Media templates for InDesign with hand-built elements, and/or customize the designs to fit their needs and their taste.  Customers can carry their design style sheets and content tags from print to web to tablet to smart phone—or back again.

This doesn’t mean print is going to disappear, or that hand-built design (what I call artisanal design) is over. But publishers who want to distribute on print and on the web, or on tablets, or smartphones, or all of the above, will move to adaptive design.

And Adobe is in position to take a good crack at this market.

But Dadich and other Adobe customers will continue struggle with the workflow. The solution (“a workflow and a system to support these multiple design outputs”) is not yet defined. InCopy or Woodwing can handle InDesign workflow, but what about the web site? For example, what if Condé Nast thought it would make sense to merge the resources of Wired.com and Wired magazine. Would they still have two content management systems?

Smaller publications, or publishers who are moving from the web toward the tablet (i.e., Slate) may find the Adobe solution print-centric, resulting in a cumbersome workflow and big file sizes for each issue. I doubt an Adobe liquid layout edition will weigh as little as a CSS-based adaptive web site—or a Treesaver edition. If you think like a web designer/developer, then you favor adaptability, currency, interactivity and speed over pixel-perfect design.  And then you’ll want to connect a social layer, aggregation, heuristic filters, personalization, subscriber account management—and ads.

The logical workflow is to put the content in the center, manage it with a neutral CMS, and connect the staff so that they can assemble different products on different platforms. My colleagues at Ready-Media and a number of developers in the Treesaver community have been working to integrate open-source CMSs, such as WordPress, Expression Engine, Drupal and Locomotive.

I’ll write more on content management as we get closer to announcing CMS options. In the long run, the workflow tail may end up wagging this dog.

Meanwhile, I’m happy that a talented and influential designer like Scott Dadich is talking about adaptive design.