Innovative Login

For the innovative login system, I decided to use a custom sequence on a one octave piano (as semester 2 will be working with music students). The orginal idea was to use a guitar, and simulate the chord shapes with a fullscreen phone. This proved difficult to create CSS for.

The piano design was adapted from:

It used an AudioContext oscillator to generate sound (which works on desktop and mobile).
I redesigned the CSS to make it scale to fit most of the screen for ease of use.

A problem I ran into with this was getting the piano input from javascript to PHP, so I used ajax to post the data.

Innovative login system using a piano

Martsoukos, G. (2016). How to Use jQuery’s “ajax” Function. [online] Web Design Envato Tuts+. Available at:–cms-25774 [Accessed 18 Dec. 2018].

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.