Skip to content
+
Section 05

Experience Design

User research insights and the design system powering the new VOLY.

At geniant, we believe technology transformations fail or succeed based on experience — how people actually interact with the system day-to-day. A technically excellent platform that frustrates its users is a failed platform. This is why experience design is not a phase in our process; it is the lens through which every decision is made.

Design Principles for VOLY Next Gen

Volunteer-Centric Simplicity

Zero Learning Curve

Volunteers are not power users. They may interact with VOLY a few times a month. Every interaction must be intuitive enough that no training is required. We will design for the “zero learning curve” standard — if a volunteer needs instructions to complete a task, we've failed.

Agency Empowerment

Self-Service by Design

Agencies should feel like VOLY is their tool, not a tool they have to work around. Self-service capability, customizable branding, and clear workflows will reduce support burden while increasing agency satisfaction and retention.

Mobile-First, Not Mobile-Adapted

Designed for How People Actually Use It

We will design for mobile screens first and enhance for desktop — not the reverse. This ensures the volunteer experience is exceptional on the devices people actually use, with the check-in/out flow designed specifically for on-the-go, one-handed use.

Accessibility as a Baseline

WCAG 2.2 AA Minimum

WCAG 2.2 AA compliance is our minimum standard. Volunteer platforms serve diverse populations, and inclusivity is not optional. This includes screen reader compatibility, keyboard navigation, sufficient color contrast, 44px touch target sizing, and multilingual support architecture.

Data Storytelling

Stories, Not Just Numbers

Reports and dashboards will be designed to tell stories, not just display numbers. Every data visualization will answer a clear question: “How many hours did our volunteers contribute?” “Which opportunities need more volunteers?” “What is our community impact?”

Design Process

Our experience design process for VOLY Next Gen will include:

  • Stakeholder interviews with VolunteerNow staff, agency administrators, and volunteers
  • Journey mapping across all user types to identify friction points and opportunities
  • Wireframing and rapid prototyping with real user feedback loops
  • A component-based design system that ensures consistency and accelerates development
  • Usability testing with representative users before development begins on each major feature
  • Design documentation that serves as a shared reference between designers and developers

Accessibility & Internationalization

RFP Section 9: Web Accessibility Requirements

This section directly addresses the accessibility requirements specified in RFP Section 9. VOLY Next Gen will be built to meet and exceed WCAG 2.1 Level AA standards (we are targeting WCAG 2.2 AA for forward compatibility). Our comprehensive accessibility approach includes:

  • WAI-ARIA Component Library: We use Radix UI and Headless UI — component libraries purpose-built for accessibility — so complex patterns like modals, date pickers, menus, and data grids have correct ARIA roles, states, and properties without custom implementation. Accessible patterns are baked in by design choice, not retrofitted.
  • 44px Touch Targets: Every interactive element on mobile meets the WCAG 2.2 minimum of 44×44px. This is a design constraint, not an afterthought — it shapes how we size buttons, form inputs, and check-in/check-out controls from the first wireframe.
  • 4.5:1 Color Contrast: All text and interactive UI components meet or exceed 4.5:1 contrast ratio. This is enforced in the design system itself — component tokens for color pairs are pre-validated so developers can't accidentally introduce low-contrast combinations.
  • Semantic HTML & Heading Hierarchy: Every screen is structured with meaningful HTML elements and logical heading order, ensuring screen readers can navigate content without relying on visual layout cues.
  • Responsive Typography: Text scales across all device sizes without requiring horizontal scrolling. Line height, letter spacing, and word spacing are designed to support users with dyslexia or low vision.

Spanish Language Support

Many volunteers in the VolunteerNow ecosystem are Spanish-dominant speakers. We will implement robust multilingual support for both volunteer and agency interfaces:

  • React-Intl framework for runtime language switching without page reload
  • Complete Spanish translations of all volunteer-facing interfaces, email communications, and help documentation
  • Language preference saved to volunteer profile with default detection based on browser/device settings
  • RTL-ready architecture to support future language expansions (e.g., Arabic)
  • Professional translation review by native Spanish speakers familiar with nonprofit/volunteer context
  • Support structure to manage future language additions without code changes

Localization Beyond Translation

We understand that true multilingual support means more than string translation. Spanish labels for opportunities, culturally appropriate icons, and messaging that reflects community values are integral to the design — not afterthoughts.
+