visual editor brainsform

[crcn]

• will want layers in left panel
• consider simplifying DSL to ensure that complexity doesn't bleed into UI tooling
  • No dynamic attribute string values. E.g: --some-var: {binding}
  • Simplify CSS rules. E.g: .selector { &--child {} } may be too complicated to represent in a UI.
• there should be a tab bar in left panel that contains
  • layers
  • file navigator?
• Include build button that compiles Paperclip files
  • This could be a hidden function, primarily geared towards non-engineers
• UI for configuring paperclip.config.json file

[crcn]

• https://cobiro.com/website?utm_interest=website&gclid=CjwKCAiAyPyQBhB6EiwAFUuakrUzYnC9O3Pve-s-tQ6e2y9Zoj2WhUQkZ6uJK_8Tk-USvDzd6yX5kxoCVDEQAvD_BwE

[crcn]

component picker. UX is a bit awkward, but this works well for VS Code embedding

[crcn]

Plasmic sidebar:

[crcn]

Webflow's page switcher is really nice

[crcn]

panels need to be made smaller if the iframe is a certain size here

[crcn]

https://www.pagecloud.com/

[crcn]

https://www.uiflow.com/

[crcn]

https://draftbit.com/features

[crcn]

Variant creation in Framer 😍:

[crcn]

elegant approach to displaying properties