All-around cool dude

College Scorecard

College Scorecard UX Design

Challenge: Improving the Clarity of College Information using the “College Scorecard”

Contribution:  UX Design, Information Architecture

Deliverables: Sketches, Design Rationale Report

The College Scorecard is a site by the US Department of Education’s College Affordability and Transparency Center that allows students to compare colleges and make informed decisions.  A criticism has been that it does not present the necessary information in very clear manner or allow for easy comparison.

 My team focused on simplifying and making College Scorecard more intuitive.  We want students to be able to use the information on the site, and not worry about how to access the content or if the content even exists.

Landing Page 

1) College Scorecard logo: clicking returns users to homepage

2) Student profiles: allow users to create accounts and save colleges and search criteria

3) Search by name

4) Filtered search: allows users to select search criteria

5) Guided search: brings users to  a questionnaire that presents search parameters more semantically, and tailors results to user preferences

Filtered Search 

1) This option collapses when filtered search mode is engaged to avoid any possible ambiguity

2) Displays the currently selected search criteria

3) Results updates in real time, reflecting the inclusion of each additional parameter

Search Results 

1) Share: email, social networks, export to PDF

2) Comparison queue: allows users to build a list of colleges for comparison  

3) Mini Scorecard: brief overview of key information from the specific college highlighted  

4) List of colleges matching the search filters: these colleges can be added to the comparison queue or sorted by a specific filter

5) Displays search criteria: users can see which filters they have applied, and remove any if desired or return to the search page

Compare Colleges - Scorecard View 

1) This is the first of three views for comparing colleges; this view allows for easy direct comparison between two or three colleges

2) Users can compare attributes of two or three colleges side by side; This view is best for when a user has narrowed his/her choices down to only a handful of schools.

Compare Colleges - Grid View 

1) The traditional grid view is best for users who prefer to have as much information visible as possible, allowing for multiple colleges to be compared

Compare Colleges - Map View 

1) The map allows users to compare the location of all the colleges in their comparison queue

Individual College Page - Scorecard

1) Floating navigation menu: because this is a large page with a great deal of information, users should be able to quickly access any section of the scorecard

2) Users can find additional information about the college from a curated list of external links

3) Useful images of campus and surrounding area can help give students an idea of what it's like to be there