hoangsonww / hoangsonww/Task-Manager-ReactNative

Feature: Establish an end-to-end accessibility system across core workflows

Open
#14 0 comments 0 reactions 1 assignee Claimed by @hoangsonww View on GitHub
accessibility bug documentation enhancement good first issue help wanted question
Dominant language
TypeScript
Stars
32
Forks
8
PR merge metrics
No merged PRs in 30d

Description

## Summary

Make TaskNexus's authentication, task management, navigation, modals, drag ordering, and statistics usable with assistive technologies and user accessibility preferences.

## Problem / Opportunity

The app combines custom navigation, gesture-driven reordering, animated transitions, icon actions, modal forms, color-coded tasks, and visual charts. Without a coordinated accessibility contract, fixes made component by component can still leave users unable to understand state, move focus, reorder tasks, or consume statistics.

## Proposed Feature

Create and implement a cross-platform accessibility baseline covering semantic roles/names/states, focus management, large text, contrast, non-color cues, reduced motion, keyboard operation, alternative reordering, and accessible chart summaries. Add automated checks where practical and a repeatable manual test matrix.

## Scope

- Audit sign-in/register, Home, Stats, TaskItem, add/edit modals, CustomTabBar, and theme switching.
- Define accessible names, roles, states, hints, announcements, and focus order for interactive controls.
- Add non-gesture task reordering and non-visual chart equivalents.
- Respect font scaling and reduced-motion settings without clipping or loss of functionality.
- Validate light/dark contrast and eliminate color-only status communication.
- Document supported assistive technology/platform combinations and testing steps.

## Acceptance Criteria

- [ ] Every interactive control in core workflows has an accurate accessible name, role, state, and touch target.
- [ ] Screen-reader focus enters, moves within, and returns from add/edit dialogs predictably.
- [ ] Task completion, deletion, validation errors, loading, and realtime changes are announced appropriately without excessive noise.
- [ ] Tasks can be reordered without drag-and-drop, using keyboard and assistive controls where supported.
- [ ] Core screens remain usable at the platform's largest supported text settings without clipped actions or hidden content.
- [ ] Motion-heavy transitions honor reduced-motion preferences and preserve context.
- [ ] Status and chart meaning never depend on color alone; Stats exposes equivalent textual/tabular summaries.
- [ ] Light and dark themes meet the documented contrast target for essential text and controls.
- [ ] Automated component tests assert critical semantics, while a manual VoiceOver/TalkBack/keyboard matrix is checked in CI/release documentation.
- [ ] An accessibility statement documents known limitations and a regression-reporting path.

## Non-Goals

- Certification against every assistive technology combination.
- A visual redesign unrelated to access barriers.
- Translating the interface into additional languages.

## Dependencies / Risks

- React Native accessibility behavior differs across native platforms and web.
- Third-party chart, draggable-list, and modal components may require wrappers or replacement.
- Aggressive realtime announcements can overwhelm screen-reader users.

## Open Questions

- Which WCAG conformance target and platform versions should define release acceptance?
- Should accessible reordering use explicit Move Up/Down actions or a dedicated ordering mode?
- Which chart representation is clearest as the default non-visual alternative?

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.