You can apply effects & transformations to Widgets.
3D transformations even lets you setup 2 states: one initial state and one secondary state triggered by an event (page load, click…)
Don’t abuse of 3D transformation, because it can slow down Web and PWA Projects execution on older devices.
You can adjust various parameters on any Widget, including: Opacity, Blur, Brightness, Contrast, Invert, Saturation, Sepia and Hue-Rotate.
The 3D Transformation property panel lets you adjust various transformations such as Rotate, Translate, Scale and Skew.
With the Triggered Effect Popup, it is possible to setup a secondary state and to define the action that will trigger this transformation, with duration and delay effect:
The transformation can be triggered with the following effect:
Page Load. The page has just been loaded.
Mouse Click. The user clicked (or touched) the object
Mouse Over. The mouse enter to the Widget viewport (available only on desktop)
Widget Enter in Viewport. The Widget enter in the visible area while scrolling
Widget is 50%/100% in Viewport. The Widget is 50% or 100% visible while scrolling
Timing. The speed curve of the transition effect
Duration The duration of the effect transition in ms
Delay The delay before applying the transformation once the event is triggered in ms.
This option is available for Responsive Web project only. It lets you apply a pre-defined animation class that can be executed at startup (when page is loaded) , and can be run in an infinite loop.