[Early access beta] New expression composer for more intuitive logic!

I literally can’t even answer your question :rofl::rofl:

loading-cat

2 Likes

I’ve added all the parentheses that as far as I can tell are irrelevant, and my thoughts are:

  • each ‘module’ gets a parentheses (where a module is something you can change without the rest of the expression being affected). Examples are ‘Vendor’ and ‘Administrator’. I think this is mainly what makes it so confusing
  • parentheses also refer to the order as you’d expect like the previous expression composer (but why are they styled the same as 'module parentheses? some parentheses refer to the operation order and some refer to expression modules you can change?)
  • the entire expression gets parentheses? That’s like putting 2+2 as (2+2).
  • why are fields that contain sets like ‘Vendor’ bracketed but fields that don’t not? e.g I’d expect to be able to change the #admin franchise id is empty to another field is empty. Maybe I can, I don’t know, I haven’t been able to test it because it throws issues in my editor…

Anyways this is what I can gather after staring at it for 10 minutes. I’m probably wrong about everything, but if I don’t understand it then it’s 50% me being dumb but the other 50% is poor UI design.

EDIT: Bubble seems to be calling what I called ‘modules’ as ‘atoms’ (the individual components of each expression), which to their credit is a better word for it.

1 Like

Yeah, what the hell are these?

image

at first I thought you might be able to use this to create an expression like: (Current User's Type is (Admin or Vendor)) instead of ((Current User's Type is Admin) or (Current User's Type is Vendor)

which would be great… but no you can’t…

so why does ‘Administrator’ need to be inside its own square corners? What does it mean?

And why does Vendor have its own line with a left corner, but the right corner is separated from the line? What’s is that supposed to indicate?

And the fact you can longer see what an expression evaluates to by hovering over it is really annoying (that was one of the most useful features in Bubble!!)…

4 Likes

That makes too much sense, so that ain’t happening!

1 Like

Hmm now I can’t convert an element to something else… There are no options

Is that related to having the feature on or off? Is that a vanilla element that normally has a replacement?

Happening with groups and inputs since I turned on the feature. Lot’s of whack things are affected that seamingly would have nothing to do with the feature.

TBH my editor is going a bit bonkers

So some other things it’s effecting.

Can’t run the debugger
Can’t user the inspect too search/dropdown (ok if I directly click on the element)

I probably should lodge some formal bugs

Hey everyone,

As always, the team and I appreciate the feedback you’re providing! That said, this is exactly why we do a beta, and we’re taking all your feedback into account as work toward launch.

First, I want to talk about the new brackets you’re seeing. Bubble language parses expressions from left to right, which is what allows you to build complex expressions. With the experimental parentheses feature we released last year, we heard from users that while they found these parentheses familiar from math, they were also confused. They expected that they could manually manipulate or adjust these at will since these experimental parentheses appeared as characters in the expression. Since the experimental parentheses were only meant to indicate Bubble’s evaluation order, we wanted to make clear that they only represented a visualization, rather than something more manipulable; as a result, we chose to use brackets in the beta composer.

That being said, the new brackets function the exact same way as experimental parentheses. Some helpful clarifications:

  • Each bracket corresponds with a matching bracket, which you can see by hovering over any one of them.
  • Hovering over individual atoms will also show the expression to which they belong by giving the relevant text full opacity; everything outside that expression is faded out.
  • Atoms that have the same color as you hover over them indicate that they’re on the same level of precedence.
  • Spaces between brackets signify you can insert in between those atoms. When the brackets do not contain a space, this indicates you cannot insert at this location.

We hear you on the brackets being smaller and less familiar than parentheses. One avenue we’re exploring is making these brackets bigger and/or a toggle between these brackets and parentheses.

I also saw several of you mention a desire to be able to work with parts of expressions. By opening up insertion spots in this new interaction model, we now have the foundation to eventually allow you to select (drag/drop), copy, and paste parts of expressions in a future scope of work! In the meantime, you should now be able to edit expressions in the middle without disrupting existing content. Here’s an example walkthrough of this ability, alongside some keyboard shortcuts.

Finally, I’ll be posting a changelog of fixes we’ve pushed in the initial post. Feel free to use that as a reference for any issues you’ve reported. In the meantime, we’re working on them!

This feature is still in the beta phase – please keep the feedback coming! We’re listening and iterating based on what we’re hearing from you all. :slightly_smiling_face:

15 Likes

Thanks for the clarifications.

Blue cursor is great. It’s intuitive because it’s just like working with a word processor.

Okay, that now makes sense.

Really? More confused than we are now?! Surely nobody thinks that 5 tiny brackets for a relatively simple expression is a good UI. I’ve never had more than two or three parentheses next to each other using the old expression composer.
CleanShot 2023-08-17 at 17.34.42@2x

So, the understanding I’m left with is that any bracket can mean one of the following:

  1. You can’t insert anything here
  2. Contains a group of atoms behaving like a parentheses
  3. It’s an atom (e.g Option Sets always have an opening and closing bracket)

Also, good to hear drag and drop is on the roadmap!

@georgecollier I’d clarify that any bracket can either denote the order of operations (in which sub-expression an atom is contained) and/or represent a place where you can insert new data. :smiley:

To your point on the number of brackets, with the expression I used in the Loom, the number of brackets you see in the beta composer is equivalent to the number of parentheses that would appear with the experimental parentheses feature (see below screenshot). Because these visualizations are essentially equivalent, it wouldn’t be possible to reduce the number of parentheses down to two or three because the expression itself is quite complex. I agree for simple expressions, you probably won’t see as many parentheses/brackets!
Screenshot 2023-08-17 at 12.55.08 PM

3 Likes

That is super nice, changing Current user to a Search:first item without the whole thing falling apart

1 Like

Thanks Grace! Some good updates in here. I agree that the brackets should be larger. I noticed in your Loom video the colors of the brackets showing each ‘grouping’, sort of like how code might be shown in a code editor (i.e. like how the <DIV> tags in an HTML viewer might be). Is there any thought in the colors being on by default so we can easily see each grouping distinction, and then a highlighted version of them if selected?

image

6 Likes

I agree with colouring the brackets and highlighting the relevant expression that belongs in the bracket. It wasn’t the number of brackets in the previous version that was the issue, it’s that it wasn’t so clear where the bracket started or ended.

To that note, I prefer the old version as well, as the brackets were larger and more obvious to recognise.

3 Likes

Amazing thank you

I have some font variables set that break/unavailable when I turn on the beta. Only the built in app font shows up

Thanks for the example walkthrough video, didn’t realise we could use the keyboard arrows to essentially navigate whole expression segments, so was useful for that added context.

I actually think having a quick video on these more elaborate complex features is a good idea, it doesn’t have to be branded or scripted in any way, something just like this going through the core run-through is pretty useful.

I think the blue cursor is a little easy to miss and could be a bit more visible in its appearance maybe…

3 Likes

@grace.hong

Can you confirm that switching to this new feature will maintain the same logic/order of operations for any existing expressions built with the experimental parenthesis feature (even complex ones)?

1 Like

@andrew Would you be able to submit a bug report for that behavior?

@adamhholmes Yes, you can use this new composer and the old composer with experimental parentheses interchangeably because they preserve the same logic/order of operations.

3 Likes

Agree! @grace.hong @nickc, a quick & straightforward video for these excellent features would go a long way.

2 Likes