Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Wiki Markup
h1. User Interface Design: Wireframes

Below are super simple starting patterns and mockups that can be used to start new mockups. These are not optimized, but provide starting points for notation and scribing UI requirements.

* Sample Design Patterns:
** {link-window:http://www.mockupstogo.net|scrollbars=true|menubar=true|location=true|statusbar=true|resizable=true|width=800|height=600|icon=false}[http://www.mockupstogo.net]{link-window}
* Below require [Balsamiq |OLE:User Interface Design Templates]for use in prototyping mockups.

h2. OLE Wireframes for download

| !Blank-OLE.png|thumbnail,border=1! [^BlankOLE Wireframe Templates^Blank-OLE.bmml] | !eDoc-OLE.png|thumbnail,border=1!<div class=!{anchor:edoc} [^eDocOLE Wireframe Templates^eDoc-OLE.bmml]\|\!Blank_LeftMenu-OLE.png\|thumbnail,border=1! [^Blank" style="border: 1px solid black" /> [OLE Wireframe Templates^Blank_LeftMenu-OLE.bmml] | !KNS_Search-OLE.png|thumbnail,border=1! [^KNSOLE Wireframe Templates^KNS_Search-OLE.bmml] |
| !FederatedSearch-OLE.png|thumbnail,border=1! [^FederatedSearchOLE Wireframe Templates^FederatedSearch-OLE.bmml] | !FederatedSearch_Results-OLE.png|thumbnail,border=1! [^FederatedSearchOLE Wireframe Templates^FederatedSearch_Results-OLE.bmml] | !OLE-wireframe symbols.png|thumbnail,border=1! [^OLEOLE Wireframe Templates^OLE-wireframe symbols.bmml] | !Maintenance Doc-OLE.png|thumbnail,border=1! [^MaintenanceOLE Wireframe Templates^Maintenance Doc-OLE.bmml] |

*Optional:* Download all of above examples in single zip file of [OLE Wireframes|^OLEOLE Wireframe Templates^OLE-wireframes.zip].

h2. OLE SAMPLES - using Balsamiq

h6. Example: OLE Ingest/Load Records

!uploadFileForNovember.png|border=1!
!processingRepor2t.png|border=1!

h6. Example: OLE Bib Editor&nbsp;

!wireframe-sample-Editor550.jpg|border=1!

h6. Example: Receiving Search Queue

!MockupOLEReceiveSearch-500.png|border=1!

*Additional Examples:* [Download OLE Mockups-Balsamiq/zip file|^OLEOLE Wireframe Templates^OLE_samples_balsamiq.zip] on above OLE past examples that can be used as additional templates for UX design and annotation.