The Motion Sensor component

Create engaging motion-related effects on mobile devices with the Motion Sensor component.

The Motion Sensor component is a powerful tool that allows you to leverage the built-in accelerometer in mobile devices, enabling you to detect and respond to changes in motion, tilt, and orientation.

With the Motion Sensor component, you can bring dynamic interactivity to your mobile applications, both web and native, by synchronizing other components, such as images or scrolling areas, with the movement of the device. By recognizing changes in speed and amplitude, you can create immersive experiences that respond to the user's physical actions. On a computer, the motion sensor is controlled by the mouse.

Whether you are building a game, a fitness app, or an interactive storytelling application, the Motion Sensor component opens up a world of possibilities for enhancing user engagement and providing a more intuitive and captivating user experience.

In this tutorial, we will guide you through the process of incorporating the Motion Sensor component into your iOS or Android app. You will learn how to insert the Motion Sensor component, customize its properties, synchronize it with other components, and trigger actions based on specific tilts or orientations.

Edit the Motion Sensor

Create motion-related effects

You can create effects based on the global motion movement or triggered at a specific tilt angle.

Global Motion Movement

When you synchronize the global motion movement using the Motion Sensor component, you are linking the motion of the device (detected through the accelerometer) to the behavior of another component in your application ( Scrolling area, Sequence). This synchronization allows you to create dynamic and interactive experiences where the movement of the device influences the behavior of the synchronized component.

For example, you can synchronize a Sequence of Images with the horizontal axis of the Motion Sensor component. As the user tilts their device horizontally, the sequence of images can change accordingly, creating a visually engaging effect that responds to the device's motion.

This type of action is useful when you want to create a continuous relationship between the device's motion and the behavior of other components. It enables you to build immersive experiences that make the user feel connected to the application through physical interactions.

How to synchronize a Sequence with the Motion Sensor horizontally: 

1. Add a Sequence component and edit its properties.
2. In the properties of the Motion Sensor, choose Horizontal
3. Insert a Synchronization component and click + Add in the properties.
4. Select the Sequence and the Motion Sensor.
5. Set the properties to synchronize: Frames for the sequence, Horizontal axis for the motion sensor.

Triggering an Action at a Specific Tilt Angle

You can also trigger specific actions based on a particular tilt angle or orientation of the device. This means that when the device reaches a predefined tilt or orientation, a predefined action is triggered in response.

To achieve this, you need to create a marker at the desired tilt/orientation using the Motion Sensor component. The marker represents the specific position or angle at which you want the action to occur. Then you can set up an action that will be triggered when the marker is reached.

For instance, you can create a marker when the device is turned over, and when that marker is reached, you can configure the action to change the screen or perform any other desired behavior. This allows you to provide specific responses or effects when the device reaches certain orientations or tilts.

This type of action is particularly useful when you want to create targeted and context-specific interactions based on the device's physical positioning. It gives you control over specific events or behaviors that occur at particular tilt angles or orientations, enhancing the overall user experience and providing a more tailored interaction.

How to trigger an action based on device tilt

• Open the Motion Sensor
• Add a marker and define the desired tilt angle
• Add an action to the Motion Sensor
• Choose this marker as the trigger.
• Add an action