...

1. The information should be succinct, descriptive but not contain any coding information or any detail beyond a brief usage description for each item.
2. For further information the user needs to look to official documentation. For this reason there needs to be a link to official documentation from within Magnolia CMS 5.

...

All three tabs require changes.

General suggestion valid for all three tabs is to add a link to official documentation, where users can find detailed information on using fields. The link could be by the line "Showcase apps......." (Same link for ALL tabs ; it appears above tabs.)

Form fields tab changes

Suggest making a few alterations to the Showcase App: Form fields tab:

1. Increase real estate for the fields (i.e make the grey area bigger - stretch it to the left and right).
2. Left align all fields.
3. Add headingsthree columns:
   
   1. Field name
   2. Appearance
   3. Function (or Description)
4. Consider adding visible columns for headings (i.e grey vertical lines)
5. Add a short usage description per field. Say, max 140 characters. (Use this for... Can also be used for... etc.) Where, why, how. (Use on x pages to describe....Try not to use more than x times per page.)
6. Add link to official documentation, where users can find detailed information on using fields. The link could be by the line "Showcase apps......."

...

Vaadin fields

...

tab changes

Suggest making a few alterations to the Showcase App: Form Vaadin fields tab:

1. Increase real estate for the fields (i.e make the grey area bigger - stretch it to the left and right).
2. Group fields thematically or judiciously based on pleasing aesthetics (Does it look neat? If i saw this produced by another company, would I say that this looks nice?)
3. Left align all fields.
4. Use sentence case for headings (First word capitalized only.) At present there we 'Magnolia icons' but 'Progress Indicator'.
5. Left align everything.
6. Add three columnsAdd headings:
   
   1. Field name
   2. Appearance - show the field
   3. Function (or Description) - description
7. Perhaps BOLD the highest level of heading (the category - for example Magnolia icons) not secondary headings. So, 
8. Label each item, field individuallly, either as independent things or as members of a category
9. Consider adding visible columns for headings.
10. Add a short description per field (see 6c,. Say, max 140 characters. (Use this for... Can also be used for... etc.) Where, why, how. (Use on x pages to describe....Try not to use more than x times per page.)
11. Add link to official documentation, where users can find detailed information on using fields. The link could be by the line "Showcase apps......."

...

...