Aaron Winborn

The non-profit organization faces unique challenges with any web project. There are budget and internal skill limitations not typically faced by a for-profit entity. We've addressed what you need to know about the project process and begun to tell you how to manage it more successfully. This article discusses what I believe is the most important part of any project, yet is most often overlooked by the non-profit community: user experience design. (Obviously I am biased, as the resident UX expert at Advomatic.)

What is User Experience Design?

User Experience Design is how you get from "We need a new website" to a visual designer selecting what colors, fonts and styles will be used on each page. Imagine if you walked into a room with piles and piles of books, with no organization whatsoever and asked to organize them as a library, so any visitor could find what he or she is looking for. And then after that you were asked to design the shelves, and aisles. That's what the user experience design process does for the web. Continuing with the library metaphor: the visual designer for the web is the interior decorator for the library who picks out the bookshelves and furniture, but already has guidelines for what kind of furniture should go in the library. The academic study of user experience design emerged from a hybrid of technology, design and library science.

So I know what you are thinking, my organization doesn't have an entire library worth of content. That doesn't mean you should skip the UX process. Many organizations have years of content in various forms such as press releases, amicus briefs, research reports, blog posts and much more. Ever been to a website, couldn't find what you needed and quickly left? When that happens repeatedly, the UX design process was ineffective or possibly skipped over entirely.

How Non-Profits Engage in UX Today

If you are part of The Nonproft Technology Network (NTEN) or Progressive Exchange, you've seen, heard and read about UX regularly without realizing it.
The majority of our focus is on tweaking and enhancing email messaging. With email open rates reported as low as 11% in recent studies, it's time we refocus on the web. Imagine if our community put as much energy into UX for our websites as we do on writing emails. How much larger would your organization's audience be?

Several organizations, especially those without severe budget and time constraints, will invest a few months in planning, strategy and UX for their website up front. Those who do not are missing out on a huge opportunity.

What does the UX Phase of a Project Look Like?

Case Study: AfterSchoolPathfinder.org
The After-School Corporation (TASC) is an organization whose mission is to improve the quality of and access to after-school programs in New York City through policy analysis and professional development. TASC's Pathfinder is an online hub for after-school professionals of all levels, from front-line staff up to executive directors. This site includes a training database, job listings, resume and cover letter creation tools and a learning plan wizard.

Any good UX Designer will do a custom research and analysis plan for each project, depending on timeline, budget and scope. Focus groups were my primary research tool, as required by the grant from NYC's Department of Youth and Community Development. From these groups and meetings, I produced personas and audience analysis documentation. A persona is an imaginary user of your site, complete with attributes and a perspective that represents one of your target audiences. We use personas to put ourselves in the user's shoes and view the site from his or her point of view. When viewing each page of the site, ask yourself: "How would John Doe use this page? Does this page help John Doe find what he is looking for?"

Employers were posting jobs on craigslist, and the job applicants were not experienced or interested in education. There was no comprehensive listing of trainings. The only way to receive these updates was by joining each provider's mailing list. Job seekers and entry-level after-school professionals only received networking and guidance from their supervisors at work and had nowhere else to go for career building and guidance within the after-school community. We designed the TASC Pathfinder site to fill this wide open niche. With TASC staff, we agreed that the major audiences were employers, training providers and after-school professionals. Through this research, we discovered that there was no hub for the after-school professional community online.

TASC Pathfinder was a significant expansion on an existing Drupal site that was called "TASC Job Bank" and included job listings, resume and cover letter creation tools. From the research and existing site emerged a preliminary site map.

The wireframe is the meat of the UX process. Some designers will refer to wireframes as "blueprints," since these documents describe the functionality on each page rather than the visual design, much like blueprints do for a building. The wireframe is a living document and work in progress, used to prompt discussion among the UX designer, visual designer, developer and client. Wireframes can either be high fidelity (hi-fi) or low fidelity (lo-fi). The home page wireframe below is hi-fi, meaning it is more detailed.

Frequently Asked Questions

What if Our Organization Can't Afford to Hire a UX Designer?
First, before giving up on finding a UX Designer, try to find graduate students from major interaction design programs like Savannah College of Art and Design (SCAD), Carnegie Mellon University and School of Visual Arts (SVA). Some of the larger interactive agencies will do pro bono UX projects for non-profits once or twice a year. You'll have huge resources but the team may not know the non-profit space.

