Material design has no popovers, and I wonder what should be used as a replacement?
For example, how would you advise Product Hunt to replace their popover when they switch to material design?
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.Sign up to join this community
See this dropdown effect for an example of how the Material Design physics can work for a popover. A similar schematic is:
The opacity fade, triangular callout indicator, and growth origin (top or center) are all valid options.
Material Design guidelines don't specify popovers, but the specification of material properties provide a clear set of properties that can be used to create popups. The relevant material properties are:
So a popover sequence can be created with the following parameters:
The dropdown demo at the top is mostly compliant with this set of parameters.
It's possible the Material Design spec has changed since this question was asked more than a year ago.
Under the current spec, Product Hunt would need to replace their popover with a dialog. From the spec:
Dialogs inform users about a specific task and may contain critical information, require decisions, or involve multiple tasks.
Specifically the spec states that for list items (which is what Product Hunt would need to convert the content on this page to) you could use a simple dialog to provide details or actions about a list time from the spec:
Simple menus display options for list items, whereas simple dialogs can provide details or actions about a list item.