Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Web Speech API
Search
Pascal Helfenstein
March 04, 2015
Programming
90
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Web Speech API
Pascal Helfenstein
March 04, 2015
More Decks by Pascal Helfenstein
See All by Pascal Helfenstein
Chatbots
nicam
1
95
Service Worker
nicam
0
75
IoT + Voice = Awesome
nicam
0
87
Introduction to AngularJS
nicam
1
160
Other Decks in Programming
See All in Programming
ADKを使って簡単にAIエージェントを作ってみよう
k1mu21
0
280
スマートグラスで並列バイブコーディング
hyshu
0
260
TSKaigi Night Talks 2026_TypeScriptでサプライチェーンの整合性を型に閉じ込める
geekplus_tech
0
410
Performance Engineering for Everyone
elenatanasoiu
0
220
Go1.27で導入されるジェネリクスメソッドでできること
mackee
0
180
act1-costs.pdf
sumedhbala
0
110
作って学ぶ、 JSX (TSX) ランタイムの基本
syumai
7
1.7k
フロントエンドとバックエンドで「1文字」を揃えよう
youkidearitai
PRO
0
740
Vite+ Unified Toolchain for the Web
naokihaba
0
340
Even G2とAWSで推しのエージェントを召喚しよう!
har1101
1
120
ランチタイムLT会3周年!ランチタイムLT会を3年間続けられたお話
y0hgi
1
110
TypeScript+Orvalで実現する型安全かつ堅牢でスケーラブルなマルチチャネル通知基盤 / TSKaigi Night talks ~after conference~
d0riven
0
360
Featured
See All Featured
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
210
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
170
Introduction to Domain-Driven Design and Collaborative software design
baasie
1
860
For a Future-Friendly Web
brad_frost
183
10k
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
150
Abbi's Birthday
coloredviolet
3
8.2k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
akashhashmi
0
370
First, design no harm
axbom
PRO
2
1.2k
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
380
My Coaching Mixtape
mlcsv
0
150
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
62k
Optimizing for Happiness
mojombo
378
71k
Transcript
Web Speech APIs
$WHOAMI I am Pascal Helfenstein nicam
Why speech?
None
None
What do we need?
Speech Recognition Speech Synthesis “It can talk” “It can hear”
Some Intelligence “It can think”
The browser can do it!
How does it speak? var msg = new SpeechSynthesisUtterance('Hello World');
// Config (optional) msg.voice = 'Google UK English Male'; msg.volume = 1; // 0 <-> 1 msg.rate = 1.5; // 0 <-> 1 msg.pitch = 1; // 0 <-> 2 speechSynthesis.speak(msg);
How does it listen? var recognition = new webkitSpeechRecognition(); //
Config (optional) recognition.lang = "en-US"; // "de-DE", "en-IN" recognition.continuous = true; recognition.interimResults = true; recognition.addEventListener('result', function(event) { console.log(event.results[0][0].transcript); // "whats the time" console.log(event.results[0][0].confidence); // 0.93414807319641 }); recognition.addEventListener('end', function(event) { // Start your action }); recognition.start();
How does it think? \_(ツ)_/¯
Ask \_(ツ)_/¯
DEMO
WebSockets API Calls Demo architecture Speech Recognition Speech Synthesis
Browser Support
None
None
What to look out for • interactivity requires SSL… •
synthesising long texts breaks it • it’s not good in noisy environments
Questions?
Thanks!