GithubHelp home page GithubHelp logo

nealm2001 / melodybot Goto Github PK

View Code? Open in Web Editor NEW

This project forked from noops-challenge/melodybot

0.0 1.0 0.0 26 KB

Melodybot brings a little swing to Drumbot's steady beat. Drumbot emits different beats, and Melodybot provides the melody to go on top of it.

Home Page: https://noopschallenge.com/challenges/melodybot

JavaScript 82.40% CSS 6.57% HTML 11.03%

melodybot's Introduction

Melodybot

👋 Hello from Melodybot

Meet Melodybot, Drumbot's cousin. Melodybot loves two things: APIs and Keytars.

Melodybot played lead and rhythm keytar in many bands during its heyday, but over time the keytar fell out of favor and gigs were fewer and farther between.

Seeking a career change, Melodybot enrolled in a coding bootcamp. Immediately upon graduation Melodybot went to work on creating this API to serve you hot keytar lines.

Note: these melodies are also playable on other (not as cool) instruments.

API

Melody's API has the following endpoints:

GET /melodybot/random

This will return a new melody in a random key.

GET /melodybot/generators

Melodybot has a few different generators it uses to make melodies. This returns a list of them.

You can also specify the key and/or the generator for your melody:

GET /melodybot/random?generator=arpeggio&key=D%20Minor

Each melody is composed of a sequence of notes that each looks like:

  {
    "start": 0,                      // the step the note starts playing
    "duration": 2,                   // how many steps it plays for
    "value": 64,                     // the value of the note -- these numbers come from the MIDI standard
    "name": "E4",                    // Name of note + octave
    "noteName": "E",                 // Just the note name
    "octave": 4,                     // Just the octave. "C" is the lowest note of each octave
    "frequency": 329.6275569128699   // The frequency in Hz (cycles per second) of the note
  },

See the API Documentation for more information.

Starter kit

Melodybot has included a starter kit for you—a synthesizer that runs in your browser.

See it in action

This example requires WebAudio support, which is relatively new and support can be slightly different in each browser. This drum machine should work on Edge, Firefox, Chrome, and Safari. Also note that on some mobile devices, WebAudio only plays through headphones—so if you don't hear anything, plug some in!

The WebAudio page on MDN is a good place to start learning about the WebAudio API.

Ideas to try

Here are a few ideas for you to try:

  • Change the sounds: These sounds are pretty boring. Try experimenting with oscillators, filters, panners, and all of the other goodies in the WebAudio API. Check out synth.js for more information.

  • Change the speed and volume!: This synthesizer doesn't let you set the tempo or turn it up or down. Try adding a tempo control and a volume knob.

  • Play multiple melodies at once: The Melodybot API allows you to request a melody in a key of your preference. Try playing two melodies in the same key at the same time.

  • Integrate with Drumbot: Start a bot band in your browser. Sync Melodybot and Drumbot together.

  • Spice up the design!: Add your own flavor. Maybe mix in colors from Hexbot?

  • Add visualizations: Use AudioContext.createAnalyser to analyze the audio data. Create a sound meter or do something else awesome!

  • Use a different programming language: Most languages and platforms out there can play music, with a little help from a library or two. What's your favorite language?

Show Melodybot what you made!

Push your work up to your own fork and tell us about it.

More about Melodybot here: https://noopschallenge.com/challenges/melodybot

melodybot's People

Contributors

doolittle avatar davidmfoley avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.