Pattern Radio: Whale Songs
Interactive website design
2018 — 2019
Product/web design for a consumer-facing, interactive website that uses Google machine learning algorithms to classify 15,000 hours of National Oceanic & Atmospheric Administration whale song recordings.
A stripped-down version of this experience was shown as part of the XXII Triennale di Milano themed Broken Nature: Design Takes on Human Survival.
I was responsible for the interaction design of the site. While the visual design of the launched site is considerably more brutalist than what I designed below, the essential functionality still matches many of the interactions I initially designed here (even if many other features of the experience were also removed to scale back the scope of the project). Even with a reduced feature scope, my work on Pattern Radio: Whale Songs won a Best Navigation/Structure Webby for "best-possible user experience through superior navigation and site structure."
Landing page map view of discrete recordings positioned where the recordings were made: at various sites around the Hawaiian islands in the Pacific Ocean.
The red play head is draggable and used for navigation. The clock icon allows users to browse the recordings aligned by the time they were made (see below).
Viewing the recordings aligned by the time they were made. The small blue tags indicate points of interests and are meant to serve as starting points for user exploration.
Zooming into a recording (using the plus and minus buttons in the bottom right [a Google Maps convention]) reveals additional points of interest (see below).
Colored bands on the recordings communicate sound classifications made by the machine learning models. A persistent timeline along the bottom of the recording communicates the scale of the data being viewed.
The tuning icon in the bottom left lets users turn on and off different machine learning classifiers—adding or removing colored bands from the recording.
Zooming in more reveals even more information about the whale song recordings, including units of whale vocalization (sometimes referred to as "whale phonemes"). Insights from scientists are peppered throughout the recordings, providing even more areas for users to investigate.
This design was completed as part of a UI/UX sprint for what ultimately evolved into Pattern Radio: Whale Songs.
