Hello! I'm excited to introduce "Wake-Up," an open-source React component that can recognize the sound of clapping or finger snapping on the web. ๐
- MIT License (commercial use allowed): Ready to test with a model size of just 5MB!
๐ฎ Try It Out Now!
๐ Visit the Demo Page
๐ GitHub Repository
โ ๏ธ Tips for Better Recognition:
Use an external microphone for the best results.
Earphones or Airpods may not work as well.
Works on both desktop and mobile!
๐ป How to Use It?
First, install it:
npm install wake-me
# or
yarn add wake-me
You can easily use it in React like this:
import { WakeMe } from "wake-me";
function App() {
return <WakeMe onSnap={() => console.log("Snap!")} />;
}
๐ค Potential Use Cases
- ๐๏ธ AI Systems: Wake up AI assistants with a finger snap, just like saying "Hey Siri."
- ๐ญ Presentations: Advance slides with a snap.
- ๐ฅ๏ธ Video Conferences: Get attention or a turn to speak.
- ๐จ Digital Art: Interactive exhibitions responding to audience sounds.
- ๐ค Smart Homes: Control IoT devices with claps or finger snaps.
โจ Features of the Library
- ๐ High-performance AI model implemented with TensorFlow.js.
- โก Real-time sound detection and analysis.
- ๐ชถ Lightweight and easy-to-use structure.
You can also use it with vanilla JavaScript:
<script src="https://cdn.jsdelivr.net/npm/wake-me@latest/dist/vanilla/vanilla.global.js"></script>
<script>
const wakeMe = new WakeMe({
onSnap: () => console.log("Snap!"),
onNoise: (score) => console.log("Noise level:", score)
});
wakeMe.init();
</script>
๐ค Can It Be Used Commercially?
Yes! This project is provided by the LLAMI Team and is available under the MIT license, so feel free to use it as you like!
๐ญ Limitations of the Library
The current version is designed for tablet demonstrations, and on devices like MacBooks, it may also pick up sounds such as keyboard typing, tapping on a desk, or chair squeaks. We're working to improve this!
Top comments (5)
great!
I admire your project and have reviewed your profile and the languages you've used. I've noticed you don't have a background in Python. As a web developer interested in learning TensorFlow.js, could you share how you studied TensorFlow and built your foundational knowledge in AI/ML?
best
Congrats!
good project!