First pass though web blocks: I can see the productivity gain.

My start point was to better understand how FlexGroup’s work, alignment, padding and object margins. The upside for using a FlexGroup is an opportunity to transition from a desktop to a mobile format, just by squeezing the width of the FlexGroup to change the alignment from horizontal to vertical.

I applied this to a demo here: https://initiostar.co.uk/demo/flex-group/ where one has a photo and text template that extends downwards as the text grows. Visually, it works better where templates are the same size and the mobile variant transitions to a one-template width. Having played with FlexGroup’s, I found it is easier to grasp where to use Flexible Blocks and where to use Freehand Blocks.

Thereafter, I simply selected a Web Block website template, deleted all but one block, added a Freehand Block at the page top. One can create one’s own Web Blocks, or just select ANY Web Block from ANY of the modular website templates.

First bash here: https://initiostar.co.uk/demo/blocks2/

- The first web block seems better as a Freehand block; I ran into a variety of alignment issues when I started with a Flex Block. I could not get the position [ x : y ] to be [ 0 : 0 ] i.e. have an object sit at the top of the page, left-aligned; it seems the x coord would not set to [ 0 ]

- Using the Alt and Shift keys to bypass adding an object to a Flexible Block or standard Web Block seems to work and it was easy to add my own Navbar for a desktop and variant.

- Adding objects in a standard website does not auto-share them across variants, whereas with Web Blocks it does. This requires a designer to stop sharing and delete where this is not appropriate.

- You need a disciplined approach to text styles, else it can become real messy between variants (because of blocks auto-share).

I can see the attraction of Web Blocks if you are familiar with WordPress, WIX etc.