How do I Test and Improve Our Current Site With UX in Mind?
If you don't have the budget for a big redesign, but want to improve what you have, learn about usability testing. I think I recommend Steve Krug's Don't Make Me Think at least once every few weeks. Krug advocates testing one day a month and walks through the process of conducting a test and what to look for. Leading UX Designer Whitney Hess often conducts trainings on this subject: DIY UX: Give Your Users an Upgrade (Without Calling In a Pro).

So I'm a Believer (or a UX designer) and Need Help Pitching UX to Clients or the Executive Director
Can You Say That in English? Explaining UX Research to Clients is a fantastic article written by David Sherwin of frog design that addresses how you explain each component of UX, like card sorts and prototyping.

The user research and audience analysis that comes from UX is helpful to more than just an organization's web team. The Director of Communications and Development Director will benefit from a competitive analysis and user personas just as much as the web team will.

Guide to UX Deliverables

There is a wide variety of "deliverables," or research documentation, that may be produced by a user experience design as part of this process. Here's a quick glossary to help you get started.

For a more in-depth look at UX deliverables and this process, be sure to check out two often-recommended books: Communicating Design: Developing Web Site Documentation for Design and Planning by Dan M. Brown of Eight Shapes and A Project Guide to UX Design by Russ Unger and Carolyn Chandler.

Card Sort
A focus group exercise in which participants are asked to group index cards with content names or types into logical groupings. Best used to figure out the information architecture of a complex site.

Competitive Analysis
Describes the other sites that are or may be perceived as competition and what these groups do well and poorly based on a set of criteria.

Content Inventory
A table that lists all content in a website and its attributes including content type, title, author, page visits and more. Preliminary step often taken prior to a redesign of a large site.

Persona
Description of an imaginary person, their demographics, history with subject of the site and trends. See above sample.

Project Brief (or Creative Brief)
Preliminary document describing the goals, target audiences, concepts and potential functionality.

Prototype
A clickable or interactive scaled-down version of a website. Prototypes come in many forms, the most obvious being those that display in a web browser built in HTML with clickable regions on an image. Other forms include Powerpoint decks and paper. Great for usability testing your website before you build it.

Scenario
A story of how a user may interact with a website. A paragraph form of a task flow that uses an individual created as a persona.

Site Map
Shows the navigational paths and structure of a website. Does not illustrate functionality or layout of individual pages.

Task Flow (or User Flow or User Workflow)
Displays the steps which a user takes when completing a task or action on the site. e.g. adding a job listing to the TASC Pathfinder.

Usability Test Plan & Report
Usability testing is a method for measuring a site's ease of use and simplicity. UX thought leader Jakob Nielsen defines usability with the following five attributes: learnability, efficiency, memorability, errors and satisfaction. Two great resources for usability, besides Steve Krug's book mentioned above are Usability.gov and Nielsen's Usability 101

Wireframe
A "blueprint" of a page in a website that is used to describe functionality and content, not for design. Often annotated with detailed notes to guide developer on functionality.

At Netroots Nation last week, I did the second iteration of a training first introduced at Organizing 2.0 with Fureigh in December 2009: How to Plan for Your Website Redesign. I was joined by Erin Hofteig of Middle Coast and Paula Brantner of Workplace Fairness, who both offered additional perspectives on the process. Read more about Erin and Paula.

We described the training as follows:
Redesigning your website can be easy and fun or expensive and painful. We’ll cover content management systems (CMS), customer/constituent relationship management (CRM), writing RFPs and how to select a vendor. This panel will include a handful or organizations and blogs that have recently completed the redesign process.

Netroots Nation #NN10: How to Plan for Your Website Redesign View more presentations from Julie Blitzer.

Some key take-aways from our training and the crowd:

1. Don't pick the "best" CMS and CRM. Pick the tools that are right for your budget and project. Also consider how big you want to scale. Need to roll out a campaign microsite in a few days, low cost and low functionality? Maybe WordPress is for you. Long term, scalable and complex user permissions? Drupal is the answer. (Yes, I did just say that Drupal may not *always* be the best choice.)
2. Metrics, metrics, metrics: Look at your analytics data and see what pages have lots of visits, where those visits are coming from, time on site, etc.
3. Design for your organization's mission and goals, not to have the newest and shiniest toys.
4. RFPs are often not the best way to select a vendor. More on this to come soon from Adam Mordecai.
5. Think about placement of the Donate buttons and links. You can put more than one link and you should. Check out Human Rights Watch for an example. How many can you find? New research shows that users do scroll and that they view pages in an F-pattern, across and then down, across, less, etc.. A great summary of this research is available at Usability.gov.
   
   
   Eye-tracking heat map showing the F-pattern of viewing page content.
   source: Usability.gov
