Case Study - Annenberg Social News Platform

The fast-changing world of modern journalism demands an innovative new web publishing platform that can push the boundaries of news reporting on the Internet. Using Drupal, the Annenberg School for Communication & Journalism at the University of Southern California (USC) has built the Annenberg Social News Platform (ASNP), designed specifically for the news publishing needs of tomorrow. The first news site built using the ASNP is Neon Tommy. USC Annenberg is widely recognized in the communications industry as a center for discussion among scholars and professionals in journalism, communication, public policy, media, and education. Annenberg's selection of Drupal as the chosen CMS platform upon which to build a model social news system is a testimonial to Drupal's stability and power.

Introduction

The Annenberg School for Communication & Journalism at the University of Southern California decided in 2009 to use the Drupal web content management system as the infrastructure for school-wide web publishing, student e-portfolio and interactive media projects. As part of this effort, the Annenberg Social News Platform was created to power the school's news incubator program websites, all of which are used to provide real-life, hands-on journalism and communications experience.

The fast-changing world of modern journalism demands an innovative new web publishing platform that can push the boundaries of news reporting on the Internet. Breaking the confines of a particular medium, journalists need to be able to present engaging stories as an integrated multimedia experience. Reporters and editors seek a streamlined publishing workflow that makes it possible draw on the flexibility of the latest digital media without having to deal with accompanying technical complexities.

Using Drupal, the popular open source content management framework, the Annenberg School for Communication & Journalism at the University of Southern California has built the Annenberg Social News Platform (ASNP), designed specifically for the news publishing needs of tomorrow. 

About The Project

The pilot news site for the ASNP is Neon Tommy. Neon Tommy is a web-only, Los Angeles-based news source sponsored by the Annenberg School for Communication & Journalism via the schoolwide student-supported incubator program known as Annenberg Digital News. Neon Tommy offers compelling, crucial and timely news coverage about issues of concern to Southern California residents, and is read broadly by readers across the country and the world.

