parent
8ba2c5803d
commit
46f9bebed2
@ -0,0 +1,47 @@
|
|||||||
|
# 🎵 Rhythm Machine
|
||||||
|
**Tier:** 2-Intermediate
|
||||||
|
|
||||||
|
### Description
|
||||||
|
**Rhythm Machine** is an AI-powered drum beat generator and sequencer built with **HTML, TailwindCSS, and JavaScript**.
|
||||||
|
It allows users to create, play, and experiment with custom drum beats or automatically generate new rhythms using AI backends such as **OpenAI**, **Gemini**, **Claude**, **LM Studio**, or **GitHub Copilot**.
|
||||||
|
|
||||||
|
The purpose of this app is to give music enthusiasts and learners an interactive way to create, understand, and explore rhythm patterns with or without AI assistance.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### User Stories
|
||||||
|
|
||||||
|
- User can **toggle steps** in a 16-step sequencer to build beats
|
||||||
|
- User can **adjust tempo** in real-time
|
||||||
|
- User can **select from genre presets** (Techno, Trap, Lo-Fi, etc.)
|
||||||
|
- User can **enter an API key** to connect with AI services
|
||||||
|
- User can **type a beat description** (e.g., “trap drums”) to auto-generate a rhythm
|
||||||
|
- User can **play, pause, and clear** the rhythm sequence
|
||||||
|
- User can **see the active beat step** during playback
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Bonus Features
|
||||||
|
|
||||||
|
- User can **switch between multiple AI backends** dynamically
|
||||||
|
- User can **use LM Studio locally** without an internet connection
|
||||||
|
- User can **visualize beat patterns** with animation
|
||||||
|
- User can **export rhythm settings** as JSON
|
||||||
|
- User can **see live tempo and beat indicators**
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Useful Links & Resources
|
||||||
|
|
||||||
|
- [Web Audio API Guide (MDN)](https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API)
|
||||||
|
- [Tone.js Documentation](https://tonejs.github.io/)
|
||||||
|
- [TailwindCSS Documentation](https://tailwindcss.com/docs)
|
||||||
|
- [OpenAI API Docs](https://platform.openai.com/docs/api-reference)
|
||||||
|
- [Google Gemini API Docs](https://ai.google.dev/docs)
|
||||||
|
- [Anthropic Claude API Docs](https://docs.anthropic.com/)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Example Projects
|
||||||
|
|
||||||
|
- [Drum Machine by freeCodeCamp](https://drum-machine.freecodecamp.rocks/)
|
||||||
Loading…
Reference in new issue