Summary
Podflow stemmed from the tedious task of editing and transcribing podcasts, which took almost 8 hours for a 1 hour podcast. The challenge was letting AI do it's work without boring the user, and allowing the user to undo changes that had been made. I took the approach of helping users understand the process through prompts and explanatory copy, while streamlining the process to combine or eliminate steps. I had many assumptions that were challenged in this project, and I learned a lot about how to take critical feedback on designs and iterate in a group setting.
Highlight
Designing an interface where users could interact with AI edits was a challenge, one that took a lot of time and iteration. After lots of conversations with users, it became apparent that they wanted the granularity of individual timestamps to see where suggested edits might be needed. I created this view that allowed users to see where edits had been made in the audio timeline, and accept or reject those edits as needed. This eliminated the need for listening all the way through, as they could preview a few seconds before and after the flagged section of audio.
My role
Tools
Figma, Slack, Illustrator
Timeline
3 months
Goal
Scope
Wireframes, prototypes, high-fidelity mockups, MVP, & developer documentation
Discovery
I joined the team as the first MVP was being shown to users. To understand what users were looking for, the project manager and I interviewed several users about their needs. We found that they struggled to trust the AI behind the software and wanted to know what was happening behind the scenes. That was an instructional design challenge in addition to a UX challenge!
UX tests
As we tested the MVP product with users, it became clear that they wanted to understand what was being done to their audio file, as well as control over the outputs & edits. They frequently asked questions to accomplish the assigned tasks, and had difficulty finding different areas of the UI. I wanted to help them understand our process of editing, streamline the UI, and make it clear when edits were made. As I redesigned the UI, I implemented the following two changes: an instructional onboarding process and a clearly editable output interface.
Instructional onboarding
To give transparency to the AI used in the editing process, I created a short onboarding sequence that was designed to instruct users how our software worked. After this was implemented, we saw a dramatic decrease in confusion about how we used AI in our project.
Editable interface
The introduction of AI in our software was the defining feature, but users still wanted control of everything we generated. I created this interface to allow users to directly edit the information that AI provided, as well as the opportunity to regenerate anything they didn't like or felt was incorrect.
Team feedback
After I had taken the time to make the edits I thought necessary, the team and I had a long review session where we considered how our users might interact with the software and where there may be confusion. I realized there were several aspects of the experience I had overlooked, and had to rework many of the designs based on the feedback of the team.
Final tests
After the changes were approved by the team, we passed the designs to the developers who coded the changes into the product. After the changes were made, we followed up with users to get their feedback and see if we had improved the product. Based on the feedback from the initial interviews, the process was much better understood and easier to navigate, with users requiring no additional instruction to complete the assigned tasks.
