Following please find proposed changes to the Process Documenter UI in response to our usability research results.
Note: These are rough mockups. The font, font size, pop-up size, button size, blue bar width and all other formatting should match the standard ProcessMaker Designer UI.
| Page | Current UI | Proposed UI | Changes |
|---|
| Process Documenter |  | | - Added blue bar to the top of page to be consistent with the Designer UI so users know this plugin is part of ProcessMaker
- Deleted settings icon bc it didn't work
- Deleted percentage bar bc users were confused
- Changed Review > Preview
- Reordered Designer and Preview so they are in the correct order
- Added Process Documenter in bold in the middle so the user knows where they are
- Changed buttons from white buttons to white text w/ light blue lines between the links - w/ blue background (links should look and function like Designer UI below)
- Added blue bar to Process Inspector to be consistent with the Designer UI and to differentiate as a heading
- Bold Key and Value titles to differentiate them from content below
|
| New Section Pop-up | | | - Changed current pop-up style to Designer pop-up UI to be consistent
- Added blue bar to top of pop-up with darker blue x to close window
- Capitalized New so pop-up title now reads 'Create a New Section'
- Changed white Cancel and Save buttons to a red Cancel button and green Save button
- Deleted Required (Count in %) since we are not currently using the progress bar
- Pop-up UI should match this pop-up
|
| Preview Page | | | - Added blue bar to the top of page to be consistent with the Designer UI so users know this plugin is part of ProcessMaker
- Changed 'Return to EasyDoc' button text to 'Process Documenter'
- Added Preview in bold so users who where they are
- Changed buttons from white buttons to white text w/ light blue lines between the links w/ blue background to be consistent with the Designer and Process Documenter UI
- When user scrolls over another button it becomes bold to signify that its clickable
|
0 Comments