Understanding the Need for a Fluid User Interface

A traditional, or classic, PeopleSoft application displayed in a browser assumes the screen size of the device running the application is of a standard, relatively predictable size, such as a browser running on a desktop or laptop computer. The classic PeopleSoft application will run on a mobile device, such as a tablet or cell phone, but it is not tailored or optimized for the mobile device.

With the traditional PeopleSoft application, the interface display is defined in Application Designer using a fixed layout, based on and bound to a pixel system. In the fixed layout, a developer can meticulously align fields, labels, group boxes, and so on, and be reasonably assured the page will appear in the browser running on a desktop or laptop just as it appears in the design-time layout. The traditional PeopleSoft application development design-time layout provides a WYSIWYG (what you see is what you get) scenario.

However, the fixed layout does not adapt -- expand or contract-- based on the device or the size of the screen on which it renders. A classic PeopleSoft application does not display dynamically. While an end user can access and use a traditional PeopleSoft application with a cellular phone, for example, most likely the user will need to shrink or expand the display in order to interact with the fields, with maybe only a small percentage of the page being visible at a time, losing the context of the information on the page.

With the emergence and popularity of mobile devices, namely tablets and smart cellular phones, PeopleSoft applications need to display and run on a wide range of mobile devices. For example, a small, light-weight self-service application must be equally usable on a browser running on a desktop, laptop, iPhone, Android, iPad, and so on.

To address this business demand, PeopleTools enables you to develop and customize components and pages for a fluid display when running on supported mobile devices. PeopleSoft applications that have been developed and enabled for fluid display will appear dynamically, depending on the device and screen size used for access, all based on a single page layout definition. That is, you create a single page definition, using the flexible fluid design approach, and it will display as needed on all the different supported devices, be it an Andriod phone or iPhone or tablet.

Terms used to describe similar design approaches in the industry include, fluid design, responsive design, relative layout, and elastic layout, to name a few. For PeopleTools, we refer to this approach as fluid, as in fluid design, fluid applications, fluid mode and so on. Regardless of the term used, the goal remains the same, which is to enable organizations to deploy applications to all the devices being used to conduct business such that the content of the PeopleSoft page resizes and adapts to the size of the browser window of the device