Coverflow 44 block design & features
Coverflow44 is a twin drum carousel built with shadcn/ui and motion, shown here as the people of an independent creative studio. There is no heading. On the left, seven studio and fashion portraits sit on the face of a cylinder turned on its horizontal axis, with a clear gap between them. On the right, the same seven names are set large on a second cylinder of type, and a tiny counter sits level with the facing name. Both drums sit straight on the page background and fade into it at the top and bottom.
The two drums are driven by one position value but turn in opposite directions, so as the portraits roll up the names roll down, and the facing photo and its name always meet on the same line. The facing name is set solid while its neighbours dim and tilt away. Dragging either drum vertically turns both with inertia and snaps to the nearest person, each wheel gesture over either drum turns one step, the arrow keys, Home and End work on the name list, and clicking a name or a neighbouring photo turns the short way round. On touch screens the drums take a sideways swipe so the page keeps its vertical scroll, and on small screens they stack with the type drum cut down to a three row window.
It suits studios, agencies, galleries and creative teams that want to introduce people or projects with very little text. It needs a photo and a one or two word name for each item, plus a label for the carousel. The names form an accessible listbox with a selected option.