Option Menu Dialog UI Specifications
Author: Josef Pavlicek, updated by Ondrej Langr
$Revision: 1.32 $
$Date: 2008/05/21 09:24:56 $
$Id: index.html,v 1.32 2008/05/21 09:24:56 ondrej Exp $ (see full CVS history)
Content:
- Editor settings
- File Recognition
- GUI Builder options redesign
- Profiler
- Ruby
- ToDo Tasks
- SVG Settings
- Versioning
- Visual Web
Summary:
This page is guidepost for UI Specifications which describes the new Option Dialogs placed in the NetBeans Tools | Options.
Option Menu Settings UI redesign
New design of Option dialogue
It's almost the standard to have main option categories placed on the top of Option dialogue.
Figure 1: Redesign of current Option dialogue
Figure 1: describes redesign of the Option dialogue. The general option layer is placed on the top of the Option menu dialogue.
NOTICE: If the Advanced Options button will be visible (it's only in the case if some module needs old advanced options settings) the button does'n have Mnemonic. The user can open it by TAB key.
Figure 1.1: General settings design - example
Description of figure 1.1: If the user needs to change Browser Executable settings, he/she uses "Edit..." button. The system shows Browser Executalbe Settings dialog (Figure 1.1.2).
Navigation:
- Navigation between main categories- General, Editor etc...is realized by pointers key - <- Left, Right ->.
- To move from main category to sub-category [Miscellaneous -ANT] is realized by [TAB] key.
- To move between tabs is realized by pointers key too.
- If the user wants to return to the main category, he/she uses TAB+SHIFT.
Mnemonics designed for figure 1.1:
- W - Web Browser,
- E - Edit [Button],
- N - No Proxy,
- U - Use System Proxy Settings,
- M - Manual Proxy Settings,
- P - HTTP Proxy Settings,
- R - Port,
- O- More [Button],
- H - Help [Button].
Figure 1.1.2: Browser Executable settings dialog
Mnemonics designed for figure 1.1.2:
- A - Add [Button],
- B - Web Browsers,
- E - Executable,
- N - Name,
- P - Parameters
- R - Remove[Button] ,
- W - Browse [Button].
Miscellaneous redesign
Figure 1.2: Miscellaneous redesign
Panels Spacing - NOTE
PLEASE NOTE THESE RULES!
- The inset between components or panels we are setting between the biggest component (for more information click here)in the row or column via defined roles.
- The labels and smaller components have to be centralized by the down label line in the highest component in the row.
| Rules | Windows XP/Classic |
|
|---|---|---|
| 1. | Between related components (e.g. between check boxes, radio buttons, text fields, text field and button, combo boxes, buttons, text area/list and its note - note is situated below text area or list, etc.) | 6 px |
| 2. | Between unrelated components (e.g. text fields, combo boxes, groups of radio buttons, groups of check boxes, etc.) leave at least | 11 px |
| 3. | Between text labels and their associated components (text field and its label, combo box and its label, group of radio buttons and its label (it is valid for vertical as well as horizontal direction - same is valid for group of check boxes and its label), text area/list and its label, etc.) | 5 px |
| 4. | Between toggle buttons, between toggle buttons and separator and between toggle buttons and toolbar (valid for both directions - vertical and horizontal) | 3 px |
| 5. | Between separator and components | 11 px |
| 6. | Between command buttons (OK, Cancel, Help button) and last component | 17 px |
| 7. | Tabbed pane - maintain a consistent margin from | 11 px |
| 8. | Dialog - maintain a consistent margin from | 11 px |
Left Space Example:
Right Space Example:
Top and Lower Space Example:
Description of Top and Lower Space Example:
- 17 pixs is space between panel buttons and bottom of the panel edge,
- 11 pixs is is space between panel buttons and bottom op the Option Dialog edge,
- 6 pixels is between buttons.
List of redesigned panels
NOTICE: All panels placed in the Miscellaneous category (they are inside the Miscellaneous frame) are resizable if the user drags the edge of Miscellaneous frame.
Ant settings:
Figure 2.1: Ant Settings redesign
Description of figure 2.1:
Figure 2.1 shows new redesign of ANT panel in Miscellaneous. Main changes are Classpath and Properties settings accessible directly from Ant panel.
Mnemonics designed for figure 2.1:
- A - Ant Home,
- C - Classpath,
- D -Move Down [Button],
- E - Default [Button],
- H - Help [Button],
- J - Add JAR/ZIPP [Button],
- M - Move Up [Button],
- O - Always Show Output,
- P - Properties,
- R- Remove [Button],
- S - Save All Modified Files Before Running Ant,
- T - Reuse Output Tabs from Finished Processes,
- V -Verbosity Level,
- W-Browse [Button],
- Y - Add Directory [Button].
Diff Settings redesign
Figure 2.2: Diff settings redesign
Mnemonics designed for figure 2.2:
- C - Command,
- E - External Diff,
- H - Help [Button],
- I - Internal Diff,
- N - Ignore Whitespacess,
- W-Browse [Button].
Editor Settings
Editor settings will be removed into Editor Panel.
File Recognition redesign
This section has been removed as it become obsolete. New specification is available here.
GUI Builder options redesign
Figure 2.4: Gui Builder option settings redesign
Mnemonics designed for figure 2.4:
- A - Automatic Resource Management /I18,
- F - Fields in the Form Class,
- G - Listener Generation Style,
- H - Help [Button],
- L - Local Variables in initComponents() Method,
- O - Fold Generation Code,
- S - Show Assistant in Designer ,
- U - Use Indentation Engine,
- V - Variables Modifier,
- Y - Layout Generation Style.
Profiler settings redesign
Profiler settings will be removed from the main Option menu into the Profiler tab in Miscellaneous
Ruby settings redesign
Figure 2.5: Ruby settings (current Install and Debugger) will be joined together into the tab Ruby
Mnemonics designed for figure 2.5:
- C - Classic Debugger,
- F - Fast Debugger (ruby–debug–ide),
- H - Help [Button],
- I - Install Fast Debugger [Button],
- R - Ruby Interpreter,
- V - Verbose Output,
- W - Browse [Button].
SVG Settings redesign
Figure 2.6: SVG option settings redesign
Mnemonics designed for figure 2.6:
- E - External Editor Path,
- H - Help [Button],
- W - Browse [Button].
ToDo Tasks List settings redesign
Figure 2.7: ToDo Tasks List Settings redesign
Mnemonics designed for figure 2.7:
- A - Add [Button],
- D - Delete [Button],
- E - Edit [Button],
- H - Help [Button],
- S - Show ToDos from Comments Only,
- T - ToDo Patterns.
Versioning settings redesign
Versioning settings tab will be joined by Versioning Systems:
- CVS
- Subversion
- Local History
settings.
List of "Versioning Systems" will be realized by list component on the left side of Miscellaneous panel.
Figure 2.8.1: CVS settings redesign
Mnemonics designed for figure 2.8.1:
- A - Apply “Exclude From Commit“ On New Files Automatically,
- D - Add Variable [Button],
- H - Help [Button],
- S - Status Label Format,
- V - Versioning System,
- W - Wrap Commit Messages To (characters).
Figure 2.8.2: Subversion settings redesign
Mnemonics designed for figure 2.8.2:
- A - Add Variable [Button],
- D - Define {folder} [Button],
- F - Format,
- H - Help [Button],
- M - Manage Connection Settings [Button],
- S - Specify the SVN Home Folder,
- V - Versioning System,
- W - Browse [Button].
Figure 2.8.3: Local History settings redesign
Mnemonics designed for figure 2.8.3:
- H - Help [Button],
- K - Keep Local History Files for [] Days,
- V - Versioning System.
Visual Web
Figure 2.9 Visual Web Designer redesign
Mnemonics designed for figure 2.9:
- C - Create RowSets in Session,
- D - Default Font Size,
- E - Check for Duplicate RowSets,
- G - Grid Height,
- H - Help [Button],
- N - Snap To Grid,
- P - Prompt for Data Source Name,
- S - Show Grid,
- T - Target Browser Window,
- U - Suffix for Data Providers,
- W - Grid Width,
- X -Suffix for RowSets.
List of Miscellaneous settings
If we remove the Advanced Options (cleaning and redesign them) we have new settings into the Miscellaneous.
- The list of settings placed in the Miscellaneous has to be reordered by Alphabet (A - start),
- The Miscellaneous shows Advance option button if some third party module will be installed in the NetBeans IDE. This function will be saved for backward compatibility too.
List of Miscellaneous:
- Ant
- Diff
- GUI Designer
- File Recognition
- Profiler
- Ruby
- SVG
- ToDo Tasks
- Versioning
- Visual Web
Figure 3: Miscellaneous list
Will be removed
Core settings
Figure 4.1: Core Settings will be removed from the Advanced Option
Figure 4.1 description:
The Core Settings will be removed from Advanced Options and will not be moved to Miscellaneous.
Annotation Types settings
Figure 4.2: Annotation types will be removed
Figure 4.2 description:
The Annotation types are placed in the Font & Color -> Annotations now. From Advanced dialogue will be removed.
Indentation Engines settings
Figure 4.3: Indentation Engines will be removed
Look and Feel settings
Figure 4.4: Look and Feel will be removed
Diff and Merge Types settings
Figure 4.5: Diff and Merge Types will be removed and placed it the Miscellaneous
Web Browsers
Figure 4.6.1: Web Browsers will be removed and placed into the General category (Figure 4.6.2).
Figure 4.6.2: Web Browser settings will be added to General panel
Database Explorer
Figure 4.7: Database Explorer will be removed
PDF viewer settings
Figure 4.8: PDF viewer settings will be removed
HTTP Server settings
HTTP Server settings will be removed.
J2EE Servers settings
J2EE Server settings should be move to Runtime-> Services -> Server Properties settings.
Internationalization
Internationalization settings will be removed from NetBeans IDE.
Contact:
Ing. Josef Pavlicek, Ph.D.
Human Interface Designer
Software eXperience Design
Sun Microsystems Czech s.r.o
Phone:+420 233 009 442
GSM: +420 737 38 54 75
E-mail: Josef.Pavlicek@Sun.Com
