Login Signup Animation Plugin

InstallationStep 1: Add the Plugin to Your Bubble App

1. Open your Bubble application.
2. Go to the Plugins tab.
3. Click Add plugins.
4. Search for Login Signup Animation.
5. Click Install to add the plugin to your application.

Step 2: Verify the PluginAfter installation:

1. Go to the Plugins tab in your Bubble editor.
2. Confirm that Login Signup Animation appears in your installed plugins.
3. Make sure the plugin is active.

UsageStep 1: Add the Login Signup Animation Element

1. Open the page where you want to use the animation.
2. Go to the Design tab.
3. Open the plugin elements section.
4. Drag the Login Signup Animation element onto the page.
5. Position the Yeti avatar wherever you want it to appear.

The element can be positioned anywhere on the page. The avatar will respond to interactions with the input fields.
Step 2: Add Your Input FieldsAdd the required input fields to your page, such as:

• Username
• Email
• Password
• Confirm Password

Set up the inputs normally using Bubble's standard Input elements.
Step 3: Connect the Animation to the InputsThe Yeti avatar automatically detects interactions with the input fields on the page.
Once the element and inputs are present:

1. Click on an input field.
2. Enter text or interact with the field.
3. Observe the Yeti animation.
4. Test different input fields to verify that the animation responds correctly.

No additional workflow configuration is required for the basic animation behavior.
TestingBefore publishing your application:

1. Click Preview in the Bubble editor.
2. Navigate to the page containing the animation.
3. Interact with each login/signup input.
4. Verify that the Yeti responds correctly.
5. Check the animation on different screen sizes if your page is responsive.

Important Notes

• Keep the Login Signup Animation element visible on the page.
• Input fields should be located on the same page as the animation element.
• Avoid dynamically hiding the input fields if you want the animation to respond to them.
• Make sure the animation element is not covered by another element.
• For advanced customization, check the plugin's available settings.

Demo / EditorYou can view the plugin implementation and test the setup in the Bubble editor:
Open Bubble Demo Editor
TroubleshootingThe Yeti animation is not respondingCheck the following:

1. Confirm that the plugin is installed and active.
2. Make sure the Login Signup Animation element has been added to the page.
3. Verify that the input fields are on the same page.
4. Make sure the input fields are not hidden dynamically.
5. Preview the application again after making changes.

The Yeti is not visibleCheck that:

• The element has sufficient width and height.
• The element is not hidden.
• It is not positioned behind another element.
• The page's responsive settings are not causing it to move outside the visible area.

PublishingOnce the animation has been tested successfully:

1. Return to the Bubble editor.
2. Confirm the element and input fields are configured correctly.
3. Test the page one final time in Preview mode.
4. Deploy your changes to Live.

The Login Signup Animation will then be available to users on your live application.