Voice Message Player

Design a mobile chat bubble for a voice message. It sits inside a conversation thread and behaves like a message, not a standalone media player.

The bubble needs a clear play/pause control, a waveform or progress track, and a duration label. Playback state should be obvious without crowding the message list.

Treat the waveform as both a visual cue and a scrub target if you choose to support seeking. The control area has to work in one thumb, inside a dense chat layout.

Think through sent vs received styling, short vs long clips, and what the bubble looks like before, during, and after playback. It should feel native to messaging on mobile.

Make the progress state readable even when the waveform is tiny: use a strong contrast fill or active segment so the played portion is obvious at a glance.