Hey Bubblers! ![]()
I’m excited to share a project I’ve been working on to solve two major pain points we all face: Input Lag on validations and Workflow Spaghetti when building complex logic sequences.
Meet FlowLogic.
It comes in two flavors, depending on what you need:
1. The Watcher (Free Edition)
For Real-Time Validation & Optimization.
We all know Bubble’s native “Do when input value changes” can feel slightly sluggish, especially for “Instant” feedback like password strength meters.
The Solution: FlowLogic creates a direct DOM Hook to your input element ID. This bypasses the Bubble internal digest cycle for 0ms latency.
Killer Features:
-
Instant Feedback: Validate inputs (Length, Regex, Comparison) the millisecond a key is pressed. -
Smart Debounce: Want to trigger a workflow only when the user stops typing for 2 seconds? Built-in. Perfect for Auto-Save features without hammering your WUs. -
Char Counter: Validates text length internally before sending data to Bubble.
Get the Free Edition: FREE EDITION
2. The Automator (Pro Edition)
For Sequential Execution & “User Macros”.
Ever wanted to build a User Onboarding Tour, or a complex “If/Then” sequence without creating 20 different workflows in the backend?
The Solution: The Pro engine reads a JSON Script (sequential list of steps) and executes them in the browser. It’s like having a mini-Zapier running inside your user’s page.
What can it do?
-
Logic & Memory: Check conditions against LocalStorage (e.g., “Has user seen this popup?”). -
Local Storage: Save data to the browser memory permanently (save WUs by not using the DB for temporary flags!). -
UI Control: Smooth Scroll to elements, change CSS Styles, Add/Remove Classes. -
Interaction: Trigger native Browser Alerts, Confirms, and Prompts. -
Integrations: Fire Webhooks directly or trigger specific Bubble Events via Named Triggers. -
God Mode: Run custom JavaScript snippets within the flow if you need edge-case logic.
Pro Edition and Playground: PRO EDITION (Go test the “Builder” interface in the Pro section—it allows you to construct JSON flows visually!)
Use Cases
1. The “Gamified” Password Field (Free) Turn icons green instantly as the user types, checking for length, special chars, etc. Zero lag.
2. The “Smart Autosave” (Free) User writes a note → Plugin waits 2000ms after the last keystroke → Triggers “Save to DB”.
3. The “Onboarding Tour” (Pro) Step 1: Check LocalStorage (Is this the first visit?) → If No, Stop. Step 2: Scroll to “Settings Section”. Step 3: Play “pop.mp3” sound. Step 4: Add CSS Class “highlight-box” to the settings group. Step 5: Browser Alert: “Click here to change your settings!” Step 6: Set LocalStorage (Visited = Yes).