Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migration of unmigrated content due to installation of a new plugin
Uxstatus
ready
ready
Ready, but will get extended

Basic concept

An area is a structural block of a web page and collects one or more paragraphs. Web developers commonly sub divide a page into a number of areas to group together similar content in order to improve usability, legibility and, in general, the overall structure of a page.

...

To further reduce the number of bars visible, Area Editing shall combine the edit bar and the new bar of a regionan area by mounting the actions to add a paragraph and to edit a region an area onto the same bar.

Empty areas occupy space

...

If an area requires the user to provide values for mandatory parameters, the forms collecting them will have to show up before the forms asking for parameter values of the actual paragraph. These forms must explain why additional values have to be given - please see the page describing how adding a paragraph (TBD) works for further details and mockups.

...

Mockup
Mockup - RegionEditing - Overview
Mockup - RegionEditing - Overview
1Version3
NameMockup - RegionEditing - Overview

The above mockup shows a home page with four main areas: a side column for ads, one for extras, a central main area and a footer. The bars of the containing paragraphs are hidden.

...


Area Editing on a new page


Mockup
Mockup - RegionEditing - empty page
Mockup - RegionEditing - empty page
1Version4
NameMockup - RegionEditing - empty page


Selecting an area


Mockup
Selecting an area - slide in
Selecting an area - slide in
Version11
NameSelecting an area - slide in

The edit bar of the selected area is colored using the selection color to guarantee consistency across the interface. The background of the area is slightly colored to emphasize its entire block. All edit bar of its sub paragraphs slide in. Care must be taken that any such transition is smooth and does not disorient the user, while still feeling snappy as to not hold up editing for too long.

...

Mockup
Selecting an area - fade in
Selecting an area - fade in
AlignmentCENTER
1Version2
2SizeCENTER10003
NameSelecting an area - fade in1000