电子木鱼
Weekly Pick
一个沉浸式电子木鱼项目,通过手机陀螺仪检测上下甩动动作来模拟真实敲击木鱼,比传统点击方式更有仪式感。使用JS获取手机陀螺仪数据,竖屏状态下甩动手机即可增加功德计数。
时不时看到有人分享电子木鱼类的网页,小程序或者软件,功能都大同小异:屏幕中间有一个木鱼图片,点击图片或者按键盘上的空格键,会发出一声木鱼的声音,同时有一个计数器显示你的敲击次数, 并命名为“功德”。这是一个很好玩的小东西,无聊或者心情烦躁的时候敲一敲,挺好的。只是我看了一圈, 这些网页,小程序,软件的交互方式不太沉浸式,敲木鱼都是用一个木棒敲击,用手点屏幕也太没有仪式感了。于是我就做了一个不一样的电子木鱼,原理很简单,就是利用 JS 代码获取手机陀螺仪的数据,侦测到 beta 角度的变化才算一次敲击动作。比较方便的触发方式是:两只手竖屏状态拿着手机,把手机想象成一根竖着的木棒,上下甩动即可这么一来,普通的点击事件就变成了沉浸式的手机模拟敲击动作。功德加起来也更有仪式感了有没有?
项目地址:https://github.com/jwenjian/wooden-fish> 注意:由于并没有做详细的兼容性测试,有的浏览器可能没有办法触发。另外,iPhone手机上的浏览器默认关闭了传感器的权限,应该可以按照这里的 操作进行兼容,但是我手头没有 iPhone 手机做兼容测试,感兴趣的可以提 PR 一起完善