Ideas to make the Designer's X-Ray Mode more useful

Hi all. I just posted an idea in the Wishlist and I’d like to get your attention and gather your opinion and ideas around it.

https://wishlist.webflow.com/ideas/WEBFLOW-I-1132

The Designer’s X-Ray mode doesn’t get much love from Webflow designers. I’ve run a few polls and it seems it’s really underused.

That’s too bad because IMHO it’s already quite good as it is. 3 colors on hover indicates margins and paddings, the x-ray gray grid gives a very clear view of what the structure of site is. It is particularly useful to analyze a site you’re haven’t worked on for some time, or a template you haven’t build, or to work on a site that has been built by someone else. Also, the X-Ray mode is always one click away in the UI and have a useful shortcut (cmd-shift-x).

What if it was a better tool for analyzing your own designs, and what is it was solving of helping with a few struggle we all face? I think about:

  • spotting elements bound to anything CMS
  • spotting elements bound to anything IX

So what are you own struggles? Do you have ideas of other features that the X-Ray mode could host to help with those? You can post on the wishlist site directly, or here and I’ll update my Idea post.

Other possible useful things:

  • Helping to optimize the website: showing images data on everything image and bg: original size, displayed size, type (bitmap or vector or anim), weight, and using colors as alerts for heavy assets
  • helping to craft and debug complex 3D transform animations: isometric / 3D view of the structure of the page, or anything that would help working with 3D tranform when you have a lot of layers, thic could include:
    – using colors to see flipped (rotated) elements
    – using indicators to clearly show how goes the inheritance of perspective and what self and children perspective values elements of a scene have

Thanks!

3 Likes

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.