Classes Product

This web application helps students find the classes they plan to take each quarter at Bellevue College and is part of the workflow in developing the printed version of the quarterly schedule.

Classes project

Launch Date

April 2012 (beta version released Dec. 2011)


The class schedule is a publication that lists class offerings in any given quarter. For years, Bellevue College manually created their web based-version of the class schedule by taking the print publication and converting it to HTML.  This web-based document would be updated manually as classes were changed in the system. This was a time consuming process and also error prone. There had been a prior attempt to automate this process, but it had failed due to data inconsistencies and limitations with the with the back-end legacy system that stored the data.   There was a new push to automate this information and allow students to both browse for and search for classes in the system.

This was a fairly high risk and high impact project because it was the third most trafficked resource at the college and Bellevue College is the 3rd largest higher education institution in the state of Washington.


We designed a new automated class schedule and revised the publishing process of the print class schedule.  The first version of the class schedule was essentially a beta version that was available alongside the old version of the class schedule and we allowed users to check out the new experience.  This beta release allowed us to handle the data inconsistencies,  gave us time to flush out issues with the publication process and clean up the functionality.

Because of the confusion we learned through user research and stakeholder interviews, we combined class schedule listings with course descriptions (commonly published separately in college publications) and turned into the ‘classes’ section of the global Bellevue College site.

The vision of this project was simple: to make it easy for students to find the classes they need. We also wanted to make this project be the best tool for finding classes in the entire state of Washington.


What I did

  • Led one of two kick-off design studio sessions (We had so many stakeholders, that we to broke it up into two sessions)
  • Planned and conducted some of the user studies during the process
  • Designed the wireframes and final design of the project
  • Implemented a good portion of the HTML structure, most of the CSS and some of the javascript & jQuery
  • Served as the product owner:  lead the vision of the project, point person with all college stakeholders, prioritized the backlog and the voice of the project
  • Conducted comparative analysis of similar tools at other institutions
  • Reviewed feedback provided from the website

Tools used

  • Design methods: customer interviews, guerrilla user studies, defining audience, competitive analysis, value/complexity matrix, story mapping,  sketching, white boarding, wireframes, surveys, proof of concept (done by somebody else), roadmap
  • Design tools: Fireworks, Illustrator, paper/pen/whiteboards, Google Analytics
  • Dev tools: Visual Studio, TFS, Firebug

Technical tidbits

  • Semantically accurate, accessible
  • This project was developed using MVC in Visual Studio.  We had some smart engineers working on this project
  • A technical goal of this project was to make it shareable across all Technical and Community Colleges in the state.  An API was developed to assist this and to allow department websites to consume some of this data
  • Most of the concessions between design and development had to do with performance.  This project marked a turning point for our engineers to learn about performance-lite ways to query large amounts of data.  In a sense, it was the turning point of design and user experience: lead the technology rather than the other way around

Wireframes Progression

Other ‘Wins’ of this project

Side notes

This website is the third most used web resource at Bellevue College after the learning management system and the online registration page

This is one of my proudest projects. It flipped the application development process on it’s head, with planning and design thinking at the beginning along with designers and software engineers brainstorming and troubleshooting together.