Date Time Input component
As part of the UX standardization process at Ciena, I am responsible for creating design patterns and UI components that can be used by other product teams. Date Time Input is one such generic component that addresses different scenarios in which a user would choose to input Date, Time or a combination of both. Below is an example/reference of such documentation and specification. The purpose of this entry is to illineate the process of creating a component and documenting it for the development.
A date/time input component is a collection of graphical user interface elements that should be used when users need to specify date, time or a combination of both in an application, as part of specific tasks. Example of such tasks include - creation of a new service or filtering on items listed in an object browser.
- 1. Date only
- 2. Time only
- 3. Date + Time
- 4. Range of Date + Time
3. Usage guideline
This component(s) should be used whenever a date, time or a combined input is required by the user to perform an action. For example filtering on an object browser, creating a new service or recording the performance data for a time period. Date and times should appear at the appropriate step of the process - according to the logical flow needed to complete the task.
Single time input inherits visual specs of the text input component. Recommended icon sizes is 25X25 px.