Angie N. Tran's Portfolio
heysid_shorter_3.gif

Sid, a voice UI smart mirror that helps improve public speaking skills

heroimg.001.jpg
 

Sid–the Voice UI smart mirror that helps improve public speaking skills

Scope: 4 weeks
Categories: Interaction Design, Voice UI
Tools: Sketch, Photoshop, Aftereffects
Advisors: Joshua Musick (Director of Interaction Design, Digital Accelerator at United Technologies), John Leonard (Technology Director at Frog)
Team: Crystal Wang, Margarita Yong, Abhinav Sircar, Ke Hu
Role: UX research, competitive analysis, concept ideation, design iteration, prototype testing, pitch deck


 

THE CHALLENGE

Public speaking fear has 10% impairment on wages, 10% on college graduation and 15% on promotion to management [i]. However, only 8% of those who have public speaking fear seek professional help.

How might we help people improve their public speaking skills?

THE OUTCOME

A Voice UI smart mirror that helps improve public speaking skills by providing real time feedback and progress tracking.

*Why Voice UI: No smudging (on the mirror) & adopting speech recognition technology

 
 
 

USER SCENARIOS

  • Professionals that have public speaking fear which hinders their professional growth.

  • People that are starting careers which now focus on public speaking.

  • Students who need the soft skills of presenting for their first jobs.

MOST COMMON MISTAKES

  1. Volume

  2. Pace

  3. Filler words

  4. Posture & Body Language

 
 
 

INTRODUCING SID

 
 
 

REAL TIME FEEDBACK

 
Volume & Pace

Volume & Pace

Filler words

Filler words

Posture & Body language

Posture & Body language

Teleprompter —helps memorize speech.

Teleprompter—helps memorize speech.

 
 

MODES OF SID

Hibernating/ activated / talking/ listening / processing/ recording/ paused.

TRACKING PROGRESS

Provides feedback over multiple practices, also option to watch the recorded video.

5_finalscreen.png
 
 

Process_sid.001.jpg
 
 

THE EVOLUTION OF SID

 
 

VERSION 1

  • Sid prompts the user with a question.

  • The possible commands are displayed in quotation marks.

Result: This felt more of a screen interface rather than voice UI.

skills_toggled.png
paused state.png
 
 
 

VERSION 2

  • Re-organized the content and structure in 3 sections (from top to bottom):

  1. Mirror talks

  2. Main interaction: user speaks & receives feedback

  3. Notes/ teleprompter

  • Added a menu where users can turn on/off each live feedback.

  • Hand gesture incorporated.

Result: The user needed to pay attention to a lot of things happening on the screen, on top of memorizing the speech.

power on copy.png
menu.png
 
 
 

VERSION 3

  • Simplified the layout and content on screen to avoid cognitive overload.

  • Replaced option to turn on/off filters with Voice Command, and just left them ON on the screen.

  • Removed hand gesture.

  • Added visual representation of Sid, moved him to the middle screen.

Result: Sid located in the middle of the screen interfered with other activities. Real time feedback required lots of attention, which still caused cognitive overload.

pause copy 10.png
 
 
 

VISUAL EXPLORATIONS

  • Color, texture, shape

  • How it looked in the mirror

  • Different modes of Sid (e.g. when Sid is listening vs. talking vs. recording vs. paused).

  • For recording mode, explored options for adding red–universal recognized color.

visualexplorations_ofsid.001.jpg
visualexplorations_ofsid.002.jpg
 
 
 

THE EVOLUTION OF REAL TIME FEEDBACK

VERSION 1 & 2

Test: Sid only gives feedback when the user is doing something wrong, with 3 states: first warning, second warning, confirm when it’s correct.

Test results:
- Emojis were not universally understood.
- Took time to process text & emojis at the same time.
- The menu was also a factor of distraction.

VERSION 3

- Played around with colors & interactions following the Car Dashboard approach.
- Removed the Menu to clear out the space (then realized Sid position became a distracting element).
- Permanent live feedback.

Results: still couldn’t reduce the cognitive overload.

VERSION 4

- Moved Sid to the top and removed feedback Menu to reduce cognitive overload and distractions.

Results: All the three elements on the screen were in motion at the same time, which caused distraction to the user. Also needed to consider visually showing different modes of Sid (listening, talking, recording, paused).

 
 

THE EVOLUTION OF TRACKING PROGRESS

 
feedback_version1.png
pause copy 13.png
heysid_shorter_3.png
 

 

THE TEAM

[from left to right]      Crystal Wang     ,      Ke Hu     , Angie Tran (myself),      Margarita Yong     ,      Abhinav Sircar

[from left to right] Crystal Wang, Ke Hu, Angie Tran (myself), Margarita Yong, Abhinav Sircar

 
 

© Ngoc Tran 2019