Companion app
If your product has a companion app, this section puts it in the story. A phone mockup renders a live telemetry interface — battery, connection, ANC state — and a row of EQ presets that respond to clicks.
Companion app section with interactive device mockup
Settings
Copy
Store buttons
Device readout
ANC readout
The Point block
Each Point block is a feature bullet with an icon and text — one per capability of your app.What actually moves
Nothing here is a static image. The mockup is alive.The preset row is genuinely interactive. A shopper can click Bass Boost and watch
the meter reshape. It costs almost nothing in performance and it makes the section
feel like a product rather than a picture of a product.
Mobile behaviour
Below 1024px the device mockup is still rendered, but the drift and count-up animations are disabled along with the rest of the motion system. The presets remain clickable — they are CSS state changes, not animation.Best practice
Show the app, do not describe it
Show the app, do not describe it
The point of the mockup is to demonstrate the interface. Use a real screenshot
or a faithful render as the device screen, and let the telemetry readouts do the
persuading.
Only use this section if you have an app
Only use this section if you have an app
A companion app section on a product without an app is noise. Hide the section
entirely rather than filling it with placeholder copy.
Name your presets after real modes
Name your presets after real modes
“Bass Boost”, “Vocal Clarity”, “Deep Focus” — names that describe a listening
outcome, not an EQ frequency. This is a product, not a mixing desk.
Comparison table
The spec-by-spec argument.
Bento features
The flexible feature grid.
