The user needs to browse content of varying types and length
A collection of 54 User Interface design patterns, presented in a manner easily referenced and used as a brainstorming tool.Get your deck!
Display entry points to detailed and varied content in similar shapes. A card could contain a photo, text, and a link about a single subject.
Consider only scrolling collections of cards in one direction: horizontally or vertically. Card content that exceeds the maximum card height (if scrolling vertically) or width (if scrolling horizontally) is truncated and does not scroll, but can be expanded. Once expanded, a card may exceed the maximum height/width of the view.
One of the most important things about cards, is their ability to be manipulated almost infinitely. They can be turned over to reveal more, stacked to save space, folded for a summary – and expanded for more details, sorted, and grouped.
We can hint what is on the back side or that the card can be folded out. The resemblance of Cards to the physical world makes them a great conceptual metaphor for which we can easily relate all sorts of manipulations.
Cards are great for showcasing aggregated elements whose size or supported actions vary. Each card serves as an entry point to more detailed information, so it shouldn’t be overloaded with extraneous information or actions. They are dismissible, swipeable, sortable, and filterable.
Cards come with several advantages: