Oracle Usable Apps | Applications User Experience Simplicity, mobility, extensibility
   
 
Customer Role: How User Experience Research Is Conducted
 
Designing Dashboard Elements
   
   
 
 
Page Layouts
Print this Page
 
Screen Resolution and Scrolling Return to Top

General

Design dashboard pages with these characteristics in mind:

  • Horizontal scrolling should not be required when a browser is set to full screen mode on a 1024 x 768 screen
  • Vertical scrolling beyond the first page should not be required when a browser is set to full screen mode on a 1024 x 768 screen
  • A prompts section should appear at the top of each dashboard page, whenever possible
Page Layout Best Practices Return to Top

To optimize dashboard layout, use the Columns Section setup option in the Dashboard editor. The numbers of columns and sections, as well as the formatting setup options, determine how results appear on the page. The following examples illustrate good and bad examples of page layouts.

For details, see section "Additional Formatting Options."

Organizing Four Objects (Reports) Plus Prompts Ribbon Spread in 2x2

 

Organizing Three, Four, Five, and Six Objects Plus Prompts Ribbon in Two Sections

Detailed Setup Examples

Return to Top

Example A: Prompts Ribbon Plus Four Objects Spread in 2x2

Example B: Prompts Ribbon Plus Six Objects Spread in 2x2


Example C: Prompts Ribbon Plus Three Objects Spread in 2x2

Reports Objects Spread Unevenly Across Screen Plus Prompt Ribbon

Return to Top

Detailed Setup Examples

Return to Top

Example D: Three Objects Uneven Plus Prompts Ribbon: Three Columns Plus Three Sections


Example E: Four Objects Uneven Plus Prompts Ribbon: Three Columns Plus Three Sections


Example F: Four Objects Uneven Plus Prompts Ribbon: Three Columns Plus Three Sections


Example G: Five Objects Uneven Plus Prompts Ribbon: Three Columns Plus Four Sections

Formatting Options for Columns and Sections Return to Top

Columns Formatting

All columns should have the following values in their formatting setup

  • Borders: None
  • Vertical Align: Top
  • Additional Formatting Options: 0
Express Width Value As a Percentage According to Planned Layout

To prevent the layout from skewing when it is viewed with a different screen resolution, specify the percentage width for the columns.

You must specify percentage widths of the columns according to the number of columns that you have in your layout. That is, for a layout with one column, specify a width of 100%. For a layout with two columns, specify a width of 50%-50%. And for a layout with three columns, specify a width of 33%-34%-33%. Leave all other column properties options to Default or Empty.

All other setups set to Default or Empty

Section formatting

All sections should have following values in their formatting setup:
  • Borders: None
  • Vertical Align: Top (unless specifically required to be different for layout reasons) 
  • All other formatting setups: Default or empty
  • Additional Formatting Options: 0
  • Collapsible option: Clear

Section Names: Rename All Sections According to Their Purposes

To rename a section, click the Rename button next to the Properties button

 
 
Oracle.com  |  About Oracle  |  Careers  |  Contact Us  |  Legal Notices  |  Terms of Use  |  Your Privacy Rights