i-7819242ea537da7d7df7dfbe11ced8aa-globe.png

Like most things in Boston, the Globe has a rich history with many innovations throughout the years. Moriarty talked about Charles H. Taylor’s prototypical content innovations in 1873, when the Globe added sports coverage, stocks, and many other sections that we now consider essential to a modern, family newspaper (and sections we may not expect today, like a separate section for women).

i-83e086e2d9f272abaf6d2b8d151f89a0-Screen Shot 2012-02-02 at 5.04.05 PM.png

Boston.com launched in 1997, and is one of the largest regional websites in the country. BostonGlobe.com launched in 2011 to great accolades for its use of modern code and responsive web design.

The new design also came with a new pay wall. The Globe’s strategy has been closely watched to see if a regional paper can convince online readers to pay for content (versus The New York Times’ success as an international brand). Three months after going live, the newspaper has acquired 16,000 digital subscribers, making it the most successful paid website launch yet in the United States.

Traffic on the new Globe site is much higher than anticipated. They’re seeing actual usage of more than 1 million users a month, and two distinct audiences have emerged. The newspaper audience skews older, with traffic spikes in the mornings and evenings as people sit down to read at length. Boston.com, meanwhile, is visited primarily by members of Generation X, who check it throughout the day, and is geared towards more page views, with photo galleries split across 10 pages.

John Davidow of WBUR notes that there’s currently only one ad on BostonGlobe.com. It turns out that the Globe sold out of all of the available ad positions in their first quarter. Demand and page views have each been higher than anticipated.

A Portal or a Newspaper?

Before splitting the newspaper from the portal, Moriarty’s team researched customers’ brand awareness. Boston.com and the Boston Globe are both considered up to date, local, and community-focused. But readers like the Globe to be authoritative and serious, with a traditional journalistic mission, while Boston.com users expect a more dynamic, personal, and entertaining experience. For almost 15 years, one website strained to reach both audiences. Many Boston.com visitors didn’t even know the Globe was associated with the site.

This led to the development of a two-brand strategy, culminating in a standalone site for the newspaper with its own pay wall, which went up in November of 2011. Sports and other features are still free on Boston.com, but the 300 professional journalists in the Globe newsroom generally publish behind the pay wall.

Surveys showed that paying readers wanted curation from editors, not a livestream of endless content. The hierarchy of news is important to paying customers: We pay for newspapers because someone else has done the thinking of what’s most important each day, and printed it on the front page in the appropriate size font.

But what happens to the portal? Boston.com is also evolving: It’s still free and heavily advertised upon. Some Globe content still gets “unlocked” on Boston.com, especially sports news. Boston.com now features a Groupon-style Deals section and more e-commerce. Since the newspaper split off, they’ve expanded their selection of content to 50 additional sources other than the Globe. But Boston.com is still trying to figure out the new normal, now that the Globe has split off. What role is there for a regional portal site in 2012?

Responsive web design

The site was designed from scratch with the understanding that mobile is the future, and new designs and websites should adapt naturally to whatever size screen you’re using. This design movement was sparked by Ethan Marcotte (a.k.a. unstoppable robot ninja) and his manifesto on the changing nature of web design.

i-e774a9f343f32ead06706c6081f76c90-Screen Shot 2012-02-02 at 5.06.36 PM.png

In the Globe’s case, responsive web design meant building six different versions of the site, starting at 1,200 pixels, and working down through traditional monitor sizes, the iPad, the Kindle Fire, and mobile phones. The easiest way for a rookie to understand responsive web design is to go to the Globe’s website, grab the diagonal corner of your browser window, and drag it back and forth, watching the content magically realign at your whim.

The site also detects and allows for your device’s unique features like swipe capability and offline storage features. The goal is an app-like experience within the browser. The benefit is a single codebase to rule them all, not to mention that all of your traffic is going to the same URL, which has proven great for search engine optimization.

Why doesn’t everyone build sites like this?

It’s still an emerging concept, and advertisement blocks pose challenges to the dynamic resizing. Like Google, the Globe team has placed their bets on the browser winning over apps in the mobile space, and HTML 5 has made more things possible.

Few sites have implemented responsive design this aggressively, so the Globe team came across some new challenges. They had six months and two development teams, Filament Group and Upstatement (and many working weekends). It’s still one of the most aggressive implementations of the responsive web design concept.

Future plans include making the site feel more app-like and offline use more natural. The Globe team feels like the browser lets them do most of what they want to do, as they don’t need deep integration into the device’s operating system.

The goal across the site is to let the journalism shine. They showed us some nice shrinkable galleries and 360-degree exploratory tools, none of it using Flash.

A Playlist for News

The Globe team paid close attention to how users acted on the Globe website. They noticed that people have a habit of opening many tabs of stories they want to read, and then progressing through them, closing them as they go. This discovery informed the design of My Saved, a sort of playlist for news content. Users have saved 60,000 stories across the site so far.

My Saved was built using the somewhat obscure Erlang programming language and Mnesia database, which allowed for high performance across every page on the site. Facebook Chat was built using the same languages.

Social Media

The Twitter accounts for the Globe and Boston.com combined have grown from 300,000 to 600,000 followers in the last year. They send out 30,000 tweets a month, and using TweetReach, they estimate they reach 20 million accounts each month.

Two genres of tweets have emerged at the Globe. First, there’s people following reporters because they’re interested in the beat. Then there’s the tweet-of-the-moment at live events like the Whitey Bulger proceedings inside the courthouse, where cameras weren’t allowed. They sought to capture details of the experience, from what kind of shoes he was wearing to the nature of his interaction with his establishment brother. News reporters outside the courthouse ended up reading the Globe’s tweets on air.

The live tweeting genre has posed new questions about what’s appropriate for a news outlet to write, for example, at former Mayor Kevin White’s funeral. The procession might be fair game, while a tweet from inside the service would trigger a #toosoon tag.

Man, or Muppet?

i-f715ec92209242802abe3cc0057006fb-puppets.jpg

Another transparency solution to courts barring television cameras comes from WOIO in Cleveland, where they’ve used puppets to re-enact transcriptions from trials. This leads to the obvious conclusion that we need a Bulger puppet, and likely a whole series of open-sourced public figure puppet designs (see also: NMA News, Bradley Manning puppet show, and BBC’s “The Hour“). In some seriousness, MIT Center for Civic Media’s Ethan Zuckerman noted, puppet lampoons work because it’s really hard to do TV reporting without video. You need actualities to be able to report an event, or it doesn’t get reported. Pastel court sketches don’t do very well on TV these days.

Data Journalism

Reporters like Matt Carroll have helped lead the Globe into the open data era. The Globe has produced data-driven investigations like “Boston’s Worst Towing Spots.” In a feature like this one, an investigative team might spend weeks on a story, where some of that time is spent developing the dataset. What starts with public government data might develop into Carroll doing a stakeout in Allston.

i-15829ebb6120b1ec7dd56098b810bb2e-Screen Shot 2012-02-02 at 5.09.45 PM.png

Another data-driven news feature is the Globe’s timeline of neighborhoods fragmented by public school divisions. As a parent in Boston, choosing a school for your child can be a stressful affair, as we previously learned from Nigel Jacobs at the Mayor’s Office of New Urban Mechanics. NUM’s approach was to dramatically improve the school lottery website, while the Globe built an interactive feature showing the radii of school districts with a neighborhood map overlay.

Other interactive pieces include an interactive audio piece where visitors can try their hand at a school spelling bee, and a timeline of occupy protests. The aforementioned paywall has made finding and linking to these features burdensome.

Competition Among Government, Journalists and Civic Hackers

This brings up the question of partnerships, fragmentation, and who maintains civic apps once they’re built. Nick Grossman, managing director of Civic Commons, pointed out the Discover Boston Public Schools app built by Code for America, and wondered who will sustain the app. The Globe team responded that, as a newspaper, these questions generally interest them intensely, but only for a short period of time, while Boston.com and the government have different needs. The Globe is, however, planning a Hack Day Challenge with Mozilla, Harvard Business School, the Department of Urban Mechanics, and others in town. They’re also building their own MBTA app using the public data, and expect it to be one of the best available.

The Globe also uses data to make intelligent decisions about content placement on the website. They have a tool that overlays clickthrough rates on the site, and as one might expect, their editors closely monitor these numbers throughout the day to determine which stories should get promoted. It has become one of many data points that goes into the editor algorithm.

The team lives by testing early and often. The My Saved feature came about this way, and user studies have shown that because BostonGlobe.com looks so much like a newspaper, visitors are often unclear that it’s being updated frequently.

The website is live, but the Globe team is focused on innovating up, down, and across the chain of news gathering and distribution. beta.boston.com showcases some of these experiments.

Real-time News

The overarching goal is to be ubiquitous across Boston, no matter what screen you’re looking on, in real-time. Chris showed us some real-time visualizations of Boston, some of them built by Grace Woo and the Viral Spaces group here at the Media Lab.

Grace also works in the Globe Lab. She took a real-time feed of geotagged Instagram photos and got them to pop up over a map of the city. The result was a very raw, honest window into Bostonians’ lives: People don’t necessarily know that their pictures are public when the submit them to Instagram. Tools like this replace the editor, and we see people’s self-reporting of their lives rather than breaking news: their new pants, their latest meal, live events.

The Instagram map has to account for the fact that people in different areas of the city produce real-time data such as Instagram photos at varying rates. The MIT section of Cambridge, Mass., for example, uploads far more frequently than less tech-driven areas of Boston.

The Globe team has also built what they call “tweets on a pole.” Six screens on a pole display what their people are discussing, what their competitors are saying, and so on. (Like Festivus, the pole sometimes displays grievances.)

The team is looking at various kinds of data they can use to tell the story of Boston in real time. They’re curating Twitter lists for individual events, such as a Patriots game. There are roughly 200 people in the newsroom, including a social media editor, who curates these lists.

