Cards
The user wants to see an overview of the larger set of available content.
Problem
The user wants to see an overview of the larger set of available content.
Solution
Use cards to render a summary or highlight of the full content. The cards can contain photos, text and can link to the more expanded and detailed information.
Use cards to enclose multiple data types into one entity like images, text, audio and video.
Cards usually provide an overview of the greater dataset and serve as an entry point to more detailed content. Don't overload with too much information.
Use the swipe gesture to navigate cards laid out horizontally. When rendering multiple card collections, vertical scrolling should be used for finding the correct collection.
Cards can contain additional actions like shortcuts, and primary call to action. Try to limit these to a maximum of two while concentrating only on the most important tasks.
Use icon and text buttons and compact UI controls, like a rating slider for providing the necessary interactivity.
- Collection views
- Rating action
- Actions
- Variable content
View in full screen
Best places to seek silence
The Dhamma Giri, a vipassana meditation retreat.
Best animal adventures for families
A young panda tests his climbing skills at the Chengdu Research Base.
Best places to test your survival skills
A view across the Turnagain Arm on Alaska's Kenai Peninsula.
Most accessible destinations
The impressive Mayan site of Chichén Itzá..
The world’s most extraordinary sleepovers
Explore the azure depths with a stay at the Manta Resort's underwater room.
Best luxe experiences for budget travellers
Las Vegas lights up the night.
-
San Francisco
Sunny 68°MON
65°
41°TUE
60°
31°WED
80°
65°THU
76°
61°FRI
79°
60° -
15 minutes to Work
-
New Flash episode9:00 PM today
-
Mira Frank's Birthday today
-
Morning workoutTomorrow Morning
-
Best animal adventures for families
A young panda tests his climbing skills at the Chengdu Research Base.
Read more... -
George Lopez's Birthday today
-
Best places to test your survival skills
A view across the Turnagain Arm on Alaska's Kenai Peninsula.
Read more... -
Football8:00 PM tomorrow
-
The world’s most extraordinary sleepovers
Explore the azure depths with a stay at the Manta Resort's underwater room.
Read more...
Problem
The user wants to see an overview of the larger set of available content.
Solution
Use cards to render a summary or highlight of the full content. The cards can contain photos, text and can link to the more expanded and detailed information.
Use cards to enclose multiple data types into one entity like images, text, audio and video.
Cards usually provide an overview of the greater dataset and serve as an entry point to more detailed content. Don't overload with too much information.
Use the swipe gesture to navigate cards laid out horizontally. When rendering multiple card collections, vertical scrolling should be used for finding the correct collection.
Cards can contain additional actions like shortcuts, and primary call to action. Try to limit these to a maximum of two while concentrating only on the most important tasks.
Use icon and text buttons and compact UI controls, like a rating slider for providing the necessary interactivity.