Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / Tutorial

Mengubah Suara Ketulisa Dengan javascript

Posting Komentar

Mengubah Suara ke Tulisan menggunakan JavaScript 

Pada tutorial ini, kita akan belajar bagaimana mengubah suara menjadi tulisan menggunakan JavaScript. 
Dengan menggunakan teknik Speech-to-Text (STT), kita dapat mengonversi suara yang diucapkan oleh pengguna menjadi teks yang dapat digunakan dalam aplikasi web. 

Javascript suara ke text


 1. Pendahuluan 

Speech-to-Text (STT) adalah teknologi yang memungkinkan komputer untuk mengubah ucapan manusia menjadi teks. Dalam tutorial ini, kita akan menggunakan JavaScript untuk mengimplementasikan STT pada aplikasi web. 
 

2. Persiapan 

Sebelum kita memulai, pastikan Anda memiliki pengetahuan dasar tentang HTML, CSS, dan JavaScript. 
Selain itu, pastikan Anda memiliki aplikasi browser yang terbaru untuk menjalankan kode JavaScript. 

 3. Mengonversi Suara ke Tulisan 

 3.1. HTML 

Pertama, buatlah sebuah file HTML yang akan digunakan sebagai tampilan aplikasi web. 
Berikut adalah contoh kode HTML yang dapat Anda gunakan sebagai dasar:


<!DOCTYPE html>

<html>

<head>

  <title>Speech-to-Text</title>

</head>

<body>

  <h1>Speech-to-Text</h1>

  <button id="start-btn">Mulai</button>

  <button id="stop-btn">Berhenti</button>

  <div id="result"></div>

  <script src="script.js"></script>

</body>

</html>

3.2. JavaScript 

Buatlah file JavaScript baru dengan nama script.js. 
Kode JavaScript berikut akan mengimplementasikan fungsi Speech-to-Text: 


window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;

const recognition = new SpeechRecognition();

recognition.interimResults = true; // Mengaktifkan hasil sementara

let p = document.createElement('p');

const result = document.querySelector('#result');

result.appendChild(p);

recognition.addEventListener('result', e => {

  const transcript = Array.from(e.results)

    .map(result => result[0])

    .map(result => result.transcript)

    .join('');

  p.textContent = transcript;

  if (e.results[0].isFinal) {

    p = document.createElement('p');

    result.appendChild(p);

  }

});

recognition.addEventListener('end', recognition.start);

recognition.start();

3.3. Penjelasan 

Kode Berikut adalah penjelasan singkat tentang kode JavaScript yang digunakan: 

Pada baris ke-1, kita mendeteksi apakah SpeechRecognition didukung oleh browser. Kemudian, pada baris ke-3, kita membuat instance dari SpeechRecognition. 
Pada baris ke-5, kita mengaktifkan hasil sementara dengan mengatur properti interimResults menjadi true. 
Kode selanjutnya akan mendengarkan event result dari SpeechRecognition. 

Ketika hasil pengenalan suara ditemukan, teks akan ditambahkan ke dalam elemen <p> yang ada di dalam elemen dengan id result pada file HTML. 
 Jika hasil pengenalan suara adalah hasil final (tidak sementara), kita akan membuat elemen <p> baru untuk menampilkan hasil berikutnya. 
 Terakhir, kita memulai pengenalan suara dengan memanggil metode start(). 

 3.4. Uji Coba 

Simpan file HTML dan JavaScript pada direktori yang sama. Kemudian, buka file HTML tersebut menggunakan aplikasi browser. 
  Klik tombol "Mulai" untuk memulai pengenalan suara.  
Ucapkan kata-kata yang ingin Anda konversi menjadi tulisan.

 Hasil pengenalan suara akan ditampilkan secara real-time pada layar. 
 Klik tombol "Berhenti" untuk menghentikan pengenalan suara. 

 4. Kesimpulan 

 Dalam tutorial ini, kita telah belajar bagaimana mengubah suara menjadi tulisan menggunakan JavaScript. 
Dengan mengimplementasikan Speech-to-Text (STT), kita dapat mengonversi suara yang diucapkan oleh pengguna menjadi teks yang dapat digunakan dalam aplikasi web. 

Anda sekarang dapat mengembangkan aplikasi yang dapat menerima input suara dari pengguna dan mengubahnya menjadi teks.

 Selamat mencoba!


Speech-to-Text Demo⬇️

Posting Komentar untuk "Mengubah Suara Ketulisa Dengan javascript "

Silahkan berkomentar sesuai ketentuan layanan dan kebijakan privasi blog kami