Increasing access
Screen reader users cannot perceive curves drawn with bezier() or spline() because the accessibility system (textOutput() / gridOutput()) currently only describes basic shapes. This feature would make curve-based drawings more accessible to blind and low-vision users without requiring authors to manually describe every curve with describe().
Most appropriate sub-area of p5.js?
Feature request details
Description
The accessibility system (textOutput() / gridOutput()) provides screen reader descriptions for basic shapes (ellipse, rect, line, triangle, arc, quad, point) but does not support curves:
- bezier() / bezierVertex()
- spline() / splineVertex()
This means complex drawings using curves are invisible to screen reader users.
Expected behavior
When textOutput() or gridOutput() is enabled, bezier and spline curves should appear in the accessible output with:
- Shape type ("bezier curve", "spline curve")
- Color (stroke for unfilled, fill for filled)
- Approximate position (centroid of control points)
- Approximate area (bounding box or polygon approximation)
Current workaround:
Authors must manually use describe() / describeElement() for every curve.
Proposed implementation:
Follow the existing pattern in src/accessibility/outputs.js:
- Add bezier/spline cases to _getMiddle() — Compute the centroid by sampling 20 points along the curve using the same math as bezierPoint() / splinePoint() and averaging them.
- Add bezier/spline cases to _getArea() — Sample 20 points along the curve and use the shoelace formula to approximate the polygon area.
- Add bezier/spline handling in _accsOutput() — Use the fill color when filled, otherwise the stroke color, and include the computed area.
- Call this._accsOutput('bezier', args) / this._accsOutput('spline', args) from bezier() and spline() in src/shape/curves.js when accessibility is enabled.
- Add unit tests in test/unit/accessibility/outputs.js following the existing arc()/triangle() patterns.
Code references:
src/accessibility/outputs.js — _accsOutput() (~line 439), _getMiddle() (line 503), _getArea() (line 583)
src/shape/curves.js — bezier() (~line 188), spline() (~line 680)
test/unit/accessibility/outputs.js — follow arc()/triangle() test patterns
Increasing access
Screen reader users cannot perceive curves drawn with bezier() or spline() because the accessibility system (textOutput() / gridOutput()) currently only describes basic shapes. This feature would make curve-based drawings more accessible to blind and low-vision users without requiring authors to manually describe every curve with describe().
Most appropriate sub-area of p5.js?
Feature request details
Description
The accessibility system (textOutput() / gridOutput()) provides screen reader descriptions for basic shapes (ellipse, rect, line, triangle, arc, quad, point) but does not support curves:
This means complex drawings using curves are invisible to screen reader users.
Expected behavior
When textOutput() or gridOutput() is enabled, bezier and spline curves should appear in the accessible output with:
Current workaround:
Authors must manually use describe() / describeElement() for every curve.
Proposed implementation:
Follow the existing pattern in src/accessibility/outputs.js:
Code references:
src/accessibility/outputs.js— _accsOutput() (~line 439), _getMiddle() (line 503), _getArea() (line 583)src/shape/curves.js— bezier() (~line 188), spline() (~line 680)test/unit/accessibility/outputs.js— follow arc()/triangle() test patterns