• Uniform UI Metaphors

last modified March 23, 2009 by ejucovy

The purpose of this page is to track identified UI patterns that are (or should be) consistent across OpenCore's functionality.  The exact implementation of a given pattern is not so important here; the important thing is to identify and map out where these patterns appear so that we can deal with them in a consistent and uniform way.

  • Contextual help: a consistent and easily recognizable cue for a user (like a questionmark icon) to get contextual help, perhaps causing a lightbox to open up with the contextual help.  This was originally proposed by Mouna in her TaskTracker wireframes: see for example http://www.openplans.org/projects/opencore/copy_of_list01_B.gif  (note the ?s)
  • Tabular data: many pieces of OpenCore present some tabular data: task lists, project contents, manage-team, etc.  (Also very similar is Trac's ticket list.) These should all be presented in a uniform way with common design and interaction patterns; Mouna and Jackie wanted these to be modelled after Excel spreadsheets to provide a familiar and easy-to-use management interface for people who are accustomed to exchanging and editing data through spreadsheets.  Common elements may include: resort by any column; resort columns by dragging; in-place editable fields.
  • Search results/search widget: Read-only listing of a non-fixed list of contents.  Common elements may include an "order by" widget, a way for users to select how many results they receive per page, a pagination widget, etc.  This shares a lot of UI elements with a search widget.  /people/searchresults, /sitesearch, /projects/myproject/team, and the mailing list archive search all share elements here.
  • Member search widget: see http://trac.openplans.org/openplans/ticket/499#comment:2
  • Contact someone: a consistent and easily recognizable cue for a user (like an envelope icon) that he can perform an action to contact another user (inviting people to a project, for example) with or without customizing the message to be sent.  Maybe clicking the icon causes a form-in-a-lightbox to open up with the default message, allowing the user to customize the message and then send it without leaving the current page.
  • Editable text: there are a bunch of places where users can edit text (wiki edit, making a blog post, posting to a mailing list through the web, customizing messages to other users..).  We should figure out what all of these places are, what users will need to do for each, whether to use Xinha/straight text areas/something else, what configuration of Xinha makes sense, etc. 
  • Buttons with dropdown menus: currently we only have the personal menu in the topnav (myname: profile - account - project list) and the "explore" menu (openplans: home - people - projects - start a project).  I think there's room for a few more; actually, I think just about every button in the topnav could have a submenu.  e.g. subtopnav in projects: "team: view - manage".  "wiki" could have "view - search - contents" etc.