Work on the Course Finder has increased, now it has been positively received. I’m now working to improve the usability even more, and ensure reliable data sources can be put in place, along with workflows to manage them. Here’re some annotated shots of the current state of development.

First Load

The default view will load Undergraduate Courses, or the previously chosen award type if you’re returning from other pages. The Course List will be to view.What you'll see on first load

What you’ll see on first load

Where previously A-Z Letter links would filter out non-matches, they now simply scroll down to the selected point in the alphabetised course list.

When the Course JSON file is first loaded, and on each subsequent load, checks are performed to see which letter of the alphabet is not represented (we have few courses beginning with ‘K’, for example), and those letters are greyed out.

Scrolling the Course Listings by starting letter

Scrolling the Course Listings by starting letter

As you Type Filtering & Highlighting

As planned typing in the box filters the Course List. Now a message appears reporting on the number of courses visible compared to the total count. Clicking the ‘X’ in the field will clear it, and restore the full list. Clicking an A-Z letter will restore the full list and scroll as required.

As you type, the part of the Course Title where your phrase appears is highlighted in the text.Filtering the Course Listings by key words

Filtering the Course Listings by key words

Inline Search Results

This feature has been a long time coming. Search results are loaded via an XML-to-JSON filter script adapted to limit the search to the selected award. Title, relevance score and a basic summary are displayed. The JSON data contains everything needed to paginate the results, a feature that will follow. The script returns the data within an XJSON header which is then parsed into place on the page.Rendering live search results inline

Rendering live search results inline

Showing Course search results gives rise to layout issues: where to put the Course listings and how to differentiate between them. Sub-tabbing was one option which was discarded, and in the end the choice was to shift the Course listings down the screen and to put Search results in their place, with a button to close them and restore the prior layout.

Search results use an alternate list style too, to highlight the expanded information available.

Switching to another Award Type hides (gently…) any visible Search results and restores the default listings view, loading the appropriate set of Courses.