Portfolio: National Center for Safe Routes to School

Web site design, development and strategy

www.saferoutesinfo.org

Created while Design Services Manager at the UNC Highway Safety Research Center

2006-2009

Provided:

  • visual/UI design
  • XHTML development
  • CSS development
  • accessibility development
  • information architecture consultation
  • functionality/UX consultation
  • icon illustration
  • maintenance

The web site for the National Center for Safe Routes to School (NCSRTS) doesn’t look like your typical government clearinghouse site.

Before my organization was awarded the federal grant to act as the NCSRTS, I designed and built a small web site in just one week to show our expertise in order to help secure us that grant. Once we had it, our government contract required us to complete the expanded, fully functional site within three months. I led the design and technical development of this new site and helped us meet our tight deadline.

The new web site, launched in 2006, needed to provide great breadth and depth of information to users with a wide range of professional backgrounds and needs. I helped NCSRTS organize the content, develop navigation mechanisms, and plan the functionality needed to meet the center’s goals. I developed specifications for the behavior of the dynamic areas of the site, such as the question and answer section and searchable library, and worked with a programmer to produce user-friendly interactive elements.

Being a completely new clearinghouse, I developed the overall look and feel for the entire NCSRTS brand, based only on a logo that a colleague designer created. I created the visual design and built the templates for the site in clean, cross-browser XHTML and CSS. I also built many of the inner sections and pages, including the user interfaces for the interactive areas. Accessibility was taken into consideration at every step. The layout is a fluid/liquid one, meaning it adjusts in size to the user’s browser window, allowing the site to look and work well for as large a portion of its diverse user-base as possible.

After launching the new site, I performed regular maintenance on it, updating existing pages and adding new ones as the purpose of the NCSRTS grew and changed. In 2009, I completed a minor redesign of the home page based on usability testing I conducted as well as the changing needs of the center. The new home page features icons that I illustrated and rotating cut-out photos that I created.

I designed many other materials for NCSRTS brand, using a similar look and feel to the web site. These include annual reports, tip sheets, and postcards.