We will design the layout focusing on the screens often used by the staff in charge.

Wagby's layout design has the following features.

  • It is done by specifying the position, size, relationship with the next item, etc. for each item.
  • You can do color, font, spacing adjustment (margin) with well-known CSS technology.
  • The designed screen can be used not only on PC but also on tablet.

By learning Wagby's layout technique you can design a fine-grained screen required for business applications.

Figure 1 Example of a new registration screen defining layout

Wagby does not provide a tool to design the screen layout visually (pasting parts).Therefore, it may take time to get used to it.Once you grab a knack, you can create a polite screen, so please try it.

In the layout design, the structure (model and model item) has settledrearIt is good timing to undertake. This is because if you add items after layout design, you will also go back to the layout design.

For models with many items, the following technique is effective.

I want to change common parts

You can change common parts (title, submenu, breadcrumbs, etc.) instead of the layout design of each screen.It uses techniques such as HTML, CSS, JSP, and JavaScript.Detail isWagby Developer Network - Screen customization with CSS, JavaScriptI am summarizing it.

By setting help message, user satisfaction is improved.Explanatory text for each screenand,Placeholder type messageThere is an effect.

Wagby is standardExcel form function.Create a form layout in Excel.

Figure 2 Example of a form using Excel

In addition to the Excel form, you can also perform a simple print function by HTML and PDF form output linked with external form library software.

The form layout design takes more steps depending on the type.Wagby does not reduce this (design) man-hour.If the amount is large, please consider separately introduce other company's form layout design software (and collaboration with Wagby).

Field application application operators tend to concentrate on screen layout and desire for screen transitions.

The project leader should make a judgment of "how much will you want?"Screens that can not be realized with Wagby are recorded as a customization theme.

Wagby's skill required for screen / form layout is as follows

The basic design procedure is complete so far.The next chapter introduces various optional functions provided by Wagby.