AudioClassifier
소리 알림판
해결하는 문제
화재경보나 초인종 소리를 듣기 어려운 사람에게 눈과 진동으로 알려 주고 싶다.
마이크 소리를 521가지로 알아보고 화재경보, 연기 감지기, 사이렌, 유리 깨짐 같은 소리가 들리면 칸을 켜고 진동하며 기록합니다.
서버 의존도
외부 라이브러리나 AI 모델을 CDN에서 받아 옵니다. 서버는 필요 없고, 오프라인용은 ./libs/에 넣어 둡니다.
브라우저만브라우저 + CDN브라우저 + API 키브라우저 + 엣지 함수서버 필요
데이터가 흐르는 길
무엇이 들어와서 브라우저 안에서 어떻게 바뀌어 나가는지 정리했습니다.
들어오는 것마이크 소리 (약 0.3초씩)
브라우저가 하는 일YAMNet 모델이 소리 종류별 확률 계산
나오는 것감시 소리 알림과 시간 기록
쓰는 브라우저 기술
getUserMediaWeb AudioVibration API
라이브러리와 모델
MediaPipe Tasks Audio (로컬 우선 로딩)yamnet.tflite (약 4MB)
바꿀 수 있는 옵션
- 감시할 소리 목록
- 알림 기준 확률
- 같은 알림 다시 울리는 간격
자주 막히는 곳
- 비슷한 소리(전자음, 휘파람)를 경보로 오인할 수 있다
- 브라우저 탭이 꺼지면 감시가 멈춘다
이 능력으로 만들 수 있는 서비스
같은 기술을 AI 서비스, 웹 서비스, 피지컬 AI로 넓힌 예시입니다.
AI 서비스
- 청각 보조 알림 서비스
웹 서비스
- 어르신 돌봄 소리 감시
피지컬 AI
- 경보음 감지 시 ESP32 경광등 켜기
넓히는 방법
- 알림을 휴대폰 푸시·메신저로 전달
- 교실 소리 환경 기록
지원 브라우저
PC 크롬·엣지된다
맥 사파리된다
안드로이드 크롬된다
아이폰 사파리된다
코딩 에이전트에게 줄 프롬프트
복사해서 Claude, Codex, Cursor 같은 코딩 에이전트에 그대로 붙여 넣습니다.
MediaPipe AudioClassifier로 마이크 소리를 분류해서 화재경보, 사이렌, 노크 소리가 들리면 해당 칸이 켜지고 진동하는 웹페이지를 만들어줘.
같은 분류의 능력
04 브라우저 속 AI에 속한 다른 능력입니다.
무료로 보는 것
체험 페이지, 한 줄 설명, 미리보기 영상
스킬팩 구성
full.html, skill.md, prompt.md, rules.md, customize.md, troubleshooting.md, 예시 데이터, agent-instructions.md