mikewgd.com

Running Audio Tool

Back to the Work

A tool that allows trainers to upload their mp3 class audio files and tag them. Which allows them to identify where in the audio file is the introduction, segments and cooldowns. The tagged audio file is outputted as JSON and is then consumed by the Equinox iOS app to show class list views and data visualizations.

A demo of the audio tool built as a Contentful UI Extension.

The audio tool was originally built as a standalone website. However I took it a step further and embedded it as a UI extension so all functionality is contained within Contentful. In order to tag the audio files we integrated peaks.js, which is a browser-based audio waveform visualization tool. Some custom functions were added (goToSegment, getPrevSegment, markerInRange, etc) in order to accommodate the UI that was designed.

VueStylus/CSSContentful UI ExtContentfulWebpackES6