A voice-control grid must not hide the content it is meant to target
Aliases: show grid · grid occlusion · voice overlay
What it is
When a name will not uniquely select, an icon has no word, or the target is a point on a canvas, voice users open a grid overlay and drill in with “3, then 5.” The grid is a pointing tool. The content under it still has to be visible: which thumbnail, which map pin, which stretch of a playhead. Opaque cells, fat lines, numbers painted over the picture, and the user is commanding a region they cannot judge.
Why it happens
The grid quantizes continuous coordinates into speakable indices. Each drill-in shrinks the cell and the pixels it covers. If that layer’s paint already hides the pixels needed to decide—cover art differences, a peak on a waveform, a piece on a board—the user guesses from memory. The grid stops being visual support and becomes blind selection. Full-screen dimmers, heavy fills, and content drawn into a layer the grid also covers make the clash worse.
Selectability here is not “can the grid click.” It is “can the person tell which cell to click.” Reachable but unseen fails the task as surely as unreachable.
Studying it
Turn on the platform voice grid. Run tasks that need visual judgment: the right image, a named pin, a named span on a video timeline. Record whether people must kill the grid to see, and whether they then miss without it.
Independent variables: stroke width and opacity, number size, the UI’s own contrast and any full-screen veil. Dependent variables: correct-cell rate with the grid on, times the grid is dismissed, rate of switching channels after dismissal.
Grid chrome differs by platform; name the platform. An app cannot restyle the system grid, but it can change the layer the grid still buries.
Where it stops holding
Large high-contrast targets bigger than a cell suffer little. Reading a long paragraph then hitting a link, the grid may hide the words and still count as occlusion. Do not mix “number badges covering button text” with grid-over-content: numbers are disambiguation tags; the grid is a coordinate ruler. If an in-app grid is more opaque than the system one, score the worse layer.
Applying it
- Do not add an opaque coach or ad on a full-screen flow where voice users will show the grid. Content must remain discriminable between the lines.
- Where judgment depends on fine texture (waveform, map, thumbnail wall), offer a named path that does not need the grid: a title for the image, a numeric time.
- Verify: show the grid and complete “hit that specific image / that pin.” If the grid must be dismissed before the target can be recognized, the overlay already blocks judgment.
Related
- Same group: J3.12.1 Voice-selectable controls need an accessible name that matches the visible label · J3.12.2 Icon-only buttons cannot be reached with a natural spoken command · J3.12.3 Duplicate on-screen names need numbers so voice can disambiguate
- Nearby: J5.04 Voice Control · J3.04 Target Size Minimum
- Search terms:
show grid·voice control overlay·occlusion