In-Fisherman.com

Transcription

In-Fisherman.com
CASE STUDY
In-Fisherman.com
Presented By
5755 North Point Pkwy – 60
Alpharetta, GA 30022
P 678.580.1690
F 770.360.5776
www.mediacurrent.com
ABSTRACT
Mediacurrent collaborated with InterMedia Outdoors, Inc. to redesign their family of interactive websites
using the Drupal content management system as a foundation. This required the migration and
restructuring of content from several websites hosted by a legacy content management system (CMS.)
The result was a fresh, modern web design and a social network that allowed Intermedia’s users to
access a vast repository of content quickly and easily.
COMPANY PROFILE
InterMedia Outdoors, Inc. (IMO), is the leading multimedia company serving the needs of outdoors
enthusiasts. The IMO brand boasts the largest network of websites (16 total) dedicated to hunting,
shooting and fishing; a portfolio of 15 magazines including powerful brands such as In-Fisherman, Florida
Sportsman, Guns & Ammo, Petersen’s Hunting, and Fly Fisherman; 25 market-leading television
productions; 2 syndicated radio shows; 200+ hours of television programming and one television network
– The Sportsman Channel. InterMedia Outdoors serves the interests of 80 million devoted sportsmen in
the pursuit of their passions.
CHALLENGE
In-Fisherman.com is the premier online destination for anglers worldwide. The site serves to complement
the print magazine In-fisherman, a 30 year staple in the outdoor publishing industry. In-Fisherman.com
was initially built using a proprietary CMS that was inflexible and troublesome to customize - features
such as social networking and tagging were difficult and time consuming to implement. However, these
challenges played into the strength of Drupal.
The aggregate site traffic of IMO’s portfolio of sites reached nearly 100 million page views during the first
6 months of 2008, and numbers continued to climb. More specifically, the In-Fisherman.com site
averages 67,789 user visits, 266,379 page visits, and an average of 4:1 page visits/user visits in a typical
month. Thus, scalability was at top of mind throughout the project.
WHY DRUPAL?
The decision for IMO to use Drupal came after an unsuccessful attempt to build out In-Fisherman.com
with another CMS. The deciding factors for selecting Drupal were:
ƒ
Scalability - Drupal was perceived as the most scalable and extensible open source option.
ƒ
Cost - No licensing fees.
ƒ
Multi-site / multi-database architecture - Drupal’s flexible multi-site configuration would allow IMO
to store content and user data in multiple databases for a single site. Multiple databases would keep
distinct areas of the site operational in the event of database failure from server load. The user data is
stored in its own database and the gear/angler/www sites are set-up to seamlessly pull user data
from that separate database.
ƒ
Hosting - The expected traffic for the site demanded a low-cost enterprise level hosting environment.
Drupal and the LAMP stack were a natural fit.
ƒ
Flexibility - IMO’s previous CMS was inflexible, making it difficult to implement new and innovative
features. Drupal’s modular framework, API and theme override capabilities made it the top choice.
ƒ
Theme customization - Drupal’s separation of presentation and business logic through the theme
layer allowed the In-Fisherman.com UI to undergo significant revisions during and after development.
ƒ
Active development community - A fragile economy encouraged open source software vs. a
proprietary vendor solution. IMO was looking for a community with solid leadership and momentum.
In addition, the Mediacurrent offices were local to the project stakeholders and allowed for enhanced
interaction.
GOALS
In our initial planning sessions, several primary goals were indentified. The most important success
factors included:
1) Usability – Create an engaging web experience for users by leveraging IMO’s vast repository of
sportsman-related content and video. The new site functionality would take user participation to a
new level.
2) Branding – Provide a more modern, contemporary look and feel that reinforced the magazine brand.
3) Content – Give anglers the ability to quickly find the information they’re seeking by using a well
defined taxonomy structure and lists of articles tailored toward a user’s individual preferences. This
needed to work for both anonymous and registered users. The objective was based on articles the
user has previously visited as well as interests specified in a registered user’s profile.
4) Scalability – Build with scalability in mind. IMO has several high traffic sites in their corporate
umbrella. Careful consideration needed to be given to scaling, isolating points of failure and
configuring the site to fail “gracefully.”
HOSTING ARCHITECTURE
In-Fisherman.com needed to handle thousands of page views per day. The hosting environment required
the ability to balance anonymous page requests, authenticated page requests and traffic spikes
effectively. IMO’s system administrator spent months of research, planning, and devising an internal
hosting infrastructure that was enterprise caliber. The hosting architecture consists of a series of shuttle
servers storing cached content, a file server and a dual database cluster. Page requests are routed
through a Cisco Load Balancer. The balancer identifies a shuttle server that’s “open” for serving the input
based on the number of requests it’s processing at that time. Stress tests on the enterprise server
architecture proved that Drupal was more than capable of handling. The idea of using memcache or
Xcache was tossed around, but abandoned in the end, because the hosting environment’s performance
testing exceeded requirements.
DEVELOPMENT PROCESS
IMO’s team developed the initial requirements document, which was beneficial. Mediacurrent adopted an
Agile methodology for developing the site. A team of 2-6 developers simultaneously worked in
conjunction with IMO’s management team throughout the process. Development progress was tracked
through the open-source project management tool called Active Collab, and its web-based ticketing
system. Active Collab’s commenting feature helped the Mediacurrent team collaborate effectively. There
is no shortage of other project management tools out there, but for what it is worth we felt Active Collab
fulfilled our needs. Overall, task management and dialogue between IMO and Mediacurrent was primarily
handled by a project manager, and frequent updates were exchanged on a daily basis. Weekly stand up
calls with IMO stakeholders provided an opportunity for more formal question and answers, and for
valuable debriefing time.
DESIGN AND THEMING
Intermedia Outdoors tapped a New York-based agency to create the user interface design for the site
months before Mediacurrent started site development. Mediacurrent chose the Zen theme to adapt the
In-Fisherman.com design. The Zen theme dramatically cut design time. As requirements shifted, the
highly relevant CSS structure of the Zen theme allowed for impromptu changes to the UI without breaking
page layouts. Mediacurrent also built several custom modules to streamline theming.
The custom content module was used in place of Panels (at the time Panels 6.x was not recommended
for production use). This allowed for complex content presentation on the front page and species channel
pages. Several custom Flash-related modules were written to provide XML data to Flash widgets across
the site. These modules create XML data based on taxonomy. Mediacurrent’s final theme was extensible
and flexible enough to withstand numerous IMO design changes just before the site’s alpha release.
SIGNIFICANT OBSTACLES AND SOLUTIONS
As with almost any sizable enterprise site there were some challenges to overcome. The most notable
included:
ƒ
Timeline – Developing 3-4 enterprise class sites in a compressed timeframe (5 or 6 months).
ƒ
Limited information architecture specifications – Project stakeholders met often to discuss items
such as data query logic for blocks and layout format of node edit pages. The use of a ticketing
system helped the process tremendously.
ƒ
Multiple themers – With several developers involved in theming, the team needed to coordinate
everyone’s efforts. Team members notified each other via IM whenever new CSS classes were
created so as not to duplicate effort.
ƒ
Search - For a general site searching, the Google Search Appliance (GSA) was used. Mediacurrent
had to modify it according to client requirements, which called for sorting by criteria unavailable in the
standard GSA. The solution was to limit the number of results, which were then reordered if the
default sorting was not used. Mediacurrent also added a theme function so the result set would match
the user interface design.
ƒ
Sharing Data across multiple domains – The In-Fisherman.com site uses several databases to
support high-volume traffic. The technique used relied heavily on Drupal’s multi-site configuration.
Drupal points to a particular database, based on the subdomain of the URL. This posed a problem for
blocks that presented data across multiple subdomains. IMO didn’t want to make database calls from
one subdomain to another. To solve this, Mediacurrent created a set of modules that would “flatten” a
block’s content to a serialized array and store it in a flat file. Thus, block content on one subdomain
could be read by another subdomain without a database request. Another challenge of multiple
domains is making Drupal’s menu system point to the correct domain when routing a page request,
without having to use absolute URL’s. Mediacurrent created the Multidomain to pass navigation and
/user paths through a custom_url_rewrite_outbound() function. A switch statement in the function
assigns the correct domain for a given path. Without this module, absolute URL paths would have to
be written everywhere to accommodate multiple domains.
ƒ
Optimization of multipage nodes – The article content type needed to present up to 6 pages of
content. Mediacurrent decided that the pagination module would not meet IMO’s specific
requirements. Our development team employed multipage articles, using a combination of theme
overrides in template.php and customization in the node.tpl file. For search engine optimization, the
article URL’s needed a page number appended to the path instead of appended to a query string.
This was challenging because Drupal perceived the additional argument as a new path alias. The
development team wrote a custom module to intercept the clean URL and detect a page number at
the end. The page number is stored and Drupal redirects to the node page.
ƒ
Data Import – IMO had lots of content (1200+ fishing articles) to be imported. Prior to Drupal, the
IMO editorial team managed these articles in FilemakerPro. IMO’s team created a PHP script to
parse a FilemakerPro XML file and generate a CSV file that was compatible with the Node Import
module. The wide array of metadata required that Node Import and various other modules such as
File Field and Image Field to be customized extensively. Once these modifications were complete,
Drupal processed the import to completion in an hour. Images were uploaded via FTP to the
development server and placed in the “files” directory.
ƒ
Enterprise level hosting and establishing fault-tolerance –To meet In-Fisherman.com’s stability
needs, the IMO team configured a hosting architecture that did not require additional optimization and
caching modules. Multiple databases for content and user accounts ensured that the site degraded
gracefully in the event of database failure. IMO’s system architect devised a technique to accomplish
this by leveraging Drupal’s multi-site capability along with prefixing table names with database names
in each site’s settings.php file.
MODULE LIST
The In-Fisherman.com site used a large, diverse set of contributory modules – thank you Drupal
community. There were staples like CCK, Views, PathAuto and Imagecache, as well as an assortment of
others. DrupalModules.com became a terrific resource for module reviews, release state and
descriptions. Some of the other more noteworthy contributory modules included:
Nice Menus: This easy-to-configure module gave the site’s primary navigation a set JavaScript drop
down menus.
Fivestar: Allows site users to rate content.
Workflow: Gives content contributors the ability to promote content and have it approved by an editor
before it’s published.
Transliteration: This module “sanitizes” file names for user uploaded content, helping oddly named files
become readable by the file server.
String Overrides: Gives site administrators a simple way to replace text that’s passed through the
Drupal API t() function
TinyMCE: A WYSIWYG editor that gives content contributors the ability to style web site copy.
CUSTOM MODULES
Developing the site involved extending or completely customizing quite a few modules – many of which
will be contributed back to the community. Here is a summary:
Alternating Content Background Manager: This allows site administrators to update the background
images used by an accordion flash widget without having to update XML manually. New images are
saved to specific filenames referenced in the XML.
Block Flattener and Block Flattener Reader: These modules allow block data to be shared between
subdomains without directly accessing a database for block content.
Gear Related Articles: This module outputs block content to a flat file for sharing across subdomains,
similar to the Block Flattener module.
Profanity Input Filter: This provides rudimentary, context-based input filtering via a modifiable set of
rules. Site administrators can insert custom string rules of prohibited content. The module then replaces
the prohibited strings with asterisks.
Fish Profile: Adds radio button-based fields to the profile form and reorganizes the fields.
Gear Related Articles Export: Saves block data to a flat file for use by blocks in other subdomains
thereby reducing cross domain database calls.
IMO import Fix: A helper module that assists in correcting file paths, taxonomy assignments and string
replacements during the article import process.
In-Fisherman Form Alters: Handles all form alter logic for In-Fisherman.com.
Multidomain: Manages the subdomain links for a multi-site Drupal install.
Node Process: Processes node page calls, allowing nodes to have multiple pages
Profanity Input Filter: Provides an input that can filter profane words or phrases based on a set of rules.
Solunar Month: The In-Fisherman site provides solunar calendars, which provide the best lunar fishing
phase in any given month. This module supplies the solunar_month content type for the calendar. CCK
couldn’t be utilized because the number of fields required by this content type consistently maxed out
PHP’s memory allocation when loading the node edit form. The module also supplies a dynamic XML
menu item for a given month and year together.
WWW Advanced Search: Generates an advanced search form page, containing category-based filters.
TRAINING/DOCUMENTATION
Documentation was implemented using a Drupal intranet that could be referenced and updated by IMO
staff, while development was simultaneously taking place. The online nature of the documentation
enhances knowledge transfer and allows for commenting, interaction, and help updates far faster than
traditional methods.
The site uses the book module to organize topics in a “tree” structure. A tagging scheme allowed help
topics to be displayed by subject. A WYSIWYG editor (FCKeditor) makes editing easy and efficient for
neophyte staffers and provides easy uploading of screen grabs. Terms and concepts between help
articles were extensively hyperlinked, allowing users of all skill levels to drill down to the appropriate level
of detail.
The documentation was written with the layman in mind (i.e. new user/developer to Drupal). This is more
difficult than it sounds, because as developers get more entrenched in the project, they tend to forget the
issues that stymie beginners. The availability of content in a web environment was seen as being more
beneficial and user-friendly than a traditional training manual in paper or PDF form.
Each help topic was summarized, then interviews were conducted by the documentation specialist to
determine the details of module dependencies and logic flow.
LESSON LEARNED…FOR THE NEXT TIME
Here are some takeaways from the project for developers and corporations (especially publishers) who
are contemplating Drupal for a sizable implementation:
1) Break the project down into chunks – there were are a lot of moving parts and concepts; keep the
core group of stakeholders as small as possible to streamline decision-making.
2) Use a proven recipe of modules – although we did a lot, avoid customization whenever possible.
3) Acquire original source code from all third-party front-end widget developers as soon as possible.
Upon receipt, immediately test to verify Drupal is “talking” to the widget correctly and vice-versa.
4) Orient designers on the “Drupal way” and overall theming best practices. Have your development
team review designs during the creative phase to ensure the designs reflect features and functionality
established by the selected module set.
ABOUT US
Mediacurrent is an Atlanta, Georgia based interactive firm that has developed a specialization and consulting vertical
within the free, open-source content management system (CMS) called Drupal. Mediacurrent offers strategic
direction and tactical implementation of an array of creative and technical solutions. For more information regarding
Mediacurrent’s services and portfolio please visit www.mediacurrent.com.