Adempiere UI Design Guidelines

At WTC, whenever we are implementing Adempiere for our customers, we recommend following best practices to our developers:

  1. The complete content is visible (including the buttons) on the lowest resolution of 1024×768
  2. The system and functionality works in the same way on the following browsers:
    1. IE 7/8
    2. FireFox 3.x
  3. Try to fit as much content as possible in the first page (so that we would not have the vertical scroll bar) – wherever possible, follow the 2-column approach to show the fields
  4. If the content exceeds a page size, verify that the vertical scroll bar appears and the complete content is accessible by scrolling the bar
  5. The content in a grid fits the grid panel width
  6. The grid must fit into the panel’s horizontal width when the panel is resized. This way the horizontal scroll bar must not appear
  7. All the form field labels appear on the left hand side
  8. Every button has an icon associated
  9. Mandatory fields on the Windows/Tabs are marked

10. All the fields are validated for the following:

  1. Length of input (the API document must specify the minimum/maximum length limit if there is such constraint on a field value. E.g. if the customer name cannot exceed 45 characters, then it must be specified in the API doc and must be taken care of in the UI field validation)
  2. User mask (alphabets/alpha-numeric/numbers/etc.)

11. When a page is shown, the initial focus must be on the first editable field

12. See that the From date is populated, by default, with today’s date, wherever appropriate

13. At the bottom of the grid, the following message must appear – “Showing X of Y matches”

14. A grid must occupy the available vertical space

15. Tool tip is described correctly and is enabled

16. Window/Tab/Fields level security roles are applied

17. There must be appropriate Comment/Help defined for the following:

  1. Window
  2. Tab
  3. Fields

18. Screens/Processes/Reports are grouped logically under appropriate menu item

19. Every document kind of Window (e.g. PO, SO, Quotation, Invoice, etc.) must have the tool button to send the document as E-mail attachment to an external contact

20. Chat tool button must be available on every Window based on the role

While this is a nice little guideline, if you think you have any suggestion – please feel free to provide your feedback. Walking Tree is a leading provider of Adempiere implementation, customization and training services in India as well as across the world.

Tagged with: , , , , , ,
Posted in ADempiere

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

We Have Moved Our Blog!

We have moved our blog to our company site. Check out for all latest blogs.

Sencha Select Partner Sencha Training Partner
Xamarin Authorized Partner
Recent Publication
%d bloggers like this: