Prototyping Round 1
In this first phase of prototyping and evaluation, we created several low-fidelity static and interactive wireframes to test 3 high level themes before going into next phase of building higher fidelity prototypes.
1. General Approach
We created wireframes with 2 different approaches and also incorporate other activities to understand users' preference and possible ways to interact with the solution.
Understand how our solution would fit into users' workflow
Gather initial thoughts on interface design and platform
Paper Wireframe Walkthrough
3 experienced speakers from previous research
Cleaner interface, focused on the speech-building process. It had a more linear and streamlined flow, mostly driven by modals.
Focused on voice analysis metrics and long-term progress related to them. Interface was more complicated but with faster access to all the functions, inspired by digital audio workstations.
- Participants preferred the simpler interface design and structure-focused approach like Option 1.
- Participants liked voice analysis data but were confused about its meaning and context.
- It felt more natural for participants to use text input (typing) instead of audio recording to create outline.
Walkthrough with think-out-loud to evaluate the clarity of flow and desirability of features.
Did the flow make sense?
Was the onboarding and speech creating process clear?
Was there any feature missing?
6 participants from MHCID cohort
- Onboarding process was clear, but experience could be more exciting and relevant to further motivate users.
- The ability to video record was desired, but still missing from this iteration.
We focused on content in this evaluation, because content is critical for a learning tool.
Did the speech categories and frameworks work for users?
What was users' reaction towards tying voice analysis to goal setting?
Low-fidelity InVision prototype usability test
Tasks: Start a speech, practice recording, and generate feedback form
3 participants from previous research
Reactions towards content were generally positive.
Some participants imagined themselves recording their practice on a smartphone while being mobile.
Process to share feedback form with people was very unclear to participants.
1. Typing at a desk was natural for creating outline, while some participants could also imagine practicing on a phone.
2. Video recording was highly desired, but missing from our early prototypes.
3. How feedback function worked was unclear to users, and not prominent enough in the interface.
To solve these problems, we included video recording and reworked site architecture to emphasize feedback feature in our next build.
While web app seemed to be the right form for our solution, mobile companion app would be another future goal.
We revamped the site architecture with an emphasis on the 3 key aspects of public speaking framework, and eliminated superfluous features from early wireframes.
Due to the large amount of features and information in our solution, we started with organizing the content. This sitemap covers the entirety of the podium web application. The core interactions occur within the speech editor, but users without an account can access demo speeches and explore an alternate version of the editor.
2. User Flow
This flow diagram illustrates the typical user journey of creating, practicing and sharing a speech with others for feedback. The reviewer flow shows the steps of completing a feedback form through a mobile browser. Login is not necessary for the reviewer.
3. Hero Flow
This is the hero flow that demonstrates an ideal flow of using podium. It was created to streamline the next phase of prototyping, with only the key steps that we'd like to evaluate first.
Prototyping Round 2
In this phase, we focused on refining detailed interactions of our key features. Interactive prototypes were created with Principle.
Build an Outline
- A learning tool that helps beginners structure effectively by generating a customized outline based on the type of speech, and providing personalized tips.
- Also a flexible and customizable canvas that accommodates different levels of use.
- Our design brings back the familiarity of using notecards. You can rearrange different parts of speech with ease.
Record Your Practice
- Make precise refinements to your delivery style by analyzing and reflecting on vocal qualities such as pitch, pacing, clarity and filler words.
- Easy navigation with interactive data visualization or auto generated transcript of your practice.
- Ideal for experienced speakers who record themselves already, but can also train beginners to get into the habit.
Ask for Feedback
- This feature provides a framework to easily get/give meaningful and actionable feedback.
- Podium suggests questions you can ask based on the type of speech you’re giving.
- Feedback form will be sent along with your practice video as a link via text or mail.
Give Feedback (Mobile)
- Reviewers can leave in-line reactions with emojis as they're watching your practice video, making this experience fun and easy for both sides.
- After watching the video, reviewers will be asked to fill out the form you create, to provide qualitative feedback.
- Check reviewers' responses to the questions on your feedback form.
- Navigate your practice video with inline feedback, so you can make refinements to specific part of your speech.