Basics of Motion Computing

There's a lot to learn when getting started with Motion Computing; here is some information and guiding principles to bear in mind.

MotionStack Sensors

The following diagram illustrates the flow of sensor data through MotionStack. Refer to the MotionStack APIs for more usage details.

Adtile Sensor Dependency Graph

Hard vs. Soft Sensors

MotionStack provides access to both hard and soft motion sensors. Hard sensors refer to the sensors built into the hardware of your mobile device that directly measure motion, like the Accelerometer or Gyroscope. In order to use these sensors in your projects, you need to be familiar with the coordinate frames that your device uses to report these sensor readings.

Soft sensors are quantities that are derived downstream from the hard sensors to provide other useful information about motion that are not observed directly, such as the Orientation API that estimates the angular position of the device as inferred by the Accelerometer, Gyroscope, and possibly the Magnetometer.

Trigger Gestures vs. Continuous Motion Updates

Incorporating motion sensors into your project can be an excellent way to build an intuitive interface or install some fun features to your work. It allows a very natural and lively dialogue between an end-user and software.

This section emphasizes the differences between trigger gestures events, which fire whenever a specified gesture is registered by MotionStack, and continuous motion updates, where sensor updates are consistently fired regardless of how the user moves their device.

Trigger Gestures

The easiest way to incorporate motion sensing in your project is to use higher-level functionalities that register motion gestures, such as tilting or shaking the mobile device. These features allow the developers to send a callback function to be executed when a gesture is recognized. This callback function is sent to the sensor using the start() method.

For example, if you want to execute a function called transitionLeft() on a left tilt and transitionRight() on a right tilt, the following JavaScript code would set up that feature:

var tilt = new MotionStack.Tilt({orientation: "horizontal"});

var callbackFunction = function (e) {
  if (e.direction === tilt.DIRECTION_LEFT) {
  else {


See the Tilt API for more information regarding specific usage of this feature.

Continuous Motion Updates

More advanced usage of MotionStack may leverage lower-level functionalities that are more closely tied to raw sensor data, such as the Accelerometer, Gyroscope, Magnetometer, or Orientation sensors. These APIs are designed to report data to the motion experience at the same rate as the browser reports the sensor readings. In most cases, this means that the sensors report the data at a constant sampling rate, which is set by the browser; in some cases, however, the browser only reports sensor readings when the device is in motion, which leads to an irregular sampling rate. This should be taken into consideration when using these APIs.

Decoupling sensor updates

In cases where continuous sensor updates are required, it is a best practice to keep the sensor data feed independent of downstream functionality. For example, if continuous updates are needed from the Gravity API, it is safest to use the sensor updates within a loop using requestAnimationFrame(). Given an update function updateWithGravity(), such a script should resemble:

var gravityData = undefined;

var gravity = new MotionStack.Gravity();
gravity.start(function (e) {
  gravityData = e;

// Request Animation Frame Loop Example
requestAnimationFrame(function loop() {
  if (gravityData !== undefined) {