爱意满满的作品展示区。
lisheng3698

我把摄像头变成了乐器:从手势识别到 Web Audio,分享 5 个真正踩过的坑

  •  
  •   lisheng3698 ·
    lisheng3698-design · 16h 46m ago · 430 views

    最近做了一个有点不一样的浏览器小项目:用摄像头识别双手动作,再把手的位置和姿势映射成和弦、音高、音量和音色。

    不需要安装软件,也不需要麦克风。打开网页、允许摄像头后,就可以隔空演奏。

    项目地址:GestureSynth.me

    建议使用最新版 Chrome 或 Edge 。摄像头画面只在本地处理,不会上传。

    真正难的不是“识别到手”

    最开始我以为,只要 MediaPipe 能返回手部关键点,剩下的事情就是把坐标转换成音符。

    实际做下来发现:识别出一只手很容易,让它变成一个“能演奏”的控制器才难。

    摄像头每一帧都会返回一组手部关键点,但这些坐标会轻微抖动,偶尔还会丢失。如果直接把原始坐标连接到音高或者音量,听起来会非常不稳定。

    最后形成的处理链路大致是:

    摄像头
      → 手部关键点识别
      → 提取手掌位置、距离和手势
      → 平滑、死区和状态保持
      → 映射成音阶、和弦、音量和音色
      → Web Audio 实时合成声音
    No Comments Yet
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2967 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 07:22 · PVG 15:22 · LAX 00:22 · JFK 03:22
    ♥ Do have faith in what you're doing.