Skip Main Navigation

"Andy brought focus and structure to an extremely daunting and complex project"

Shoreline Community College

Shoreline is an award winning, nationally accredited two-year college with hundreds of academic, profession/technical, and workforce training programs. The “programs” section of Shoreline’s website, however, was structured to reflect the organization, not the needs of prospective students. This made it difficult for website users to learn about and enroll in Shoreline’s wide range of programs.

Shoreline Community College logo

Project Goals

  • Clearly define and communicate the prospective student user journey
  • Redesign the programs taxonomy to support user and organization needs
  • Create navigation and page templates to support prospective student tasks
  • Work collaboratively with Shoreline staff to encourage knowledge sharing and facilitate acceptance of design recommendations across the organization
Screen capture of the Shoreline Community College Programs prior to project work
The Shoreline programs page prior to project work

Project Approach

The definition and description of Shoreline Community College (SCC) academic programs plays a pivotal role in how the college markets itself, and how it attracts and retains students, instructors, and staff. In order to redesign the way these programs are described and accessed in a way that both met business needs and was accepted in the organization required active collaboration, clear communication, and responsiveness to both user and business interests. Project activities included:

Prospective Student Journey Map

In order to better understand a critical gap between a prospective student’s interest in Shoreline and that same prospective student applying for a free student ID (the first step in the registration process), I helped SCC web staff conduct background research and set up and run a baseline usability study.

We then worked together to synthesize study results and sketch out a research-informed prospective student journey. I formalized that sketch into a design deliverable the Shoreline Web Team could use to socialize this journey across the organization and inform future research and design efforts.

User experience journey map document
A clear and shared understanding of the prospective student journey was crucial to subsequent design efforts

Program Pages Information Model and Taxonomy Design

Once we had an objective understanding of the prospective student journey, I worked with SCC stakeholders and staff to model the current organization-focused information model, and a potential future state user-focused information model.

When we had agreed on the key attributes that would constitute this revised model, I worked collaboratively with key stakeholders to develop a standards compliant taxonomy that met user, regulatory, and business requirements.

Screen capture of a spreadsheet showing elements of the Shoreline information model
The Shoreline "Programs" information model matched the college's particular structure and needs

Collaborative Sketching Workshops

I next facilitated a sketching workshop where we explored a broad range of interface approaches for the program pages section. By framing our explorations in the user journey and information model already established, we were able to address a number of “what if?” scenarios and concepts without feeling like we were starting over or revisiting decisions already made.

The goal of this exercise was to ensure that Shoreline web service staff’s deep undertanding of programs subject matter was reflected in the final design, and to ensure that the design process remained collaborative, transparent, and open.

Wireframe sketches taped to a wall
Collaborative sketching was one of many techniques we used to incorporate Shoreline stakeholder feedback

Content-First HTML Prototype and Prototype Usability Testing

After refining and consolidating several of the key concepts we explored in the sketching session, I created a clickable content-driven low fidelity HTML prototype of a final design direction. This prototype dynamically incorporates the structure and vocabularies from our earlier information model and taxonomy phase, and uses real content drawn from Shoreline’s existing website.

This prototype served as the key artifact for the remote usability test that followed. Once revised to incorporate usability test insight and recommendations, it also became the core experience design specification.

Read about the content first prototyping process on Smashing Magazine.

Screenshot of a low fidelity HTML prototyp, showing a searchable list of Areas of Study
To evaluate the effectiveness of our information design solution, we tested a functional HTML prototyp based on real content with users.

Client Outcomes

Shoreline's redesigned program pages interface allows students and potential students to browse Shoreline's programs based on interest, as opposed to requiring them to first select a degree type. This approach has led to an increase in registration clickthroughs from these pages and has contributed to an increase in new student registrations for the college.

Screen capture of the Shoreline program pages after project work
Shoreline's program page after implementation of the design recommendations created in this project

Let's Talk

Get in touch to learn how we can work together to tame your complex information environment in order to better meet your business goals and user needs.

Contact Me