Teleprompter

IMPLEMENTATION

Simple script input

The user can easily input the script by typing, pasting or restoring from the last time.

The UI always shows estimated recording time at the bottom based on the number of words and average speaking speed.

Using voice command to start recording

With AI voice recognition, the user can start recording with a simple voice command “start”.

The countdown numbers inform the user that recording is about to begin.

Auto scrolling make the lines easy to read

The App automatically scrolls the script, following the user’s pace and using AI voice recognition to detect pauses and adjust accordingly.

Easy to restart, creating a pressure-free recording experience

If the user pronounces something wrong, they can simply restart or abort the recording.

AI automatically ends the recording

The recording automatically ends when the last word is detected.

The user can also manually press the complete button to end the recording without finishing the script.

Smart editing

After the recording, the app offers three smart video editing methods to remove any awkward pauses or silences, giving the user a polished and clean video.

Natural

Only remove pauses between sentences, resulting a natural version.

Tight

Remove pauses between sentences, and speaking errors compared to the original script detected by AI, resulting a shortest final video.

Raw

No changes will be made to the original footage, which might contains errors and extra pauses.

CONTEXT

Background

WeChat is the most popular social media app in China

with active users more than 1.1 billion monthly as of 2020.

The launch of a brand-new video platform “Channels”

WeChat just launched its short-form video platform "Channels" competing with the most used Douyin (Chinese Tiktok).

The release of a new video editing app “Miaojian”

To support the video content creation for WeChat's video platform, WeChat developed Miaojian, an all-in-one mobile video editing App aimed at simplify the video making process, that can record, edit and post videos directly to Channels. Similar to the role of CapCut to Tiktok. The teleprompter is designed to streamline the self-recording process for video bloggers, as one of many features in Miaojian App.

Product Opportunity

Video influencers often use third-party teleprompters to help them remember lines when recording.

Without a built-in teleprompter feature in Miaojian, the user has to rely on other standalone teleprompter apps or physical teleprompters when they record videos.

Design Challenge

How might we build a simple and intuitive teleprompter that help users deliver lines effortlessly and simplify the editing process?

Goals

Simple and intuitive user flow

By leveraging interactivity within the narrative, the project aims to endow the user with meaningful agency, allowing for a significant impact on the story's progression and outcome.

Easy-to-read Line Scrolling

Designing interactions that are not only coherent and grounded in the narrative but also contribute to the construction of interactor’s belief of the story, hence enhance the narrative.

Smart video editing after recording

Designing interactions that are not only coherent and grounded in the narrative but also contribute to the construction of interactor’s belief of the story, hence enhance the narrative.

Research and Definition

Competitive Research

What is teleprompter?

Optical teleprompter

The screen is right in front of the video camera, and the words on the screen are reflected to presenter's eyes using a sheet of clear glass.

Pros: the speaker can maintain eye contact with the audience by looking directly at the lens while reading the script.

Cons: not accessible to most users.

Teleprompter Apps

Using a tablet or phone as a continuously scrolling “cue card” to help the presenter remember what they have to say.

Pros: low cost.

Pros: presenter may be found eyes shift away from the lens position.

How do video bloggers use teleprompter?

User Needs

Text Editing
Users can input, edit and even save lines before recording.
Simple and Intuitive Process
recording takes a lot of repeat, a 5-minute final video might take 1-hour of recording. As such, it is necessary to allow the user to easily restart.
Easy-to-readLine Scrolling
- Different scenarios will have corresponding expressions and tones, as such, the speed of speech varies from fast to slow.
- Some bloggers need an assistant to manually scroll the lines when they speak, requiring a more tacit cooperation.
Avoid Eyes shift
By using a lens with a longer focal length and sitting further away from the lens (7 feet), thus making the eye shift less noticeable.
Final Video is Fluent
- Record in segments and use Jump Cut to “glue” different video footages together, making it looks like it's by design
- “For example, if two clips is not continuous, zoom in the second video clips to make it looks like it's recorded by two cameras.”

Product Requirement

Aiming for 1-minute recording experience
For non-professionals
Simple and unique experience

Explorations

Easy-to-read Line Scrolling

PROBLEM

It is not easy to match the speed of reading and lines rolling exactly.

SOLUTIONS

chosen solution: Auto scrolling based on AI recognition of user‘s speaking speed(tech team proved possibility)
scrolling lines based on a speaking test before the recording

Scrolling Method

Jump scrolling

Chosen solution

The line that user is currently reading is paused, which makes it easier for the user to focus.

Smooth scrolling

The lines will keep scrolling at a constant speed and the user will not be able to focus on the line being read

Simple andIntuitive Process | Iteration 1

PROBLEM

Too many functions integrated into one UI page
Give the user right to delete or during the recording makes the process complicated

Simple andIntuitive Process | Iteration 2

PROBLEM

Unclear about how to start recording
Experience during the recording is not unique and ”exciting”

Simple andIntuitive Process | Iteration 3

PROBLEM

It’s not obvious enough that the user can use voice command to start the recording
Only one button during the recording, makes it unclear how to start finish or restart

Miaojian AI Teleprompter

Role

Timeline

Tools

Background

Product Opportunity

Design Challenge

How might we build a simple and intuitive teleprompter that help users deliver lines effortlessly and simplify the editing process?

Goals

Competitive Research

What is teleprompter?

How do video bloggers use teleprompter?

User Needs

Product Requirement

Easy-to-read Line Scrolling

Scrolling Method

Simple andIntuitive Process | Iteration 1

Simple andIntuitive Process | Iteration 2

Simple andIntuitive Process | Iteration 3

Side Project: Transition Effects Template Feature