웨이브폼 진행 바

2 min read

시각적 웨이브폼이 표준 선형 진행 바를 대체합니다. 각 게시물마다 고유한 패턴이 적용되어 모든 플레이어가 개성 있는 모습을 갖추게 됩니다. Pro 및 Agency 플랜에서 사용할 수 있습니다.

활성화 방법

  1. 텍스트 음성 변환 → 플레이어로 이동합니다.
  2. 진행 바 스타일에서 웨이브폼을 선택합니다.
  3. 저장합니다.

이제 사이트의 모든 오디오 플레이어에 웨이브폼이 적용됩니다.

각 게시물에 고유한 패턴이 생성되는 이유

웨이브폼은 게시물 ID에서 파생된 시드값을 기반으로 생성됩니다. 이를 통해:

  • 모든 게시물이 시각적으로 다른 웨이브폼을 갖습니다
  • 동일한 게시물은 항상 동일한 웨이브폼을 표시합니다
  • 웨이브폼은 실제 오디오를 나타내지 않습니다 (결정론적 시각 패턴입니다)

파일 크기 증가 없이 정적 바보다 훨씬 나은 시각적 효과를 제공합니다. 웨이브폼은 60개의 바로 구성된 인라인 SVG입니다.

클릭 및 드래그로 탐색

웨이브폼은 인터랙티브하게 작동합니다:

  • 원하는 위치를 클릭하여 해당 지점으로 이동
  • 위치 표시기를 클릭하고 드래그하여 오디오 탐색
  • 데스크톱과 터치 기기 모두에서 작동

색상

웨이브폼은 플레이어 설정에서 두 가지 색상을 사용합니다:

  • 진행 기본 색상 - 재생되지 않은 바
  • 진행 재생 색상 - 재생 헤드 뒤의 바

텍스트 음성 변환 → 플레이어 → 색상에서 변경할 수 있습니다.

성능

  • 웨이브폼은 단일 인라인 SVG입니다 (플레이어당 약 2KB)
  • 플레이어가 이미 로드하는 JavaScript 외에 추가 스크립트 없음
  • Core Web Vitals에 영향 없음

무료 사용자를 위한 대체 기능

무료 플랜 사용자는 웨이브폼을 선택해도 선형 진행 바가 표시됩니다. 이 기능은 PRO 전용입니다.

관련 페이지