Carousel
Components
A carousel is a slideshow component that displays content one slide at a time. Users can alternate content through manual navigation or waiting for automatic transition.
Checklist
Reset
Ways of interaction
Defining whether the carousel transitions are auto-play, navigated by controls, or both
Visual progress indicator
Show dots, numbers, or a progress bar so users know how many slides there are and which one they're currently viewing.
Make the current slide's indicator look noticeably different so people can track their position at a glance.
Dimensions and alignment
The size of the items in the carousel, and their responsiveness across devices.
Decide how content sits inside the item container so that it is filling the required space without being stretched or not looking uniform.
Animation behaviour
The direction, speed and feeling of how the items transition between each other.
Focused item state
if your carousel shows one item a time, the one on focus should appear different to the items that are entering and exiting
Size, transparency and colour are typical properties to change on the non-focused items to allow the focused have more attention naturally
