PWA가 말하기 시작하면

WaveNet을 사용하여 기사에 음성 합성 추가

Tom 배우기, 프로그레시브 웹 앱, 기계 학습

우리가 연설에 대해 말할 때 말하는 것

모든 기사를 다양한 다른 언어로 자동 번역하도록 설정 한 후, 다음으로 구현할 수있는 현대적이고 유용한 기능이 무엇인지 생각하기 시작했습니다. 내 게시물을 읽는 것이 가장 즐거운 경험 중 하나라는 데 절대적으로 동의 할 것이므로 자동 음성 합성 서비스를 사용하면 기사 UX를 더욱 향상시킬 수 있다고 생각했습니다. 따라서 계획은 간단했습니다. 기사 텍스트의 시작 부분에 사용자가 브라우저의 오디오 플레이어를 통해들을 수있는 새로운 작업을 추가하겠습니다.

방법 : 음성 합성

현재 앱의 아키텍처를 살펴본 후 자동 음성 합성 및 오디오 플레이어로 PWA를 향상시키기 위해 다음 워크 플로가 구현되었습니다.

  1. 표준 옵션 대신 (많은) 가격 책 정자 WaveNet 옵션을 사용하여 GCP의 텍스트 음성 변환 서비스를 통해 합성 구현
  2. 생성 된 mp3 파일을 GCP에서도 호스팅되는 간단한 파일 시스템 인 Firebase 저장소에 저장합니다. 파일 이름은 기사의 슬러그와 사용 된 로케일로 구성되어있어 암시 적 ID를 제공하고 지정된 연설에 대한 모든 URL을 참조하는 별도의 문서를 추가하지 않아도됩니다.
  3. 그런 다음 기사 페이지를 만들거나 업데이트 할 때 Vercel 서버에서 위의 두 단계를 호출합니다. 현재 최대 24 시간마다 수행됩니다.
  4. 오디오 URL을 사용할 수있는 경우 웹 플레이어에 지연로드 사용

게 으르는 것이 중요합니다

웹 응용 프로그램로드 성능 (결과적으로 검색 엔진 순위)을 손상시키고 싶지 않으므로 웹 플레이어는 두 가지 조건이 충족 된 후에 만 요청시로드됩니다.

  • 기사의 오디오 URL은 실제로 사용할 수 있으며 현재 주로 비용을 낮추기 위해 영어 텍스트에만 적용됩니다.
  • 사용자가 재생 버튼을 클릭하여 소리내어 읽은 기사를 실제로 듣고 자 함을 나타냅니다.

지금은 모든 언어가 아닌 이유는 무엇입니까?

Google의 WaveNet을 실제 음성 합성 모델로 사용하기 때문에이 기능에 대한 비용을 주요 관심 사항으로 고려해야합니다. WaveNet 사용 비용은 표준 합성 모델의 4 배입니다. 그러나 저는 WaveNet이 Google 자체뿐만 아니라 IBM과 같은 대부분의 다른 모델보다 훨씬 뛰어난 성능을 발휘하기 때문에이 제품을 선택했습니다.

시작일뿐

이 PWA의 첫 번째 버전에서 음성 합성을 구현 한 방법에 대한 간략한 개요입니다. 코드 작성에 걸리는 시간은 몇 시간 밖에 걸리지 않았습니다. 이미 GCP 고객이되어 대부분의 설정을 완료했기 때문입니다. 생성 된 출력은 매우 훌륭하게 들리며, 이는 WaveNet 및 ML 기반 음성 및 텍스트 처리 방식의 강점을 보여줍니다. 향후 구현에서는 지원되는 모든 언어에 대해 소리내어 읽기를 추가 할 수 있습니다. 앞으로 몇 달 동안의 사용량과 비용을 기준으로이 경우 진행 방법을 결정합니다.


행위

Feedback

추천 게시물