Feature request: multi-step pages more like official instructions (more 'fixed' layouts)

[Landcross]

For this requested feature, I'd like to be able to use more static layouts for multi-step pages, more in line with how real Lego instructions are laid out. I'll show some examples based on the instructions of set 75286.

The main difference is that in LPub3D, a step group is laid out and treated as a single entity. That means that the group itself can be positioned against everything outside the group, but everything within the group can only be positioned against other stuff in the group. In real instructions however, on a multi-step page all steps are positioned against a grid on the page and not against each other. This creates a more effective and relaxed use of space and (can) also create a more fixed layout between pages.

There are various different things at play here, and I'll try to separate them and show them one by one.

Dividing up the page

First of, the page is laid out in a grid pattern. This is entirely separate from any content on the page. From LPub3D's point of view, it's essentially splitting a single page into multiple mini-pages. See this example from the official instructions. This page is divided into 4 equal rectangles:

(Please don't worry about the vertical divider that's not centered; that has to do with printing books and is beyond the scope of this feature request, just imagine the vertical divider would be at the same place as the vertical red line)

Important to note is that the grid layout has to be fixed. It should not change based on e.g. assembly image size. What I imagine is that one can create a grid based on their own preferences which can depend on e.g. page size, assembly size and remaining steps. Do note that the number of rows can differ between columns or vise-versa if you are going for a horizontal layout. Also note that the size of the columns and rows can be automatically deduced based on the numbers (all spaces in a row or column should be equally sized/justified).

So, in short, the first step is to let people define a grid for the page and specify the number of columns and rows.

Laying out every step

Then every 'mini-page' on the whole page gets assigned its own step and is laid out as normal pages would. They all have the same margins, but not based on the full page, but based on their own rectangle space within the page. See the green lines in this image: all steps have the same margins relative to their designated space:

So, in short, the second step is to assign a step to every grid space.

Specific layout details

If one really wants to mimic a layout as exampled above, every step/mini-page has to be able to do the following layout/positioning options:

• PLI relative to assigned grid space (top-left)
• Step number relative to PLI (bottom-left)
• Assembly relative to grid space (center)

I believe most or all of these layout options are already available in LPub3D.

So, in short, step 3 is applying position preferences for the grid. Optionally also per grid item, but I'm not sure about that.

Bonus

So far, I've only assumed using the grid for submodels and the grid would end when there are no more steps in the submodel left. However... you could also (optionally) implement it so that a grid is not filled with the remaining steps of the submodel, but the remaining steps of the entire model. Then you could create layouts such as this:

But I think layouts like that might have some edge-cases, so I would view this as a nice-to-have for this feature request, than a must.

More examples

Here are a few more examples.
A two step page:

A three step page:

A five step page:

A horizontal layout with 1 row 3 columns:

[cameronmiller1988]

I second this request!

[trevorsandy]

Nice proposal! Thank you for taking the time to prepare it. I've added it to the queue because, in fact, I've already begun to implement something like this. Your porposal adds a fresh look at how I could setup the step-display speace in this type of layout.

Some of this layout can already be achieved with dividers and and applying justification to step group steps - see #333 and #172, #185 and #193.

Cheers,

[Landcross]

Just a quick update. I just realized that Bricklink's stud.io has a very similar feature as I proposed above. Maybe it's something to use as inspiration ;)

[trevorsandy]

Thank you for sharing this update.

Minus the 'predefined' template allowing you to select a specific layout, since 2.3.13 the behaviour to produce these layouts is almost completely achieveable with dividers and step justification (to center step items within a range). What's missing at this moment is the ability to place step items relative to a range but the step justification behaviour somewhat compensates for this.

At some point in the near future, I'll mock-up some sample pages to illustrate the similiarities and the approach to achievieving these layouts with the current behaviour.

In the longer term, I'll look at completing the additional components (set step item relative to range, set range and divider deminsions relative to their page demensions, automate the creation of predefined page layouts via dialogue and menu actions) needed to improve the creation and automation these layouts.

Cheers,

[Landcross]

I don't entirely agree with your comment that these layouts are already (partially) achievable with current LPub3D settings.
I mean, yes, from a purely visual standpoint you can get similar results (though not the same), but it's an entirely different way of thinking about stuff and it's a pain if you have to do multiple pages.

