Why no drag & drop like WIX?

[davidjeba]

Why are we having so many drag & drop frontends which are block based not wix like fluid drag & drop?

[prevwong]

Because sites/pages are almost all block based, thus the dnd in Craft is made to handle that majority use case.

[lexoyo]

It's an excellent question

Silex v2 was like wix (editor.silex.me) and the v3 is now block based (v3.silex.me)

The v2 had a mechanism to generate the mobile version and had a mobile editor to customize the generated version. It's nice but in the end it adds a layer on top of standard html and this was bugguy in some cases and not as fast.

Another point is that was not standard bit oke of silex mission is that what a user learns in silex needs to be useful outside of silex. No concept should be needed outside of html and css

Also that's not what no-code developers are used to. And silex aims to be more like webflow than like wix. Actually in 2009 i believe the first version of wix was inspired by silex. Wix is meant to have a smaller learning curve than webflow for example. Because the target user is a no-code developer not a general public person. So is silex as another mission is to help people who are not developers sell websites or get jobs in IT

I'm happy to disciss this subject as it took me uears to take this decision

[davidjeba]

Past:
Design: Photoshop/Illustrator -> Html/CSS -> Code

Present:
Design: Figma/XD -> Html/CSS -> Code

Html/CSS -> Code is the most difficult part
Designers being creative they do insane level of creativity sometimes it becomes a nightmare for the developers to replicate their design

that madness is being made easy by Elementor, Divi like pagebuilders which allow the developers to code the site in a visual way

then comes wix which brings a frontend first approach which has merged design -> code process in a visually & intutive way

then there are new players like teleportHQ are trying to even compress this process

With the power of AI, im 100% sure and expecting that figma becomes the defacto website builder
design -> publish [AI does the inbetween process]

[amiramir2124]

https://khanephotoshop.com/

photoshop tutorials
and
Photoshop products

[alihammad99]

Well, Wix and Figma both use position: absolute CSS property to make the blocks' position move anywhere easily.
The challenge here with the responsiveness is that using position absolute instead of flex-box is not the best way to display content.

However, you can still add this feature to your nodes easily by triggering the active or selected node in Craft.js, and you can add the position absolute to your component's CSS, and finally add a drag event trigger to update the selected node's position with the pointer position on the window