Versions Compared


  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: added goals and requirements

Table of Contents


The community agrees that the UI is a weak part of OFBiz. It cannot compete with modern user interfaces and makes it hard for web designers to make use of modern frameworks.

The UI improvement should serve some goals including:

  • new themes should be responsive
  • users/developers should be able to use different UI frameworks like Bootstrap and AngularJS which take care of responsiveness and browser compatibility
  • it must be easy for developers to write the screen structure and also easy for webdesigners to build a good design on base of this
  • developers should not care about CSS styles and classes, and webdesigners should not care about how the screen snippets are put together or how the screens get their data.


  • we will need a new approach to be able to "plug in" different UI frameworks.
  • We'll need a UI layer who represents the screen contents in an abstracted way (possbly an enhanced Freemarker macro library) and make it possible to generate HTML code with the right css attributes for the target library.
  • a rewrite of the screens will be necessary to make the UI less cluttered and overloaded. This will require some concepts/design work beforehand
  • ...


To improve the UI in OFBiz, we want make a proof of concept that link 4 main improvements.


You can follow the evolution through

serverASF JIRA

Remove theme stuff from the framework

The purpose is to have a common-theme component that contain all default templates, all library contain in the framework and used by themes.

Improve the structure of screen

The purpose is to build all screen linked to structure screen. Decorator must also build with a screen structure.

With this kind of structure, it will be easier to make any look and feel in a theme without modifying screen.

Create a new component "backoffice"

The purpose is to try to simplify OFBiz to be used by human ^^


When the component will be choose, we 'just' simplify the actual screen (using structure of course).

Create a new theme

It's important to create a new theme that use and play with structure, that maybe use the last technology we want to try.