Date Time Picker Design Overview
1. Problem
Problem Statement: There are a great variety of implementations for date and time selection. The lack of a consistent and effective interface increases the cognitive load of users interacting with these tools, and increases the probability of errors.
Problem Statement continued...
Top Design Goals:
- Allow users to enter dates and times:
- easily and efficiently
- without disrupting their workflow
- in the manner in which they are most comfortable (e.g. text entry or selecting a date from a calendar display)
Pain Points: Date Time Picker Pain Points
Use Cases: Date Time Picker Functional Requirements
Competitive Analysis: Date Time Picker Competitive Analysis
2. Users
Fluid Personas are a collection of various types of important users whose needs we need to consider throughout the design process.
3. Users' needs
Contexts of Use: In what contexts would the user need a Date or Time Picker? What activities do they undertake in these contexts?
Functional Requirements: What use cases does the Date Time Picker component support?
Primary & Secondary Scenarios: In context, what are the primary and secondary user needs are we meeting?
4. Solution
Wireframes: Visual representation of design iterations and final designs.
Storyboards: How, when, and where would the user use a Date Time Picker?
Current storyboards:
- Date Time Picker Storyboard - Date and Time Combined Field
- Date Time Picker Storyboard - Date and Time Separate Fields with Defaults
Deprecated storyboards, showing old versions of the Date & Time Pickers:
- Date Time Picker Storyboard - Selecting Opening Date and Time
- Date Time Picker Storyboard - Selecting Due Date and Time
- Date Time Picker Storyboard - Editing a selected date
- Date Time Picker Storyboard - Selecting Opening Date and Time - Tabbed Timepicker
Date Picker Design Pattern: Not yet available
5. User Testing
Date Time Picker User Testing: Summary of all user testing performed on the Date Time Picker component.
User Testing Protocols: Describes how the user testing of Date & Time Picker will be carried out.
- Date Time Picker Paper Prototype User Testing - Round 1 Protocol
- Date Time Picker Paper Prototype User Testing - Round 2 Protocol
- Date Time Picker User Testing - Round 3 Protocol
User Testing Results: Describes how the users interacted with the Date & Time Picker prototype and what improvements can be made.
6. Preparing for Implementation
Storycards: Decomposes the Date Picker, Time Picker and Date Time Picker into small implementable chunks.
Functional Specification: Development specification containing interaction details such as "interesting moments."