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.
Martsoukos, G. (2016). How to Use jQuery’s “ajax” Function. [online] Web Design Envato Tuts+. Available at: https://webdesign.tutsplus.com/tutorials/how-to-use-jquerys-ajax-function–cms-25774 [Accessed 18 Dec. 2018].