peak 감지
박수로 무대 조명 켜기
해결하는 문제
박수 같은 짧은 소리를 신호로 쓰고 싶다.
평소 소리보다 갑자기 크게 튀는 순간을 박수로 판단합니다. 두 번 연달아 치면 다른 동작을 합니다.
서버 의존도
서버 없이 브라우저 기본 기능만 씁니다.
브라우저만브라우저 + CDN브라우저 + API 키브라우저 + 엣지 함수서버 필요
데이터가 흐르는 길
무엇이 들어와서 브라우저 안에서 어떻게 바뀌어 나가는지 정리했습니다.
들어오는 것마이크 소리
브라우저가 하는 일최고값이 평균 음량의 3배를 넘는 순간 감지
나오는 것한 번: 켜기·끄기, 0.55초 안에 두 번: 디스코
쓰는 브라우저 기술
getUserMediaAnalyserNodegetFloatTimeDomainData
라이브러리와 모델
외부 라이브러리 없이 브라우저 기본 기능만 씁니다.
바꿀 수 있는 옵션
- 민감도(최고값 기준)
- 다시 감지까지 기다리는 시간
- 두 번 박수로 인정하는 간격
자주 막히는 곳
- 큰 말소리나 물건 떨어지는 소리도 박수로 오인한다
- 스피커 소리가 마이크로 다시 들어와 연쇄 반응한다
이 능력으로 만들 수 있는 서비스
같은 기술을 AI 서비스, 웹 서비스, 피지컬 AI로 넓힌 예시입니다.
AI 서비스
- 유리 깨짐·노크 같은 소리 종류 분류 모델로 확장
- 청각장애인용 소리 알림
웹 서비스
- 손뼉으로 슬라이드 넘기기
- 수업 집중 신호
피지컬 AI
- 박수로 켜는 스탠드 (ESP32 릴레이)
- 박수 리듬으로 여는 문 시제품
넓히는 방법
- 박수 리듬을 비밀번호로
- 박수 횟수로 메뉴 고르기
- 손가락 튕기기 감지
지원 브라우저
PC 크롬·엣지된다
맥 사파리된다
안드로이드 크롬된다
아이폰 사파리된다
코딩 에이전트에게 줄 프롬프트
복사해서 Claude, Codex, Cursor 같은 코딩 에이전트에 그대로 붙여 넣습니다.
마이크로 박수 소리를 감지해서 한 번 치면 무대 조명이 켜지고, 빠르게 두 번 치면 디스코 모드가 되는 웹페이지를 만들어줘.
같은 분류의 능력
03 미디어 처리에 속한 다른 능력입니다.
무료로 보는 것
체험 페이지, 한 줄 설명, 미리보기 영상
스킬팩 구성
full.html, skill.md, prompt.md, rules.md, customize.md, troubleshooting.md, 예시 데이터, agent-instructions.md