An interactive mobile game designed by Valerie Danzer implemented by Matthias Steinbauer. The game is published live in the third release of the splace-magazine.
A demo version is available here. Make sure that you visit the page with a mobile browser. It makes heavy use of orientation sensors and accelerometers.
The idea and screendesign of Valerie Danzer is implemented in large parts. Right now 4 out of 5 situations are implemented. The 5th widget would require sound input which is currently not available cross-platform on mobile devices.
The widget is based on HTML5, it makes use of the DeviceMotionEvent and the DeviceOrientationEvent. Further, some of the jQuery 3.2.1 magic is used and CSS is structured with LESS 2.7.2.
The Live version includes CSS styles from the file test-your-fear.css since this is a requirement of the splace-magazine framework. If changes to the LESS file test-your-fear.less are made a lessc compile run is requried. Install LESS to the project with:
npm -g install less
Compile the CSS from the LESS file with
lessc test-your-fear.less test-your-fear.css
Alternatively use the commented less.min.js frontend code in the test-your-fear.html file and move the stylesheet reference to a less include.