The major difference is, as I described above, that multiple steps on a single page shouldn't be treated as a single entity (or step group). In the new situation, each step/box on the page (layout) should be treated as its own thing, you could even say a page within a page, without any relation whatsoever to the other steps/boxes on the page, which is completely different from what LPub3D currently does. This is what makes it so difficult and annoying (if not impossible) to create identical layouts with current LPub3D features. Because when step 1 moves, step 2 moves with it. Furthermore, this also makes it impossible to create layouts that stay fixed over multiple pages, where every page has for example the stepnumber and PLI in the same positions (relative to their box).

Now, I'm not saying step groups have to go and you need to implement something entirely new, I'm sure with the proper additions it's possible to create similar layouts, with ease, in LPub3D without some major overhaul. But I don't think it's as easy as simply adding some more positioning options.

I don't want to sound negative or ungrateful, don't get me wrong. I appreciate all the work you have put and still put into LPub3D and I'm absolutely thankful for that. I'm just trying to make a point specifically regarding this feature ;)

[trevorsandy]

No worries, your position is completely understandable from an end-user point of view.

From a design transition point of view, I believe the optimal approach to achieving the behaviour you are describing in LPub3D lies in expanding the range behaviour - specifically, 1. the behaviour options available to define and position each range on a page and 2. enabling steps to be positioned and sized relative to their respective individual/multi-step, fixed-position, range. These enhancements will achieve the autonomy and consistent positioning between steps on a multi-step page you are describing.

The primary (range) divider behaviour must be extended to specify an individual step’s range (it currently divides ranges allowing multiple steps in each range) and; consequently where, on the page, the range will be positioned. Secondary, (step) dividers currently implicate the margins between multiple steps in a range and facilitate the placement of pointers between steps. No behaviour extension would be necessary.

Lastly, I’ll need a dialogue to give the user the ability to specify, perhaps dynamically or pre-defined, the page’s layout.

Cheers,

[adaneslavo]

Cannot wait for those improvements. We're so close to official instructions, but they are one step ahead with ideas :P

[adaneslavo]

Currently handling the layout is hell. Everything must be checked few times, because some settings break your page entirely. Sometimes stupid margin is causing the problem. Imo, page layout definition should consist of few steps:

1. Add steps you want to place on the page (that seems to be ok);
2. Place dividers (this is almost ok; divider size is sometimes buggy - you cannot set dividers size to page, because it sets to step sizes not to page, which is stupid; when I say page, I mean all the page regardless of what step sizes are);
3. Set horizontal ratio for step sizes (this is the worst thing to set, because:
4. Place Assembly based on STEP, to be able to move it across entire step. For now, you can only set PLI position from Assem, which makes Assem to locate in very weird position and unable to move with offsets. If we could set Assembly first, then with offsets, there would be no problem.
5. Place PLI based on STEP. Another annoying thing, where you may set PLI only from Assem position, and it sticks to it and is... ahh. I hate positioning PLI and Assem.
6. Place Step Number (seems to work fine, but some configurtions just doesn't work.

In the example above, I use one of 3 working configs:
PLI is based on Assem to the Top Left corner outside;
Step Number is based on PLI Bottom:Left corner outside;
I would like to move all the stuff to the left, but PLI and Step Numbers are blocking this, as well as the fact that images must be set in columns. To move the to the left, which is sometimes necessary I must use:
PLI is based on Assem to the Top:Left corner outside
but then I get something like this:

I had to use this config, because with first one picture landed outside the page and I couldn't move it left. Now, I am unable to move the picture to the right, because this PLI setup blocks horizontal moves of the Assem, so sometimes I must do some work to place things like in this picture. Neither config helps to center the Assem, and I cannot set Assem location by hand.
Thirs setup is for when all stuff is placed in line
PLI is set to the Left:Top corner of the Assem outside;
Step Number is placed to the Left:Top of the PLI outside;
We get something like this:

And to be honest, these are the only 3 configs that work. Rest is garbage that deposition stuff or throws errors on redraw, or just look ugly.

Here I would like to move the third step up to not enter the 4th territory, but I can't. Every offset is set to 0, and lowering the size of 3rd step moves up, but 4th step, which increase the problem. I son't want to set the config above where everything is inline, because picture will move to the top of the page and break the consistency of the look. I cannot set negative margin (offset). So I'm stuck with this, and I'm not happy, but ths is the best effort I did. The worst thing is I have so much unused space on the page, but I cannot fill it.

And as my predecessor said, this:
https://user-images.githubusercontent.com/12005521/97576289-424a2b80-19ee-11eb-9238-dc4aec0d11e3.png
is what I would like to have. Here:

I could save one page by merging the stuff, but now I cannot. Hiding the step doesn't work, because it doubles the previous orange page in pdf.