Pickers

Pickers let people select a date, or a range of dates

Motion Functions

Cover

Didactic Function

Cover

Feedback Function

The function of motion in a picker is Didactic and Feedback. A picker allows for users to see the range they selected and how their selection is framed on a calendar. Feedback is provided by showcasing a range or selected date to the user.

Examples

Date Picker designed by ampersandrew
Date Picker designed by David Rodríguez Arias

In the above examples, the user selects a range of dates. The principle of value change is used to show the selection. Here the value is static and dates do not change so the user know they can make a selection within this range.

Page Tool: Momentum by Edoardo Mercati

Here the picker is being used to select one specific date. The value change here is dynamic and can help the user choose the exact date from a carousel of available dates. The carousel also has an added layer of dimensionality to it which helps it mimic the structure and functions of a real-world flippable carousel, helping ground the interface.

Last updated

Was this helpful?