FOOOD.ONLINE

FOOOD.ONLINE was a workshop about creating web-based toys around the topic of "food", with a focus on accessibility and playful intuitive interaction design. The goal was to create a website that is easily shareable to possibly reach a wide audience online.

Workshop with: Mario Von Rickenbach
Assistant: Tibor Udvari

Projects

Soup Simulator

Description
Eat the soup using your spoon. But be careful: flies tend to drown in it.
Authors
Kevin Breithaupt, Sébastien Matos
Technical limitations
Tested on Chrome 54 and Firefox 49. Issues with p5.sound.js and canvas on Safari. Not tested on mobile browsers since it's a cursor-based webtoy.
Technologies
p5.js, p5.sound.js
Extra credits
Sound Effects by freesound.org, soundbible.com, audioblocks.com


Cursorivore

Description
Cursorivore is a web toy where you can feed a plant using nothing, but your mouse cursor. There’s one different interaction for each of the 6 levels.
Authors
Nathan Vogel, Bastien Mouthon
Technical limitations
Tested on Chrome and Firefox. The full experience is unavailable on other browsers, because the Pointer Lock API is required. Mobile browsers aren’t supported since it’s a cursor-based experience.
Technologies
paper.js, anime.js, perlin.js, pointerlock.js


Press an orange

Description
A webtoy where you can press an orange by spinning around it.
Authors
Alfatih Al Zouabi, Ernest de Lapaillonne
Technical limitations
Tested on Chrome, Firefox, Safari, Safari iOs. Low texture resolution on Firefox and Safari iOs. Need to reload the page to get the sound on Safari desktop. Not tested on android
Technologies
Three.js, Howler.js


Ice Screen

Description
A project about the interactions between a mouth and an ice cream. Give the mouth to eat, see what happens and keep going, watching to not miss an ice cream ball. Grab the ice cream balls with your cone, be careful, it’s melting.
Authors
Alice Nimier, Jonathan Boulenaz, Maelle Chenaux
Technical limitations
Tested on Chrome and Firefox. Doesn't work with Safari. Untested on mobile browsers.
Technologies
p5.js, p5.play.js, p5.sound.js
Extra credits
Sound Effects by freesound.org, modified by us