How to add screen transitions

How to add screen transitions

Adding a screen transition will allow for users to navigate from screen to screen of your project. They are made up of three parts: a gesture that initiates the transition, the target or destination screen, and a transition style that controls the look of the animation. 

Add a Transition:

1. Select the Screen to apply the transition to from in the screens listed in the Left Sidebar. (Origin)

2. In the Right Sidebar, the Interactions tab should be highlighted in blue. Click the add transition button to add a transition to the screen.  



3. Select the type of gesture you want to apply to the screen from the drop-down list:  swipetap, or timed

4. Click Remove to remove an existing transition you no longer want. 



5. Update the destination screen (Target ) for the gesture. The target will be one of the already existing screens. 



5. Last, you can select the Transition type from the drop down menu list. 
Remember: Transitions dictate the navigation between screens. Some screens will need just one transition and some may need 3-4 depending on the layout of the project and how you want the user to interact with each screen through the project. 




7. You can use Live Preview to test the transitions out, enabling you to experience each transition exactly how your visitors will. 


Additional settings that can be added to a transition are CurveDurationSpacing, and Opacity
More information on Transitions can be found here

    • Related Articles

    • Screens

      Screens are the foundation of a Amaze project.  While Amaze sites are single pages, Screens allow content to be organized similar to traditional multi-page sites with the ability to add custom animations and transitions between content.  You can add ...
    • The Amaze Pro Editor Interface

      The Amaze Pro Interface allows you to easily navigate within the Editor when working on your project. 1. Project Settings:  You can launch the Project Settings menu by clicking on the gear icon located at the top of the Left Sidebar. 2. Devices:  The ...
    • How to add an Iframe

      An inline frame (Iframe) is a tool for taking content from one website and displaying it on your Amaze Pro page. Many providers that generate customizable forms and surveys offer the ability to share their content through an Iframe, including Google ...
    • How to add Animations to Content Elements

      Description: Animations can be powerful tools for engaging with your audience and improving the usability of your site. Amaze Pro allows you to animate a wide range of elements, including text, images, videos,  and shapes. Build In: The animation ...
    • Can I add a Facebook Pixel to my Famous Page?

      Currently, Famous supports adding the base code of a Facebook pixel which enables page view tracking. We don't currently support the second part of the pixel which enables you to track specific customer actions on a Famous page such as when a button ...