Lorraine Johnson - Online Portfolio Home Page Lorraine Johnson - Online Portfolio Home Page
Technical Editing / Information Design / Graphics Design
Web Projects | Class Projects | Resume | Contact

Seattle Composers Alliance


In 1999, a group of professional composers in the Seattle area formed a non-profit, professional organization to promote composition in the Pacific northwest. To foster the community, the organization commissioned a Web site using volunteers.

Navigation and Information Architecture

To construct the Seattle Composers Alliance Web site, I proposed and led the requirements and design analysis. The process I used is based on principles of software design and begins with consideration of the user experience: who will visit the site and what will they want to do?

From the completed analysis, I developed a prototype site structure and testing plan.


The all-volunteer Web team met for two hours to discuss the site architecture and design. Team members prepared before-hand to ensure that the meeting would fit within the allotted time.

  1. User Identification and Scenario Building (1/2 hour)
    Identify the users who will come to the SCA Web site and describe what they might expect to be able to do. Team members came prepared with users and scenarios.
  2. Object Discovery and Categorization (1/2 hour)
    Based on the results of Step 1, identify content elements (for example, mission statement, composer bios, event listings), and group similar objects together.
  3. Category Description and Labeling (1/2 hour)
    For each group of objects from Step 2, develop a two- or three-sentence description and a short, clear label which can be used for site navigation.
  4. Graphics (1/2 hour)
    Finally, review the graphic designs, develop a list of pros and cons for each, and settle on a direction.


The Web team developed a list of content items for the site which, when organized, created the site map. From the site map, I developed a wireframe (graphics-free) model of the site. From the user scenarios, I developed a testing plan: SCA members assumed a user role, visited the wireframe site, and reported their ability to find information.

Although the dynamic, database-driven sections of the site are yet to be developed, the overall site structure has been robust enough to serve the site since its creation in the spring of 2000.

Content and Editing

Most of the content on the site consists of descriptions of upcoming and past events sponsored by the organization. The individual responsible for planning the event writes a description, which is posted on the site and used in email announcements. As Webmaster, I copyedit each description before posting and format the text to fit the established site style. Occasionally, I have performed a more extensive edit, posting the revision only with the author's approval.

Graphics and Layout

SCA font characters

The face logo and organization identity was developed by a Seattle-based graphic designer. I created all graphics for the Web site. I developed a TrueType font of the logo so that I could import it into graphics applications easily.

In the fall of 2004, I developed designs for t-shirts, mugs, and other items to be sold through CafePress.


Regular site maintenance consists of updates to the organization's events and the make-up of the board of directors, selected once each year. For events, information for new events is added as they are planned and moved to an archive once the event is over. A summary of a new event is placed on the home page and the full description is included on the Events page. After an event has been held, the description is moved to a dedicated page, the index page for that year's past events is updated to link to the dedicated page, and the event information is removed from the home and main Events pages.

Each year, when the board is selected, biographies for new board members are added to the About section, biographies for retiring members are removed. Board members are invited to update their biographies at any time.

Home | Web Projects | Class Projects | Resume | Contact