Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Section
Column
width50%
Panel
borderColor#CCC
bgColor#FFF

Problem Statement: It is cumbersome for the user to have to go to another page or enter an edit mode to make small changes.  Data thus edited tends to be brief, in keeping with the desire for rapid, small changes.  A successful solution allows the user to edit information with constrained choices within the context of their work rather than going to another page or an edit mode. 

Design Goals:

  • Discoverable by user without being a distraction from getting their work done
  • Quick and easy edit within the context of user's work
  • Clear indication of current selection
  • Clear feedback that change(s) has been saved
  • Right sized click target so it doesn't require precise mouse movement
Panel
borderColor#CCC
bgColor#FFF

Catalina, Christyand Ashley are the primary personas for Fluid Components.  They represent the primary target for the design of Fluid components.  Additionally, we have defined secondary personas whose needs are mostly met by fullfilling primary's except for one or two needs specific additional needs.
Fluid Personas are a collection of various types of important users whose needs we need to consider throughout the design process.

Panel
borderColor#CCC
bgColor#FFF

Contexts of Use: In what contexts would the user need a Dropdown Inline Edit? What activities do they undertake in the contexts?

Functional Requirements: What use cases does the Dropdown Inline Edit component support?)

Primary & Secondary Scenarios: In context, what are the primary and secondary user needs are we meeting?

Column
width50%
Panel
borderColor#CCC
bgColor#FFF

Wireframes (see storyboard): Visual representation of design iterations and final designs.

Storyboard: How, when, and where would the user use Dropdown Inline Edit?

Design Pattern: Design advice for allowing users to edit content in the context of their work.

Panel
borderColor#CCC
bgColor#FFF

Dropdown Inline Edit User Testing: Summary of all user testing performed on the Dropdown Inline Edit component.

User Testing Protocols: Describes how the user testing of Dropdown Inline Edit will be carried out.

User Testing Results: Describes how the users interacted with the Dropdown Inline Edit prototype and what improvements can be made.

Panel
borderColor#CCC
bgColor#FFF

Storycards: Decomposes Dropdown Inline Edit into small implementable chunks
.
Functional Specification: Interaction details such as "interesting moments."