Heartbeat Drum Machine

How it’s built

Layout

Close-up of a white instrument with red circular disc fills most of the frame; below it a white information strip has small monospaced-looking heading left and two narrow text columns right.

Type

Small black monospaced-looking uppercase heading and compact body columns.

Color and surface

White and gray instrument, red disc, black details.

Components

Wide close-up image above a sparse multi-column white information band.

What makes it work

• Pale close-up with red circular form
• white lower information band
• small monospaced-looking columns

Measured

Computed CSS at 1440px, 2026-10-24.

Live behavior

Today

The Heartbeat Drum Machine project page opens on a pale gray field with a large, detailed photograph of a white modular drum machine with red controls and looping cables. “CHD–4” and partner marks sit in the upper corners; below the image, the title reads “A DRUM MACHINE WITH CONGENITAL HEART DISEASE,” with explanatory text in narrow columns. At actual scrollY=750 the frame shows the project copy, “TRY IT” and “AUCTION” buttons, and a large product photograph continuing below. The tablet capture presents the same project imagery and copy in a narrower composition. The ordinary phone screenshot includes a security-verification message over its top dark section, with project title and text visible below; the fresh reduced-motion phone image is mostly black with a loading ring.

Responsive

At 1440×1000 the product photograph dominates the upper area and the title and two copy columns begin near the bottom. At 768×1024 the device image occupies the upper section and the title/copy row is visible below. At 390×844 the ordinary phone frame shows a dark security-verification panel above the project title and body copy, rather than the desktop product hero; the reduced-motion phone frame shows a dark loading screen. The saved phone states therefore do not provide a clean like-for-like responsive view of the desktop opening.

Scroll

At actual scrollY=750 the desktop frame shows the heading and two columns describing the CHD–4 project, dark “TRY IT” and red “AUCTION” buttons, and part of a large device photograph below. The capture shows the buttons but does not test their behavior.