The Bricksforge Panel makes your site interactive! You can listen to various events and perform one or more actions when the event is triggered. One of the highlights is the ability to create exciting GSAP animations through a UI.
Events
You can choose between a large number of events, e.g. "On Scroll Position", "On Form Submit" or "On Bricks Slide Changed". You can also use custom events, which gives you endless possibilities.
Actions
When an event is triggered, one or more actions are executed. Bricksforge offers you ready-made actions such as "Add Class" or "Run GSAP Timeline", but you can also write your own JavaScript if needed.
GSAP Animations
With the Bricksforge Panel you can create impressive GSAP animations via a UI. You don't need any programming skills for this. After adjusting the animation settings, you can see the changes directly in the builder.
Folders
Organize your event instances and timelines in folders. This way, you always keep an overview of your interactions on your site. Additionally, this gives you the option to, for example, disable all instances within a folder.
Conditions
For events and actions, there is a conditions system through which you can specify under which conditions execution should be allowed. For example, you could allow the execution of an action only if a certain storage entry exists.
Customization
You have various options to customise the UI of the Bricksforge Panel to your individual needs (e.g. to your screen situation). So you can be sure that you can work efficiently without being distracted by narrow areas.
Bricksforge Panel in action.
Some Insights
Pointer Events
With the integrated mouse events, you have many different options. One of these is, for example, the yellow dot on this website, which always follows the current position of the mouse.
Mouse Position
X Axis: 0 Y Axis: 0
Scroll Events
Listen to the scrolling behaviour of your users and perform any actions depending on the scroll position or other event data. For example, you could only show a fixed sidebar if the scroll position is greater than 500 pixels.
You are scrolling DOWN. Your current scroll position is 0.
Mutation Observer
Execute actions as soon as something changes on a specific DOM element. In the example on the right, a class is added to the button when the “Toggle Element Class” button is pressed. This change in attributes is noticed, and the actions are executing, in this case, the great “Confetti” action.
Toggle Element Class
Animation Control
Control your animations with different event actions. In this example, the animation is either paused, resumed, restarted or played reversed, depending on which button is pressed.
PlayPauseRestartReverse
... and much more!
Create a free playground to explore the full functionality of the Bricksforge Panel 🙏
Create Your Free Playground
Test Bricksforge 7 days for free – as often you want!
