My website combines the style guide, animations and sound to create an experience where the user feels they are inside an algorithm.
Animations
My perspective background was the inspiration behind the animations I included on my website.
With the first style guide, I used jQuery .animate to animate the position of the overview page elements, from the centre of the screen to their final positions. I did this because I wanted to give the impression that the data was coming forward from the centre of the screen.
When the user hovers over buttons, such as the 'Submit an Inference' button, as well as changing style, they also move in the direction of the perspective background. I believe this continues the 3D interface, with depth effect I was going for.
Sound
Sound is played on hover of certain elements, for example, buttons and filter titles. Also, when the minimum character count hasn't been met when submitting an inference, an error sounds plays. Using sound was a great way for the user to be immersed in the experience. Through feedback, many were pleased with the sound choice and felt it was a good addition for the interface.
As my project is all about experience how algorithms in our devices work, I feel I should have done research into possible sound design for algorithms as the sounds I picked were sounds for normal interfaces.
This example sounds very out there.
Interface video showing sound and animations:
Comments