6. The web project is never complete. Always be designing, tracking, improving.

Resources we mentioned:

• Idealware's Research on How to Pick Tools
• Non-Profit Technology Network (NTEN)'s 501 Tech Clubs
• NTEN's Annual Conference
• My blog post on The Web Development Process for Newbies
• NetSquared's Local Groups
• ProgressiveExchange Email List
• Steve Krug's book Don't Make Me Think: A Common Sense Approach to Web Usability
• Dan M. Brown's book Communicating Design: Developing Web Site Documentation for Design and Planning

We got fantastic feedback from the crowd and I will definitely be doing this training again as I continue to refine it, perhaps at next year's Organizing 2.0 or NTC.

What tips did we miss? What big questions do you still have about this process? Comment and I'll respond here or write a whole blog post to answer your questions.

There are very few organizations who make our list of people we have to sponsor. There's only one we commit to sponsoring every year. That amazing org is called Netroots Nation, and their annual conference is this week in Las Vegas.

Netroots Nation is a group of progressive leaders, bloggers, activists, heros, and other sundry awesome people who get together every year to talk shop, guiding the progressive message forward, teaching each other new tricks and strategies to help make the world a better place. Very important people fly in to address them and urge them on in aiding progressive policies and agendas. This year, Harry Reid, Al Franken, Nancy Pelose, Van Jones, and a bunch of awesome activists will be attending.

We'll have our regular booth in the exhibit hall, offering up 15 minute chair massages (done by professionals, not web developers) to stressed out Kossacks. (The convention was created by devoted readers of the awesome progressive blog, DailyKos.) If you have a website you need built, desire to talk about Online Strategies to help your organization or need advice on your internet presence, feel free to drop by and chat. And if the thought of redoing your website stresses you out, skip the shop talk, and just enjoy a relaxing chair massage.

See you in Vegas!

We have some exciting news. We are now officially supporting Pantheon Mercury as an add-on service with all our dedicated and shared Virtual Private Server hosting plans. This makes Advomatic the first hosting provider ever to provide end-user support for Mercury.

Pantheon is a set of tools and configurations developed and maintained by our long time colleagues at Chapter Three that combine vanguard hosting technologies to augment a standard Drupal deployment to make it scalable and fast. Mercury enabled servers provide an unprecedented amount of resource overhead which can help Drupal weather significant traffic spikes on smaller hosting plans, giving clients a much greater value for their money.

Advomatic will start offering Mercury immediately, available pre-configured with any Virtual Private Server hosting plan. You can learn more about our new service line here. And read our fancy press release here.

Editor's Note: This is the first in an ongoing series about what our team does in their spare time to help good causes.


Photo: Amanda and Nus in the Free Geek Twin Cities firehouse.

On most Saturdays, when I'm not theming Drupal websites for Advomatic and our awesome clients, I make my way over to an old firehouse in South Minneapolis to spend some quality time geeking out, playing with discarded motherboards and hard drives. While this sort of geekery isn't that unusual for me, for my company it's a brand new experience.

I volunteer with an organization called Free Geek Twin Cities. We're a nonprofit that valiantly tries to solve three global problems with one community recycling and education program. Our volunteers learn how to build working computers from donated parts, install an open source operating system, and eventually take one home with them for free.

First, there is the growing problem of e-waste disposal. In the United States, only an estimated 11-14% of electronic waste is sent to recyclers, and, of that, 70-80% is exported to developing countries where they are processed using harmful methods, such as riverside acid baths and open-air burning.

Free Geek Twin Cities accepts computer-related donations and either reuses the parts or ensures they go to a trustworthy recycler who has formally taken the Basel Action Network's Electronic Recyclers Pledge of True Stewardship. The Basel Action Network exists to ensure that toxic materials from electronics don't cause long term harm to the environment and health - particularly in developing countries.

Jen helps Vincent and his son John take apart their first computer

Secondly, we aim to bridge the well-documented "digital divide" by providing a way for anyone to earn a free computer -- and with it an understanding of how it works, knowledge a person picking up a computer from Best Buy won't get. The divide refers to the gap between those who are using computers and the internet and those who don't. People who are uncomfortable with computers (or without access) miss out on educational, professional and civic opportunities for engagement.

Third, we don't believe in propriety software: Free Geek thinks that free and open source software not only means not having to bother with copyright and licensing restrictions, but means better software, through a model of decentralized contribution from those interested in making the product better. We use the Ubuntu distribution of Linux, and showcase programs like Open Office, Firefox, Thunderbird, VLC, Gimp, and Inkscape to show our new users that they can do anything you can do in Windows on Ubuntu, without the cost of a license and the constant worry of viruses!

