Overview

This is a p5.js sketch that allows the user to record and playback their keyboard input. Ultimate goal is to create a drawing tool for users to compose visualizations alongside music of their own choosing.

Controls

• Keyboard:

  • Pressing on most (non-control) keys will result in the corresponding key being lit up in the top (green) keyboard. The full list is:

      `1234567890-=
       QWERTYUIOP[]\
        ASDFGHJKL;'
         ZXCVBNM,./
          [SPACE]
    

• Buttons:
  • The buttons allow the user to start/stop recording keyboard input, as well as start/stop replaying of that input.

References:

• processing/keyviz - Original sketch I wrote a while back in Processing.
• Fantasia - Disney film from 1940

Links:

• Live View
• Source on Github

Screenshot:

Note: The screenshot shows an alternate mode, where the keys don’t fade away.

Screen captures

Without fading:

With fading: