Starting to Design Soundbites

As a small update, I’ve started the initial design process on Figma for what I’m envisioning on how the user flow for Soundbites will play out.

I’d prefer the UI to be as minimal and simple as possible. I should be able to quickly drag-and-drop a file, specify what I label each region and download. With that said, I’m trying to incorporate the idea that the user doesn’t need to see all possible actions at once, so they’ll be structured (at least for now) as this multi-step form.

This is the initial design – quickly done in Figma – of step 1: should just be a simple drag and drop for uploading files or manually picking a file to upload.

Step 2 is likely the most complex on the UI side, as I’d need a way to not only show waveforms but regions within it that are not only highlighted, but interactive. The initial idea for now would be to have each region be clickable and it opens up into a popup box to enter the details:

Another option would probably be to also show a row of items for each of the snippets below the waveform. Highlighting the row should highlight the waveform region and vice versa.