Interactive 3d experiences in real-time

Up here is an interactive WebGL canvas:
a 3d landscape with some interactive features like drawing in 3d space, camera movements and post-processing glitch.
Coded in Three.js, HTML5 and CSS.

And here below is my lab with experiments and projects.

Mandala

Mandala_web_3Mandala_web_3

An interactive music maker, built in three.js.
The user has the power to create melodies and enhanced looping visuals, just by mouse movements and clicks.
Deeply hidden in our brain, at the tiniest scale, our third eye resonates with the higher dimensions of existence.
It’s our gateway to the Cosmos.
Music and repetition enables us to focus on this state of being, and the MANDALA of our mind is drawn: in looping, endless and ever-changing shapes.
Connecting mathematics, social sciences and consciousness studies, this game lets you meditate and resonate with the eye of your mind!

Online at lostconversation.com/mandala

For desktop, tablet and smartphones.
Created by Marco Bagni - Audio Sarc:o

Mosaico Stellare

Cassini_CoverCassini_Cover

A Three.js experiment, fetching images from the Cassini NASA archive and displaying a spacey interactive environment. Images are clustered and infobox panels are being developed now.
It also features a colorful stop-motion like animation.

Finding Knowing Delight

sarcosarco

Sarc:o new music album has a strong concept, and the process of discovery is the basis of this piece.
The full project consists of: album cover, animated trailer, and interactive website.

Graphic Man

Graphicman_Frame_01Graphicman_Frame_01

This is a prototype of a custom 3d builder in real-time for browser.
Graphic Man shows a 3d human model literally reduced to the bones, and a simple interface to isolate body parts.
This builder can be applied to any 3d model.

Hi-Knowledge

Hi-knowledgeHi-knowledge

Hi-Knowledge is a web portal dedicated to scientific data visualisation.
The idea is to offer an interactive navigation between several “nodes” of information, visualizing hierarchies and data in an engaging and interactive way.

 

New Berliners Names

berlinersberliners

This beta version shows a map of all the names given to newborn berliners in the years 2012-2016, divided by district. It does not represent actual births, because sometimes one child can have more than one name.

Idea and Development: Marco Bagni + Max Zimmermann

 

Beta version online at Konstruktivum.de

WebGL Shaders

Cables_Web2dCables_Web2d

Experimenting with tools to create interactive WebGL Canvas.
This is a collection of 2d prototypes that respond to mouse interactions, built with code and a modular javascript-node-based software called Cables made in Berlin by Undev
 

 

Finally interactive

lost_logolost_logo

Moving from motion to interactive... landing page.