Those infos don't necessary have to be shown at once. Like the Grid toggle that has more than 2 states, the X-Ray toggle could cycle between X-Ray, X-Ray CMS, X-Ray IX.
X-Ray CMS would use a purple overlay for elements with dynamic properties or content. A red overlay for Ecommerce items, green for IX… X-Ray mode would also highlight elements in the Navigator tab.
X-Ray IX would use:
the lighnting icon for elements with an IX trigger attached
a variant of that icon for elements targeted inside of an _element trigger_ IX
another variant for elements targeted inside of a _Page Trigger_ IX
another variant for elements used as triggers and targeted by a legacy IX
Spring 2020 edit: xray could help identify what a CMS element is, what an ecommerce is, and also symbols, overriden symbols, nested symbols, color CMS fields and overriden fields etc… the more Webflow gains in complexity, the more xray would be useful.
Imaging selecting an elements that's an IX trigger, and see all elements linked with this IX… Would be cool.
Vincent Bidaux
.svg){kind=logo}
In trying to understand X-ray mode a bit better I was happy to come across a previous post where you mention it being any to identify padding and margins. I would switch it on and see it go black and white and then switch it off. 😂
I love the ideas you have especially with seeing the elements of an image.
I think ultimately within reason, it would be cool to see a lot of what "Inspect" mode has in browsers.
Thanks Vincent for pioneering this topic.