portfolio of design work

Countrywide Helpdesk Portal

The helpdesk portal provides a single destination for consumers of support services within Countrywide. It merges together a series of helpdesk applications and service tools that were previously scattered throughout the intranet.

Creating this site required the following:

  1. Clearly defining the customer segments who would be using this site. In the end, we found four distinct groups, which we prioritized according to impact. During the process, we found that satisfying the primary segment would satisfy a large percentage of the requirements for the other segments.
  2. Determining the roles and goals for the groups, and defining what information they would need to come away happy. This required defining the primary goals of each group, then assembling that information around the common tasks.
  3. Inventorying the existing content and evaluating whether it should be deleted, updated, or migrated as-is. We found that most of the content was years out of date. In order to ensure material was current and relevant, we worked with senior management to assign content owners for each section. We then met with each one to obtain the requisite materials and negotiate update schedules.
  4. Designing the site information architecture. This required assembling that content, aligning it to the segments, and defining the relationships between the materials.
  5. Creating the page architecture. We based our design on corporate styleguides. This provides visitors a familiar environment to navigate within.
  6. Developing the product. Each page was spec'ed to exacting detail. We worked closely with developers and QA staff to develop the site and execute the test plans.
portal documentation

fig 1 – The sitemap. Content was collected and grouped according to the primary tasks of each customer segment

portal documentation

fig 2 – Detail of the sitemap. Colors were used to indicate the primary audience for that page.

portal documentation

fig 3 – The nested template design. The three column layout places hierarchical navigation on the top and left columns. The middle column contains the content body. Off to the right, auxiliary/related content is contained in a series of modules.

portal documentation

fig 4 – Detail of the variable content area.

portal documentation

fig 5 – Notes for the wireframe. This provides an overview of how the template elements (such as navigation) will be rendered

portal documentation

fig 6 – Detail of notes. A thumbnail of the template architecture is provided for reference

portal documentation

fig 7 – Example wireframe. Annotations have been removed for clarity.