New UI Update: Visual Cues for 'Bring Forward' and 'Send Backward'


#1

Hey Folks!

The Page Builder has been updated with a little UI change that improves the Bring Forward and Send Backward functionality.

Now, when you move an an element on the z-axis, a small animated visual cue will demonstrate exactly where the asset is in relation to other objects.

Technical jargon aside, the benefit is that it makes sending objects forwards and backwards  _way easier _because it’s now way easier to see. In fact, the only way we could make it any clearer would be to physically arrange the layers IRL. 

Again, it’s not a huge overhaul - just a small tweak to make our lives a bit easier when building pages.  Thoughts? Feedback? Let us know what other UI improvements you’d like to see in the future!

Ð Justin


#2

Awesome, I’ve often had to click a few times and wondered if it’s doing anything until the final click makes the visual change I’ve wanted. I’d love to see a bit more detail on layers, perhaps a layer map or redesigning the left toolbar showing all the page elements to show a layer number or grouped in layers?

Great tweak though


#3

Really great feedback, Stuart! The left toolbar is overdue for some love, I’ll pass this on to my product team. I’m also volunteering you for user testing if/when we start working on that. Deal? :slight_smile:


#4

Love it! I have often found myself clicking the “bring to back” again and again until I noticed a change. Until now I had no idea what happened, or if anything at all happened :wink:


#5

I know what you’re talking about! Hopefully it’s a little more intuitive now. :wink:


#6

New user, but love it already. Thanks for the heads up and the update!


#7

Welcome to Unbounce & the Community, David! :slight_smile:


#8

Currently having a hard time with this feature also. Can somebody please help :frowning:


#9

Hi @mathew,

Can you elaborate a bit more on exactly what you are having a hard time with?

The Bring Forward and Send Backward feature, adjusts the Z-index of your page elements.

In some cases, page elements in the same section can have a big difference between their Z-indexes and you might have to click the Bring Forward/Backward a few times to get them moving.

Just check the current Z-index of the element you want to move and see how it changes after a few clicks on one of these two buttons.

Best,
Hristian