Ethan brought up SwiftRiver, a system that tries to deal with multiple information streams when you have a rapidly breaking event. This platform is designed for an event in Syria with no one on the ground and 200 semi-anonymous incoming streams. How do we take the flood of information and weight and prioritize them?

The Globe teams imported Cascade from the New York Times Lab. (The Times owns the Globe.) It shows how tweets and other content proliferates across the Internet. You see a tipping point where sharing explodes. The Globe is starting to apply these features to advertising products, but they can’t go into detail on that yet.

More Fun Projects

Another project, Shim, allows you to load and view the same page on multiple devices at the same time. Node.js acts as a proxy that lets you take a bunch of devices and connect them all to one access point. They all stay in sync with one browser. (Click on a link on one, and all seven go to the link.) As you may have guessed, this project was developed while building the six versions of the new website. It lets news producers quickly see how a layout might work on, say, an iPhone.

Given the significant advances they’ve made in the emerging field of responsive web design, someone in the audience asked if they’ve though about open sourcing the design. They have, and, as a for-profit enterprise, they’ve also considered commercializing it.

Paper Eye lets people share articles with their phone by taking a photo of the physical newspaper. You take a photo of the print headline, and it fetches the digital link for you to share. Grace told us that Optical Character Recognition actually performed very poorly, so they’re simply matching the headline against a finite database of headlines. The New York Times is using Paper Eye now as well. It could defeat the ugly QR code, and serve as an in-between technology, for those Sunday mornings when you’re actively avoiding your laptop while you read the paper, but still want the link to the article you just read. I can’t find it online, but Grace has built similar technology with Travis Rich, Stephanie Yu, and Andrew Lippman with NewsFlash.

Journalists as Jacks of All Trades

Like other content industries, the news business has seen enormous fragmentation in devices and reading habits. Someone in the audience asked how the Globe manages where stories appear. On the production side, reporters are now writing stories with a web-first mentality. By default, stories now must include metadata and geo-coordinates. The first version of history is now written as a blog post, and may or may not go to print.

The editors have tried to divorce content creation from its final destination. At this point, that means ensuring that a traditional news article needs to have useful metadata, like location. Reporters now have to tweet, take video, write a story or blog post, and essentially act as jacks of all trade. The Globe has hosted trainings on individual skills as well as trainings on how to integrate all of these demands into your limited bandwidth at the scene of a story.

Local Expert or Global Citizen?

As a native Bostonian, growing up with the Globe every morning, I’m excited when I see the rest of the world linking to its content. By far the most common feature I see linked to elsewhere on the web is The Big Picture, the Globe’s high-resolution photoblog. But otherwise, the trend among newspapers is to focus on local content at the expense of global coverage (see, for example, this Media Standards Trust paper, which found that international reporting had decreased in every measurable way, while overall newspaper content doubled).

The pressure is on the side of writing for a more local audience. When information is available a tab away, are people going to turn to their wire story on Russia? Big Picture was an anomaly, as it was so early, and so good. The blog receives comments from around the world instantly after publishing a new post, as it features very global content.

Ethan noted, from experience, that while it’s very hard to start up a global news service, the local space is also extremely competitive. But, he asked, don’t you lose anything in the long run by focusing mainly on local content?

Bennie, Boston Globe’s managing editor, responded that the world is a big place, and that “New England is big enough for us.” The Globe’s readers trust them to curate and deliver what they need to know. A traffic jam at 6 o’clock will be a big headline on Boston.com, but not BostonGlobe.com.

The Globe has withdrawn from foreign bureaus, and now considers their Washington bureau their best stab at contributing to international press coverage. They focus on areas of core strength, like former Massachusetts Gov. (and now GOP presidential frontrunner) Mitt Romney.

Does it come in pulp?

The team says that the print edition of the Globe is here for the foreseeable future. Digital products have good margins, given that they’re not shipping dead trees around town, which is why the Christian Science Monitor moved entirely online. The Times and Globe still see demand for a print version, but may need to price it differently to account for the cost of delivery.

The extremely recent shift in people being willing to pay for apps and websites is an encouraging development (their words), and one that might hasten the demise of the print edition (my words). The Globe saw 2 million visits from iPad users in January, representing 5% of Boston.com’s traffic. As baby boomers pick up e-readers and tablets, print subscriptions might fall off beyond the point of profitability.

Updated: Our recent Civic Media lunch at MIT featured the digital team from the Boston Globe, led by Jeff Moriarty, vice president of Digital Products. He was joined by Chris Marstall, Marck Chang, and Grace Woo. They’ve just launched a new standalone site for the Globe, spinning off from the Boston.com portal and its ubiquitous pop-up ads. It’s not a redesign — they got to design a newspaper site from scratch in the year 2011, and the benefits of having a blank slate are evident in their award-winning design. (Here’s more background on that design from some of its designers.)

Correction: This post incorrectly stated the number of the Globe’s Twitter followers. The Globe and Boston.com Twitter accounts combined have grown to 600,000 followers.