Clearwater’s Key to Common Hudson River Fishes

Web Application Design and Coding

The Hudson River Sloop Clearwater – the venerable organization Pete Seeger started when he launched the sloop Clearwater in 1969 to clean up the Hudson River – was seeking a creative partner to convert their booklet, Key to Common Hudson River Fishes, into an interactive web application. This important educational tool allows a layperson to identify fish species by following a step-by-step graphic dichotomy key based on differentiating characteristics of the fish in question.

It was important for Clearwater to keep much of the character of their popular booklet intact, such as the original fish drawings. Looking at it from a web app design and UI/UX perspective we saw the potential in keeping certain graphics as-is yet simplifying other elements or translating them altogether for the online environment. For instance we were able to create a better dichotomy navigation scheme that makes sense within a web-navigation structure and to introduce simple animation to help reinforce useful information. The resulting web app, geared mostly towards mobile usage, is clean and simple-to-use with additional interactive content not available in the printed booklet, such as audio transcriptions of the Latin fish names, slideshow carousels and two interactive fish quizzes that help deepen the education possibilities.

The web app launch was timed to coincide with the annual Clearwater Festival, a two-day music and environmental celebration attended by thousands of people. The Key to Common Hudson River Fishes web app was used successfully as an education tool by Clearwater’s staff and volunteers on site.

View website.