I wanted to see how much a browser could do with phone motion.
Gravity Lab started as me experimenting with the DeviceOrientation API and trying to turn raw phone tilt into something people could actually see and play with. I added desktop sliders too, so the page still works without a motion sensor.
Status
Pick an experiment below. On a phone, you can enable the motion sensor. On desktop, the sliders do the same job.
Sensor Privacy
The motion values stay in your browser. I am not saving or sending the sensor data anywhere.
Sensor
Not Started
Source
Manual sliders
Tilt Strength
0/100
Active App
Liquid Cup
Currently Open
Liquid Cup
Source: Manual sliders
Click any experiment card to switch. The full card is the button, so you do not have to aim for a small link.
Try it on a phone
Tap Phone Sensor, allow motion access if your browser asks, then hold the phone in a comfortable position and press Calibrate.
Desktop still works
The manual sliders feed the same experiments, so you can test the page with a mouse even when no motion sensor is available.
Calibration matters
I added calibration because every device starts at a slightly different angle. The current position becomes the new neutral.
Active Experiment
Liquid Cup
I used this one to test whether a simple interface could feel physical when the phone moves.
Source: Manual sliders
Pour Count
0
Liquid Height
52%
Tilt X
0.0°
Why I Built This
I wanted the phone itself to become part of the interface.
Most of my web projects are controlled with clicks, taps, or text input. Here I wanted to work with a different kind of input and see how device motion could control a visual interface in real time.
Building it made me work through browser permissions, sensor differences, calibration, desktop fallbacks, animation loops, sound, and physics-style movement. It is still a playful page, but the real experiment is making hardware input feel understandable inside a normal website.
Input
Phone orientation, permission handling, manual fallback, and calibration.
Behavior
Pour thresholds, direction changes, marble velocity, friction, and wall collisions.
Interface
Touch-friendly controls, clear status messages, optional sound, and responsive layouts.
Built by Brian Cabrera while figuring out how far phone sensors could push a browser interface.