From September, Flash will no longer be supported by Chrome. Prepare for the shift towards HTML5 by visiting our Flash to HTML5 help page

Check it out!

New Components

 

The new version of HTML5 Studio builder comes with a set of new components:

  • Cube
  • Panel Slide
  • Countdown
  • Parallax
  • Carousel

 

 

New components

1) Adding new components workflow

 

  • Cube

    With Cube builder component you can create compelling 3D Cube ads in a convenient manner. To get you started, navigate to the list of Components and choose Cube that can be found under the Presentation section.

    You can either choose to customize your ad via the Simple or the Advanced settings from the General tab. However, it is important to note that if you start customizing your ad with, for example, the Advanced set of settings, you will no longer be able to use the Simple ones and vice versa. 

    Simple settings menu

    The Simple settings tab allows you to:

    • Select either horizontal or vertical Direction towards which your ad will be rotating.
    • Enable Auto-rotating.
    • Add Default Buttons.

    cube simple

    Advanced settings menu

    Apart from the options that Simple settings have, the Advanced settings tab presents you with more options to choose from:

    • Indicate the Number of Sides you want your ad to have.
    • Adjust the Width and Height of your Panel (in % or px).
    • Choose whether you want to have Buttons on each Panel or should they be shown on the initial panel only and whether they should be displayed horizontally or vertically.
    • set Total Animation Time, adjust Perspective (in px).
    • Allow Parent Swipe,  which allows you to maintain the functionality of rotation/animation of another component within 3D Cube.
    • Upload Swipe Icon image of your own instead of the default one.

    Bear in mind that if you disable Auto-rotate, you will not be able to set Total Animation Time and alternatively, if you disable Default Buttons, the options for Buttons on each Panel and Buttons position won't be accessible. 

    cube advanced

     

    The Size & Position allows you to configure visibility, rotation (°), arrangement, alignment, size, and position of the component. Cube works as call-to-action button and performs certain actions. Furthermore, you are also able to apply a number of animationsAfter you are done with the primary settings, double-click on  Cube 1 and select Add New PanelFrom here you will be able to add different components or import files by dragging them on the Cube and modifying them in the same manner as the components

     

  • Panel Slide

    With Panel Slide builder component you can create compelling Slider ads in a convenient manner. To get you started, navigate to the list of Components and choose Panel Slide that can be found under the Presentation section.

    You can either choose to customize your ad via the Simple or the Advanced settings from the General tab. However, it is important to note that if you start customizing your ad with, for example, the Advanced set of settings, you will no longer be able to use the Simple ones and vice versa. 

    Simple settings menu

    The Simple settings tab allows you to:

    • Select either horizontal or vertical Direction towards which your ad will be rotating.
    • Enable Auto-animation.
    • Add Default Buttons.

    slide panel simple

    Advanced settings menu

    Apart from the options that Simple settings have, the Advanced settings tab presents you with more options to choose from:

    • Adjust the Width and Height of your Panel (in % or px).
    • Choose whether you want to have Buttons on each Panel or should they be shown on the initial panel only and whether they should be displayed horizontally or vertically
    • Add Navigation Bullets.
    • Set Transition Time as well as Total Animation Time.
    • Enable Parent Swipe, which allows you to maintain the functionality of rotation/animation of another component within Panel Slide.
    • Upload Swipe Icon image of your own instead of the default one. 

    Bear in mind that if you disable Auto-animate, you will not be able to set Total Animation Time as well as Total Transition Time and alternatively, if you disable Default Buttons, the options for Buttons on each Panel and Buttons position won't be accessible.

    Slide panel advanced

    The Size & Position allows you to configure visibility, rotation (°), arrangement, alignment, size, and position of the component. Panel Slide works as call-to-action button and performs certain actions. Additionally, you are also able to apply a number of animations. After you are done with the primary settings, double-click on  Panel Slide 1 and select Add New Panel. From here you will be able to add different components or import files by simply dragging them on the Panel Slide and modifying them in the same manner as the components

  • Countdown

     With Countdown builder component you can create compelling ad's with Countdown functionality. Please refer to the image below to get more glimpse on the creative process.

     Countdown Component

    1) Workflow on applying Countdown component

     

    Countdown with Expanding Workflow

    2) Using Countdown component together with Expanding ad

  • Parallax

    Parallax component lets you create beautiful ads by leveraging parallax effect. Please check a workflow bellow to get more details on how this works in Studio.

     

    Parallax component

    1) Working with Parallax component workflow

  • With Carousel builder component you can create compelling Carousel ads in a convenient manner. To get you started, navigate to the list of Components and choose Carousel that can be found under the Presentation section.

    You can either choose to customize your ad via the Simple or the Advanced settings from the General tab. However, it is important to note that if you start customizing your ad with, for example, the Advanced set of settings, you will no longer be able to use the Simple ones and vice versa. 

    Simple settings menu

    The Simple settings tab allows you to:

    • Select either horizontal or vertical Direction towards which your ad will be rotating.
    • Enable Auto-rotation.
    • Add Default Buttons.

    carousel simple

    Advanced settings menu

    Apart from the options that Simple settings have, the Advanced settings tab presents you with more options to choose from:

    • Adjust the Width and Height of your Panel (in % or px).
    • Indicate Panels Spacing
    • Choose whether you want to have Buttons positioned horizontally or vertically.
    • Set Transition time and Total Animation Time.
    • Adjust Perspective
    • Allow Parent Swipe,  which lets you to maintain the functionality of rotation/animation of another component within 3D Cube.
    • Upload Swipe Icon image of your own instead of the default one.

    Carousel advanced

    Bear in mind that if you disable Auto-rotate, you will not be able to set Total Animation Time and you won't be able to use custom Swipe Icon. Alternatively, if you disable Default Buttons, the options for Buttons Position won't be accessible as well.

    The Size & Position allows you to configure visibility, rotation (°), arrangement, alignment, size, and position of the component. Carousel works as call-to-action button and performs certain actions. Furthermore, you are also able to apply a number of animations. After you are done with the primary settings, double-click on Carousel Panel 4 and select Add New Panel. From here you will be able to add different components or import files by simply dragging them on the Carousel and modifying them in the same manner as the components