In the coming months, other USC Annenberg news incubators will migrate their online presence to the ASNP. These incubators include Annenberg TV News, Annenberg Radio News, Impact (USC Annenberg's award-winning television news magazine) and Intersections: The South L.A. Report (a hyperlocal news Web site run by Annenberg journalism students in collaboration with local high school students and the community).

These news incubators are multimedia newsrooms that are operated, edited and managed by graduate and undergraduate journalism students of the USC Annenberg School for Communication & Journalism. They serve as news laboratories for ongoing and transformative innovation in the fast-changing world of journalism and as a vibrant sources of the very best in local, regional, national and international reporting and commentary. These news incubators provide hundreds of Annenberg students with a range of opportunities in a newsroom environment that is one of the largest in Southern California.

The Annenberg School for Communication & Journalism (Annenberg School) at the University of Southern California was founded in 1971 with support from Ambassador Walter H. Annenberg. Today the school has 83 full-time faculty members and 120 adjunct professors, approximately 2,200 undergraduate and graduate students, and two dozen research and public interest projects and programs. USC Annenberg is widely recognized in the Communications industry as a center for discussion among scholars and professionals in journalism, communication, public policy, media, and education. 

Urban Insight is an experienced technology consulting firm based in Los Angeles. Urban Insight has been working with Drupal since version 4.5, and is one of the largest Drupal consulting firms in Los Angeles, California.

The following is a summary of how the Annenberg School and Urban Insight collaborated to develop the USC Annenberg Social News Platform (ASNP) as the foundation for the Annenberg School's social news publishing requirements.

Goals

During the discovery and requirements gathering phase, we identified the following primary goals:

1. Help faculty, students, centers and programs embrace online media, delivering knowledge of these applications to students in the classroom;
2. Empower students by offering tools to manage content and rich media with ease;
3. Provide long term e-portfolios to all students;
4. Centralize user authentication control and provide tools for easier user auditing;
5. Support long term growth by building sites to handle high traffic;
6. Streamline upgrades and maintenance of online assets;
7. Gain experience in upcoming technologies, such as HTML5;
8. Assert both less and more control over content; and,
9. Standardize video storage, conversion and streaming.

Why Drupal?

We decided to build one website at the same time as we built the ASNP so that our technical decisions would be grounded in a real project. As the first ASNP project, the team selected the Neon Tommy website, which includes a broad set of requirements relevant to many other publishing websites operated by the Annenberg School. During the discovery and requirements phase, the team attempted to identify features that would be needed by other Annenberg School websites.

A major decision was the selection of the content management platform. Previously, we had been
using a variety of different content management systems for different types of content. We needed a single robust solution that could accommodate the diverse requirements of the project. We evaluated a variety of different content management systems including WordPress, MovableType, ExpressionEngine, and SiteCore.

As we evaluated the variety of content management systems available, we came to realize that Drupal had two key advantages:

1. Drupal modules provide the diverse set of features that would allow us to consolidate content from our existing systems.
2. The Drupal framework was exceptionally extensible, allowing us to build -- in a modular fashion -- anything that we couldn't readily find available.

The result is a Drupal-based platform specifically designed for running a flexible social news website with rich multimedia integration. Since the ASNP could be useful to other higher education institutions teaching journalism and communications the project team is exploring the possibility of packaging the ASNP as a Drupal distribution. This tailored open source solution could also be considered by professional news organizations that are interested in testing new models for news publishing. 

Major Features

Editorial Control Panel

One of the key challenges for the ASNP was to design a clear process for non-technical site editors to manage a large variety of different layouts for the home page and multiple section pages.

To solve this challenge, we developed the editorial control panel (ECP) which is the heart of the ASNP. This tool allows users to manage the content of the site using a graphical interface. Using the ECP, site editors can control the precise layout of stories to create different home page and section page layouts based on whatever the important stories are for the day or week.

There are four key concepts in the editorial control panel system:

1. Templates are built-in, pre-designed layouts that define the arrangement of visual elements on the page, but do not specify specific elements like individual story placement.
2. Storyboards define the specific story position and selection for a specific template. The system tracks an unlimited number of storyboards and each storyboard is based on one template.
3. Storyboards are made up of a series of box types that allow the user to customize content. The placement and arrangement of these boxes is saved to the template, but the specific content and customization of the boxes are tied to storyboards. 
4. The box type defines how the story (or stories) will appear and what additional content will automatically be included.

Using a combination of templates, storyboards and box types, editors can use a visual interface to create a wide variety of home page and section layouts. For editors who prefer not to craft individual layouts, an auto-populate option selects the most current relevant stories for display in the selected template.

Panels on Steroids

Why didn't we use Panels? Panels is a great module for custom layout, but the requirements of USC Annenberg's news incubators far exceeded the feature set Panels offers. The ECP is more than story placement -- it includes custom layouts for how various story parts will appear, additional related content based on taxonomy, custom external links and incredible support for rich media.

A Gallery of Galleries

One of the most impressive box types in the ECP is the meta-gallery box. This box allows an editor to select one or more stories to appear in a gallery. But this is a gallery of galleries, so instead of a single sideshow, it's a gallery of rich media elements.

Let's say you add three stories. The first story has an image slideshow, the second story has a video and the third story has a pod cast. The meta-gallery box automatically brings together each media piece into the meta gallery where the user can scroll between the rich media elements and control each element when it is in focus. You can have any combination and any number of rich media pieces in this gallery of galleries.

Rich Media Support

The most important goal of the Annenberg Social News Platform is to provide broad support for a variety of rich media through a high usable interface so that non-technical users are not intimidated by the variety of features.

Rich media support includes:

• Video from sites like YouTube and Blip.tv
• Custom videos
• Podcasts
• Custom slideshows (with audio!)
• Google Maps
• Zeitgeist Dashboard

Our favorite rich media features are:

One-click slideshows

Simply by attaching one or more images to a CCK field on a story, the platform generates a flash-based slideshow on-the-fly. Want audio? Just upload an MP3 to the audio CCK field fo the same story node. Captions can be easily added to slideshow by typing them into the description field for each image.

Precise media positioning

By extending the Video Filter module we included a feature in the rich text editor of the body field where you can insert with 1-click a text placeholder of where custom rich media elements should appear. You can place it anywhere in the body field.

Kaltura integration

Tight integration with the Kaltura platform, which offers enterprise-level, best-of-class video hosting support for high-traffic sites.

Automatic HTML5 detection

When we detect a browser that can handle HTML5, we embed podcasts with the HTML AUDIO tag rather than a Flash player.

Maps Integration

Many news stories have a geographic element that can be useful to display as part of the story, linking related stories over time in order to see trends. The social news platform uses the Google Maps module to allow editors to set custom markers, default map position, size and zoom for Google maps. This custom mapping is completed via a browser window from within the social news platform. When the editor has completed the map creation process, the attributes for the map are captured and stored as part of the story node. The map is then displayed to readers as part of the story package.

Zeitgeist Summary

Who is reading which stories? What content is most popular? What are people saying? In order to track visitor analytics in near real-time, the social news platform includes a trending summary dashboard. This dashboard publishes for editors automatically, showing updated statistics on popular stories, search keywords, common words (tags), top online chatter (by tallyingstory trackbacks) and time-based word-frequency trends.

Social Interaction

We used the Twitter module to allow easy integration with each news incubator's Twitter feed. We also built a custom module to provide the same functionality but for posting to the wall of Facebook pages.

Modules Used

The Social News Platform uses a large number of contributed Drupal modules. Key modules include:

• AddToAny : Included a comprehensive list of popular social bookmarking and aggregation services.
• Chaos Tools : A useful foundation to develop more sophisticated custom modules required for this project.
• Charts : Added ability to create dynamic visualization of traffic data.
• Fivestar : While many modules provide user rating features, this popular well-supported module's interface and display worked best for the site and
• Kaltura : We were committed to using open source solutions where possible and Kaltura provided what we needed along with hosting.
• Mollom : Mollom's well-supported spam filtering service was essential for allowing anonymous comments but keeping out spam.
• SlideshowPro : Provided flash-based slideshows that were configurable and easily integrated with our custom modules.

Other modules we used included Subscriptions, Twitter, Views, and CCK, and Location

Future Work

Neon Tommy, the first site developed using the Annenberg Social News Platform, launched on June 23, 2010. The team is already at work on extending the platform through the following features.

• Mobile integration, with display optimized for mobile devices like the iPad and Android-powered phones.
• iPhone/iPad integration, with an iPad application to enable editors to use the editorial control panel via iPad to create and publish new stories and layouts.
• We are currently preparing the Editorial Control Panel module and the Facebook Pages Wall modules developed for this project for release back to the Drupal community.
• HTML5 support for Kaltura video.
• Integration with MailChimp API using the MailChimp module to allow
  public users to sign up for newsletters and support sending email
  newsletters.
• Integration with Shibboleth for authentication.
• Use of cloud-based storage for storage of student files so that students have access to their media files and e-portfolio after graduation.

Our next project using the Anneberg Social News Platform is to extend the platform to support Annenberg TV News (ATVN), the University of Southern California's television-multimedia news operation which produced a live nightly newscast at 6 p.m., Monday through Thursday, that airs campus-wide.

We are currently exploring packaging and releasing the Annenberg Social News Platform as a Drupal distribution, to be supported and maintained by the USC Annenberg School and Urban Insight. The goal of such an effort would be to provide a model social news system for use by other educational institutions (and perhaps news publishing organizations) to teach journalism and communications.

Authors

The following team members contributed to this case study: 

• Wendy M. Chapman (wchapman), Director of Web Technologies, USC Annenberg School of Communication & Journalism
• Chris Steins (Chris Steins), CEO, Urban Insight
• Justin Emond (jemond), Senior Project Manager, Urban Insight
• Abhijeet Chavan (chavan), CTO, Urban Insight