Friday, November 30, 2007

Web Design Project Management

The Initial Contact With Your Client

Collect Client Contact Information
  • name and title of initial contact:
  • Business/organization name and location:
  • email address:
  • Business phone including area code or country code:
  • existing website(s):
If you are unable to respond right away, find out if the standard response time is ok.

Assess objectives and requirements

Conduct surveys and interviews to determine the Main Objectives:

  • Who do we want to visit the site? [Identify audiences]
  • Who are you?
  • Who are you competitors and what are their strengths and weaknesses?
  • What are we publishing that those visitors will find important? [Identify site goals]
  • What do you do?
  • What is the concept, product or service provided or promoted by this site described in detail?
  • What is the primary purpose of a new site?
  • What business problem(s) need to be resolved with redesign?
  • Where are our visitors in terms of geography, ambient environment, and client platform? [Identify audiences]
  • Why does the sponsor want the site built—what are its business objectives? [Identify site goals]
  • Why does what your company does matter?
  • When should the site be launched, phased, maintained, and finally taken down or redesigned? [Generic project timeline & Key factors in creating your timeline] [size of site (12 or 1000 dynamic pages)] [mandatory launch date?]
  • How are we going to build the site—what tools are we using, and what’s the budget? (browser support guidelines) [Key players on your development team] [technological requirements] [features? forum, chat, streaming video/ audio, CMS, ecommerce, commenting, reviewing] [Who will administer these features (what staff members)?] [Who will create and administer content?]

Review Current Content and Plan for Development
  • Content review, delivery plan, and timeline
  • Web-writing guidelines
  • Consistency check
Note: Get approval on the main objectives before moving forward.

Note: Design preferences/requests should be noted separately. They will be reviewed later after any usability testing and wire framing.

Conduct User Testing

This is the UX testing portion which can be done with as much complexity as needed. If your site has undergone formal or informal usability testing please provide copy of the results.

Roleplay likely visitor sessions of your
primary and secondary users:
  • personas that you want
  • personas that are likely
  • personas who you hope will not visit but could and influence others
What primary action should a primary user take when visiting your site?
Examples:
  • becoming a member
  • subscribing to a newsletter
  • reading editorial content
  • purchase product
What user needs does your existing site fulfill?

Produce wireframes (and establish site architecture)

Determine Site Structure and Navigation
  • Organize content and create sitemap
  • Determine navigation
Basic layout of the entire site’s significant elements:
  • page headings
  • navigation
  • primary content
  • sidebars
  • application interfaces
Create a wireframe for all page types not just a general wireframe for the whole site.

Produce sketches, comps, and (if necessary) prototypes

Any client design requests should discussed first. Anything that is recommended against because of usability or accessibility guidelines should be documented.

Things to discuss:
  • branding
  • brand attributes (caring, honesty, humor, professionalism, intelligence, technological savvy, sophistication, reliability, and trustworthiness)
  • feelings (warmth, friendliness, reassurance, comfort, or excitement)
  • desired look and feel (Easy to look at, edgy, classic, up-to-date, crisp, modern, traditional, understated)
The art director or designer will determine visual elements:
  • colors
  • typography
  • illustration
  • photography
  • composition details that are important at the section or element level
The sketch/comp/prototype incorporates:
  • the layout described by the wireframes
  • the visual elements agreed upon by all art directors, designers, and clients involved
Get comp approved before moving to the next step.

Draft the style guide

Rules/Recommendations for styling, such as:
  • blockquotes
  • how much whitespace should exist between sidebar sections
  • the desired aspect ratio of inline graphics
  • what icons should be used for list item bullets

List the rationale next to each styling rule/recommendation.


Produce templates and stylesheets

This should start with a framework and adding site specific html and styles.

Include a favicon with template.

Write code

add links to rss

ad links to analytics

ad links to webmaster tools
ad links to other seo tools
write robots text
write sitemaps

Test presentation and behavior

use check list to make sure all areas are accounted for [example web design proof checklist]

You've triple-checked for typos and accuracy. You've tested for cross-browser, platform, and ADA issues

Reconcile test results, if possible


Publish

You upload your files to the server.


Launching, Tracking, Maintenance
  • Launch timing and publicity [launching your site at the lowest-possible traffic times and publicize when ready]
  • Feedback and site statistics [email or form available on site for feedback?]
  • Updating content [provide a resource for use with in house content publishers/editors]
  • Prioritizing Phase 2 ideas
Thanking

Sources:
Avoid Edge Cases by Designing Up Front
by Ben Henick at alistapart.com
Public Affair's Web Project Management Guide
Happy Cog Project Planner available on Happy Cog's Contact Page

1 comment:

Anonymous said...
This comment has been removed by a blog administrator.