Orcasound’s Orca Sound Training Interface

On Saturday, July 18, 2020, Orcasound participated in “Summer Create-a-thon”, a hackathon run by DemocracyLab. Our goal was to design an orca call teaching interface for concerned citizen scientists, so that they could identify what they might hear when listening to a live hydrophone. The hackathon was a success, and I’m excited that the design process for the teaching interface was started.

The day started with my pitch of the project. I was excited to encourage new UXers and devs to join Orcasound, and hoped that my prepared 1 minute pitch would bring in some fresh UX and dev talent.

After the pitch process, I went to our breakout Zoom room. We had a few people drop by and express interest in being involved with Orcasound on a long-term basis, which was great! There were a few long-time committed volunteers that showed up as well.

After introducing the project in more detail, we had a discussion about what was feasible for the day. Diego shared the machine learning UI he had come up with, and we decided that the teaching interface would be integrated into his design.

It turned out that no dev work could be done until there was a design to implement. We decided to meet back in the Orcasound meeting room at 1 PM, and the UX team would design the teaching interface.

For 2 hours, I worked with teammate Sam to design initial interface designs. I designed the learning interface, presenting the different Southern Resident Killer Whale (SRKW) calls- some 40+ distinct vocal patterns that users could browse through and listen to.

Sam designed the teaching interface- a chance for users to test their knowledge of orca calls by choosing the correct call from 2 options.

Admittedly, these designs are basic; they need some iteration, pixel pushing, and user testing. But it’s a great start to a feature that is a critical part of Orcasound!

At 1 PM, we got back together in the Orcasound main meeting Zoom room. Developer James started implementing the design in a Github branch, and I started preparing for the final presentation.

James wasn’t able to finish implementing in the few hours left, but the progress made on the design was worth the effort. I enjoyed working with my fellow hackathoners, and I’m excited for the further development of the UX team. We even recruited some new team members, which will help drive design for Orcasound forward even more!

One issue that came up was the fact that the devs couldn’t start their work without design. When I attended my first DemocracyLab hackathon in 2019 for a different nonprofit, I remember that the devs had started working before I had given them a design. I was hoping for the same, but I was told that the project required front-end dev work. I’m hoping that future hackathons can be planned in such a way that uses both UXers and devs, perhaps working on separate projects. I got around this issue during the last hackathon by designing before the event and asking the devs to implement what I had designed. This solution requires that only one type of work can be done during a hackathon though, as no UXers had a project to work on.

In any case, I know that we drove design forward for Orcasound at Summer Create-a-thon 2020, and I’m looking forward to seeing how design and development of the website will evolve for the rest of the year in support of orca conservation in the Salish Sea!

One thought on “Orcasound’s Orca Sound Training Interface

  1. BIPIN BHARTI says:

    It was really fun and had a learning experience with other folks. I am looking forward to join more of these types of Hackathons.

Leave a Reply

Your email address will not be published. Required fields are marked *