Sounds like a cool project, right? Yes! But we can't take the credit for it. Free Geek was founded in February 2000 by a group of geeks in Portland. It steadily grew, and now the organization takes up a city block and has a paid staff collective (even with health care!) Their model of selling extra computers and parts in a store pays most of the organization's costs, making it incredibly self-sustaining in an age of shrinking foundation grants.

In the recent years, Free Geeks have sprung up around the country (and Canada!), including in Chicago, Vancouver, Toronto, Arkansas, and Columbus. Each one is unique, but we all benefit from the groundwork that the "mothership" has laid for us, and from the work of the other Free Geek satellites.

A small group of us started talking about starting a Free Geek in Minneapolis in the fall of 2007. We finally made the leap to renting a space in the fall of 2009, after doing some planning and fundraising. We started by just accepting hardware donations until we had a critical mass of good parts to work with. In the spring of 2010 we began training volunteers (and ourselves) on how to take apart and build computers. We've given away computers to volunteers and also to nonprofit organizations to use or give away to their clients. This is surely the most gratifying part of the whole project!

Steve shows Dave how to strip a computer for recycling

In the coming years, Free Geek Twin Cities aims to be the first place people in the Twin Cities take their old computers. Eventually we'd love to have both a warehouse for managing all the material and a storefront for selling computers and computer parts. But, for now, we will concentrate on one person at a time.

A common question I get for theming Drupal sites is how to apply css to specific pages. For example, you might want your background image for your header to change on specific pages. Out of the box, Drupal doesn't give you any class in the HTML that's unique to your node to grab onto. This is where $body_classes come in.

Drupal 6 introduced the $body_classes variable to dynamically include certain information about the page you are on as a class of your body tag. These include:

- .no-sidebar/.one-sidebar/.two-sidebars
- .sidebar-left/.sidebar-right
- .front/.not-front
- .logged-in/.not-logged-in
- .page-[PAGE TYPE]
- .node-type-[CONTENT TYPE]

Some starter themes, like Zen, come with the $body_classes variable already in place. If you are building your theme from scratch or using a theme that doesn't have it, you'll need to add it in.

To add $body_classes to your theme, open your page.tpl.php file, and find your body tag. Edit it to be: <body class="<?php print $body_classes ?>">. Now, when you check your HTML, your body tag should look something like this:

<body class="not-front logged-in page-node node-type-forum one-sidebar sidebar-right">

You can probably see how these will give someone building a theme good stuff to work with. However, sometimes this isn't enough; sometimes you need node-specific classes. With Drupal 6, you can use a preprocess_page function to add on to your $body_classes variable.

