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
91
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
気圧・高度・GPSを記録&可視化するアプリ「Koudo」を作った話
hjmkth
1
360
技術記事、 専門家としてのプログラマ、 言語化
mizchi
14
7.5k
『コードを書く以外の』エンジニアリング〜課金基盤移行プロジェクト推進のためのTips4選
yuriko1211
0
510
Apache Hive: そしてCloud Native Lakehouseへ
okumin
1
140
OSINT for SRE: 学術論文とポストモーテムから探る システム障害の共通パターン / SRE NEXT 2026
tomoyk
1
3.9k
えっ!!コードを読まずに開発を!?
hananouchi
0
220
ランチタイムLT会3周年!ランチタイムLT会を3年間続けられたお話
y0hgi
1
140
「正の参照」と 「負の導出」で組む ハーネスエンジニアリング
cottpan
1
140
AIエージェントで 変わるAndroid開発環境
takahirom
2
680
yield再入門 #phpcon
o0h
PRO
0
580
AI駆動開発を妨げる技術的負債の解消アプローチ / ai-refactoring-approach
minodriven
17
9.1k
Welcome to the "Parametricity" 🏙️ − Generic だけど Specific な世界 −
guvalif
PRO
1
170
Featured
See All Featured
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
1.2k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
6k
Building an army of robots
kneath
306
46k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
880
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
220
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
1
370
Building AI with AI
inesmontani
PRO
1
1.1k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
240
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
490
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.5k
Designing Experiences People Love
moore
143
24k
Navigating Team Friction
lara
192
16k
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!