First, you will need to create a function that properly takes your URL and converts it to a class (you don't want any space, capitals or irregular characters). Open your template.php file and add the following function:

<?php
/**
* Converts a string to a suitable html ID attribute.
*
* <a href="http://www.w3.org/TR/html4/struct/global.html#h-7.5.2" title="http://www.w3.org/TR/html4/struct/global.html#h-7.5.2" rel="nofollow">http://www.w3.org/TR/html4/struct/global.html#h-7.5.2</a> specifies what makes a
* valid ID attribute in HTML. This function:
*
* - Ensure an ID starts with an alpha character by optionally adding an 'id'.
* - Replaces any character except A-Z, numbers, and underscores with dashes.
* - Converts entire string to lowercase.
*
* @param $string
*   The string
* @return
*   The converted string
*/
function YOURTHEME_id_safe($string) {
  // Replace with dashes anything that isn't A-Z, numbers, dashes, or underscores.
  $string = strtolower(preg_replace('/[^a-zA-Z0-9_-]+/', '-', $string));
  // If the first character is not a-z, add 'n' in front.
  if (!ctype_lower($string{0})) { // Don't use ctype_alpha since its locale aware.
    $string = 'id' . $string;
  }
  return $string;
}
?>

This is reusable code - use it anywhere you need to convert a string into an id.

Next, search for a section that starts with YOURTHEME_preprocess_page. If you don't have one, just add in this code anywhere in the file:

<?php
/**
* Intercept page template variables
*
* @param $vars
*   A sequential array of variables passed to the theme function.
*/
function YOURTHEME_preprocess_page(&$vars) {

  if (!

$vars['is_front']) {
    // Add unique classes for each page and website section
    $path = drupal_get_path_alias($_GET['q']);
    list($section, ) = explode('/', $path, 2);
    $vars['body_classes'] .= ' ' . YOURTHEME_id_safe('page-' . $path) . ' ';
    $vars['body_classes'] .= ' ' . YOURTHEME_id_safe('section-' . $section) . ' ';
  }
}
?>

Otherwise, you will need to merge this code into the preprocess_page function.

This code gives you two new classes: page-PATH and section-SECTION. It might look something like: <body class="not-front logged-in page-node node-type-forum one-sidebar sidebar-right page-about-history section-about">. The page-PATH class displays the full url path, and the section is just the first arg in the path - enabling you to do some section-based theming, if your URLs are all segmented properly.

The final trick is to add your taxonomy terms to $body_classes. After the new section in your preprocess_page function where you turn urls into your $body_classes, add this snippet:

<?php
if (isset($vars['node']->taxonomy)) {
  // Add unique classes based on taxonomy terms
  $taxonomy_classes = array();
  foreach($vars['node']->taxonomy as $term_info) {
    $taxonomy_classes[] = 'taxonomy-'.YOURTHEME_id_safe($term_info->name);
  }
  $vars['body_classes'] .= " ".implode(' ', $taxonomy_classes); // Concatenate with spaces
}
?>

This will add a class to your body tag that looks like taxonomy-YOURTAG. All together, your preprocess_page function might look like this:

<?php
/**
* Intercept page template variables
*
* @param $vars
*   A sequential array of variables passed to the theme function.
*/
function YOURTHEME_preprocess_page(&$vars) {

  if (!

$vars['is_front']) {
    // Add unique classes for each page and website section
    $path = drupal_get_path_alias($_GET['q']);
    list($section, ) = explode('/', $path, 2);
    $vars['body_classes'] .= ' ' . YOURTHEME_id_safe('page-' . $path) . ' ';
    $vars['body_classes'] .= ' ' . YOURTHEME_id_safe('section-' . $section) . ' ';
  }
 
  if (isset($vars['node']->taxonomy)) {
    // Add unique classes based on taxonomy terms
    $taxonomy_classes = array();
    foreach($vars['node']->taxonomy as $term_info) {
      $taxonomy_classes[] = 'taxonomy-'.YOURTHEME_id_safe($term_info->name);
    }
    $vars['body_classes'] .= " ".implode(' ', $taxonomy_classes); // Concatenate with spaces
  }
}
?>

Armed with those $body_classes, there is very little page- and section-specific CSS targeting you can't do!

"What we learn from lessons learned is that we don’t learn from lessons learned."
- T. Block

So you are about to kickoff a project. You have a budget, a deadline, and a deliverable: an awesome website launch. As you already know, there are 3 criteria by which you'll measure your project's success: on time, on budget, and at intended quality. Exciting stuff, congrats, and best of luck. Unfortunately, I am here to tell you are probably going to fail on at least one of those criteria. And why. And how to give yourself a shot at not failing.

Danger, Will Robinson

The data on IT project success rates vary. But what the studies all agree on is the numbers are not good:

• 7 out of 10 IT projects "fail" on at least one of these criteria and 1 in 5 will bring their sponsors "full satisfaction"
• anywhere from 1/3 - 2/3 of IT projects run into serious problems
• over 30% of web projects are late or over-budget
• The Standish Group reports that project failures are increasing under current economic strains, with successful projects down to 32% in 2009, from 35% in 2006

Pretty daunting, pretty depressing. Getting approval is actually the easy part; bringing the project to the finish line is exponentially harder. Project management is not for wimps. Before you scoff, think about these jobs:

• Project manager for the the space shuttle
• Project manager for the invasion of Iraq
• Project manager for deep water oil drilling

When these PMs mess up, lives and even countries are at stake. Fortunately for you and I, we are here to talk about managing web projects and the worst that can happen is we get fired and/or bankrupt our company (I won't mention names). But the fact of the matter is that all projects that fail make the same classic mistakes, whether you are working in construction or technology or banking.

The reasons are all well documented. They are maddeningly easy to spot from outside and incredibly difficult to avoid from within. They happen again and again and again and again. Sometimes they start as wishful thinking, magical budgeting and hallucinatory scheduling built into the start of the project, preordaining failure from the gate. Sometimes they accumulate like strands of hair in a sink - small shortcuts, slipped deadlines, and minor, poor decisions slowly choking the drain until the pipe is blocked and a huge mess backs out on the floor.

But...the good news is a successful web project launch is not impossible. The warning signs and mistakes that lead to failure can be overcome if anticipated and addressed proactively.

This blog is going to to be the first in a series discussing why and how failure happens and offering up some best practices and strategies for giving your project a fighting chance at success.

I Want To Be A PM When I Grow Up

I was already doing project management in my first job out of college for a couple of years when I came to the terrifying conclusion that managing projects is hard. Or rather, managing projects is easy, successfully managing projects is hard.

With the help of this exploding thing called the World Wide Web, I discovered an amazingly well-kept secret. Project management is a profession, a discipline. People actually get certified at it. And there are established processes, best practices, tools - a lot of them. Some organizations actually have entire departments setting standards for project management.

I'll try not to bore you to tears but it's useful to summarize some of this stuff because they are the containers for dozens of decisions that impact project failure or success.

The 4 Phases of a Project

1. Planning
2. Designing
3. Implementing
4. Operating (Supporting)

Note that these four phases happen to map nicely to common web development phases. Also note that if you aren't budgeting and scheduling one of these phases appropriately, you are going to meet trouble in the rest of them. (Much more later in this series on that).

The 5 Processes of a Project

1. Initiation
2. Planning
3. Executing
4. Controlling (Quality Control)
5. Closing

Note that each of these processes apply to your project as well as each of your phases. In other words, you've got to 1. start, 2. plan, 3. do, 4. monitor, and 5. finish, each of 1. planning and 2. design and 3. implementation and 4. operating. Take shortcuts at your peril - "Well, we carefully planned out development timelines and budget but had no established process for design...I think final comps are sitting on Frank's desk, waiting for approval. So, yeah, we are already 2 months behind our original development schedule."

If executing those processes within those phases is not challenging enough for you, don't fret. Allow me to introduce the 3 project constraints, aka as the bane of your existence.

1. Time - "But we've already promoted the launch date..."
2. Money - "We've got a really tight budget but I am sure we can save some money in a few places..."
3. Scope - "The VP of Finance says we need to just add this little thing..."

Ok, so those are your phases, processes and mortal enemies - what exactly is your job as a project manager? Answer: pretty much everything.

Continuous Management Responsibilities

1. Time Management: make sure it's on schedule and going to stay on schedule
2. Cost Management: make sure it's on budget and going to stay that way
3. Quality Management: make sure it doesn't suck
4. Scope Management: preventing stakeholders from turning your website into a video game
5. Communications Management: everyone on the same page at all times
6. Resource Management: people produce projects and even with the best team, you're going to need carrots, sticks and a bag of psychological tricks
7. Risk Management: What you are doing to prevent and address problems on any of the above
8. Integration Management: your plans and processes around this whole thing
9. Procurement Management: hiring the right vendors and making sure they deliver

Other Key Terms

• Stakeholders. All decision makers and people vested in the outcome of the project or a project phase need to be involved from the start and signed up for the plan. (Easier said then done).
• Dependency. We can't do that until this is done first. Really.
• Critical Path. If you line up all the dependencies with duration on a calendar, this is the fastest the project can be done.
• Milestone. A significant marker in the project status that tells you where you are at - ie design completed, alpha version released.
• Contingency. Things are going to go wrong and your contingency plan is what you turn to when they do.
• Sponsor. This is not someone you talk to about craving a drink, this is the person or entity footing the bill and likely to fire you if you fail.
• Project manager. This is a person leading the project who has been empowered to make certain critical decisions on the project, knows what those decisions are, what they are not, and has direct access to someone who can answer the nots for them (expeditiously). If you don't have authority to make critical decisions and adjustments on a project, you are not a project manager and should fire yourself before your boss fires you (see above).

It's Going to Get Messy

To frame our discussion going forward, in this blog series we are talking primarily about vendor-client projects (vs internal projects) where there is a client and vendor(s) that have contracted to produce a deliverable or deliverables. We are also talking specifically about web development projects (though the principles and scenarios apply to all projects).

There are a few reasons why the basic PM concepts should be important to you, whether you are the client or the vendor (and I have sat in both seats):

• Just because you have a budget and can hire a firm to build a site doesn't make you a project manager
• Just because you've hired a firm with a really good project manager, doesn't mean you won't need to do project management
• Just because you've been hired by a client with a lot of money and smart people, doesn't mean the project won't fail

In other words, the success of your web launch, as a client, rides as much on your performance, your leadership, and your decisions as it does on the vendor you've hired to build it. And if you are a vendor, your ability to pull off what you've promised hinges not only on your process but on that of your client. It seems unfair but it's not - it's shared responsibility and there is simply no way around it.

As a client, you're paying a big chunk of money and yet you are still going to have to work your rear off to make the project work. As a vendor, you can do everything right on your end but dysfunctional organizational politics or basic incompetence from your client can easily destroy your performance and product.

Let's go back to the three project constraints: time, money and scope. All projects that fail, or are troubled, can trace their problems back to fatal flaws in one or more of these three constraints. Not enough time, not enough money or poorly defined scope. Failure in one of these constraints will usually trigger failure in another. Not enough money caused the project to be under-resourced and stall. Not enough time caused the project to launch without key features. Changing requirements caused the project to go over budget and past schedule.

To make matters worse, we are working and living in a period of extreme financial pressures. When dealing with tightened budgets and reduced resources the natural tendency is to look for shortcuts. On projects, this translates to one or all of the following shortcuts: underestimating, overbooking, and/or underplanning. Notice how these shortcuts align nicely with the trifecta of constraints. Yes, incredibly, the three most critical measurements of a project's success - cost, time, and quality - are exactly the ones that are most commonly tinkered with when shortcuts are applied.

There is light at the end of the tunnel

So there you have it, our stage has been ominously set and the challenge has been issued. However, don't despair, there is hope on the way. But first, in my part 2 of this series, I'll examine the shortcuts in detail, how and why they happen, their impacts, and how they map to the project phases, processes and constraints. Because, before you can solve and prevent failure, you must recognize its root causes, which are both simple and complex. Finally, in Part 3 I'll provide you with helpful ways to solve these conundrums, adding years to your life and making your projects more successful.

References

Baker, Sunny & Baker, Kim. (2000). The Complete Idiot's Guide to Project Management. Indianapolis, IN:             Alpha Books.
McConnell, Steve. (1996). Rapid Development. Redmond, WA: Microsoft Press.
Project Management Institute. (2000). A Guide to the Project Management Body of Knowledge. Newton                 Square, PA: Project Management Institute, Inc.
Schwalbe, Kathy. (2004). Information Technology Project Management. Canada: Course Technology.

     In the last few years, the term “cloud computing” has become the ubiquitous new buzz-word to toss around when talking about flexible, scalable hosting solutions. Unfortunately, as often happens when a new concept is introduced to a large market, it is often misunderstood; the benefits and drawbacks are misrepresented (intentionally or not).

     The original concept of cloud computing was a utility-like service that would provide a pool of shared resources for clients to use on-demand – thereby allowing customers to leverage a large pool of resources without having to bear the burden of the capital cost of building or maintaining the entire infrastructure themselves. In the web hosting world what we refer to as “cloud computing” sometimes aligns with this original concept, sometimes not so much, depending on the service in question.

     In this post, we hope to remove some of the mystery around cloud computing as it relates to web hosting services; pull back the curtain a bit and explain what is actually happening inside that misty and illusory “cloud”.

Virtualization and The Cloud
     All cloud products that are offered as a web hosting service have one thing in common: they are virtualized. "Virtualized" means that your “server” (whether called an “instance”, “slice” or something else by your service provider) is actually a virtualized operating system (kernel) that is referred to as a “virtual machine”, or VM. The VM is running inside a “container” system, which is in charge of managing the resources of multiple VMs running alongside yours. There are several products that do this, some of which you may be familiar with – some of the more well known products out there are VmWare, VirtualBox, and XEN.

Although all cloud products are virtualized, not all virtualized hosting services are cloud services. What distinguishes the two is:

• the ability to scale dynamically
• adding or removing resources can be controlled by the customer through an API
• have the utilized resources billed out by some small increment, such as by the hour or day (although some providers do have larger billable increments, such as week or months)

This flexibility is generally considered to be the largest advantage of a cloud product over your more standard virtualized private server, it allows you to dial up and down resources, on-demand and as-needed, without having to commit to a lot of hardware that comes with a bunch of unused overhead during non-peak hours.

     Once you are on a virtualized platform, your “server" becomes platform agnostic. It is now a VM. This means that it will run anywhere the “container” will run. It doesn't matter what the hardware is. This means that (compared to an operating system installed directly on some hardware) its trivially easy to move your VM from one container to another – from server to server, or even from datacenter to datacenter. The various virtualization technologies have different ways to do this, with different requirements, but they almost all have some way to “migrate” a VM from one host to another. Here is where an important distinction between virtualized private server (or “VPS”) services and cloud services comes into play.

Under the Hood
     In order for cloud services to be able to scale in an elastic fashion, they must use some sort of network attached storage. Network attached storage is pretty much what it sounds like - a physical disk storage system that connects to a server over a network. In the case of the cloud, your VM runs on a server which provides the "brain", the RAM/CPUs and other hardware necessary for the operating system to run and connect to the Internet. But instead of having hard drives inside that same server, the storage is on a networked storage solution that is connected to the server running your VM (in many cases just using your standard Ethernet interface and switching gear).

     Having network based storage is generally a requirement for any type of “hot migration”, that is, moving a VM from one server to another very seamlessly. In this configuration, using XEN for instance, you can migrate a running VM from one server to another without even a reboot. This is useful when you need to allocate more ram or CPU cores to a VM that is on a server that is fully utilized (by migrating to a server with more resources available), or if a server has some hardware failure and needs maintenance all the VMs on it can be migrated with minimal interruption.

More Ins and Outs

     There are several drawbacks to using network attached storage, the primary one being I/O. I/O, very simply, is the rate at which data can be transferred “In” and “Out” of a device. There are various kinds of I/O that affect performance in various ways, but in this case we are talking about disc I/O. There are several types of network attached storage products out there, but the most popular is iSCSI, which is basically SCSI over Ethernet. This means that if you are running Gigabit Ethernet, you have 1,000 Mbit/s of I/O. Serial attached SCSI (SAS) drives put you at 4,800 Mbit/s - in a RAID configuration, you can get much more than that. If you are running 10 Gigabit Ethernet, you have 10,000 Mbit/s.

     Comparing I/O rates between devices and standards is never an apples to apples comparison, because it completely depends on the hardware and network configuration - for example it doesn't matter if you've spent all your money on a 10GbE network if you have connected an 8 servers with 8 CPU cores to one 10GbE network connection - you are now sharing that connection with potentially 64 CPU cores - that many cores could easily saturate your expensive 10GbE network several times over. Now, of course, even if each server had a dedicated direct attached SCSI array you could still saturate your disk I/O, but you would have much more overhead to play with, and you could more easily dedicate resources to a specific VM or set of VMs.

     As always, there are some exceptions to the rule, but as of right now, most cloud products will not give you as much I/O as you can get out of dedicated direct attached storage. I/O is not everything, but this is one potential bottleneck.

Keep it down over there! - or - Noisy Neighbors
     Perhaps more important than raw I/O, is the fact that cloud products (and shared VPS services for that matter), are based on shared resources. This is great when you don't want to pay for all the resources you have access to all the time, but what happens when someone sharing the same resources as you maxes them out? Your service suffers. If they saturate the network your storage is on, your service can suffer *a lot*. For disk I/O intensive applications (like Drupal) this can mean slow, frustrating death. This is true not only for shared network resources, but for shared CPU cores (you can't share RAM for technical reasons, so at least you are safe there). If you have someone sharing the same resources as you, and they use more than their "fair share", your service will be impacted. This is called having “Noisy Neighbors”. Some people mitigate this by rebooting their VM, hoping they boot back up on a less resource-bound server. Some just wait it out. Many just watch the low load numbers on their VM, and puzzle over the lackluster performance.

What should I do?!?
     Decisions about what type of hosting service to use depends on your particular situation. In most cases, we always say “proof is in the pudding” - if the service you are on is making you happy, and the price is sustainable, then stay there for goodness sake! But if you experience performance problems on a budget hosting or cloud service that are causing you to lose money or traffic, maybe its time to look at a dedicated server environment.

     Drupal, especially with the default database-based cache enabled, can be particularly I/O heavy on the database. Many cloud providers offer a hybrid model, where you can have virtualized cloud servers that connect to external non-virtualized hardware with direct attached storage. This is a great solution if you can afford it – it allows you to put your database server on dedicated hardware, but keep your web servers on a more flexible solution.

     If you can't afford that, then look at Drupal performance solutions like Pressflow or Mercury. If thats not an option, then the next stop may be a VPS with direct attached disks and dedicated resources.

     If you feel like you are having I/O or “Noisy Neighbor” issues, check if you are on a “shared” resource plan, ask your provider what type of infrastructure they are using and if its saturated. If they won't tell you, and you continue to have problems, its probably time to start looking for another provider.

Next up: Caching and Drupal – examining apc, varnish, boost, memcache, and content delivery networks, and how they work together.

Related resources

• "Has Amazon EC2 become over subscribed?" - article that talks about the "Noisy Neighbor" syndrome, specifically on Amazon EC2
• List of device bit rates - peripherals