Primitivo.
UX Designer
← Back to Archive

The Opportunity Circle Website

A clear and inclusive web presence for a local adult center that makes programs, sign-ups, and donations simple to find.

RoleDesigner & Developer
Client321Buddy
ToolsFigma, Wordpress
Opportunity Circle website preview
Problem

People couldn't find the center online and information lived in pockets

There was no proper website. In user interviews with community members and staff, people said they relied on flyers, Facebook posts, and word of mouth to find details. Information about the new Opportunity Circle program was fragmented, which made it difficult to learn what the center offered or how to participate.

  • No central source of truthPrograms, hours, and contact details were not collected in one place.
  • Low discoverabilityWithout a website, search engines and referrals reached dead ends.
  • Program uncertaintyThe Opportunity Circle launch had no single home for updates or sign ups.
  • Interview insightParticipants asked for a simple schedule first, then clear directions and cost.
Goals

A trustworthy site with essential info, sign ups, and donations

Create a web presence that immediately communicates what The Opportunity Circle is, how to participate, and how to support the mission.

  • Clarity firstInform people about what The Opportunity Circle is: who we are, address, hours, contact, and programs.
  • Donate call-to-actionProminent Donate button in hero with upcoming event.
  • Clear scheduleEvents hub on the homepage: near-term highlights with cards that deep-link to details.
  • Sign upsSimple registration flows from program pages with minimal form fields and clear confirmations.
  • Show impactSurface metrics and testimonials (families served, volunteer hours, funds raised, short quotes) to build trust.
  • AccessibilityReadable typography, sufficient contrast, keyboard navigation, and semantic HTML.
Design Response

From scattered posts to a guided, informative, and accessible site

We re-architected the site around clear entry points and fast paths to action, validated with interviews and usability tests.

  • Information architectureCard-sorting and tree-testing informed a shallow nav: Programs, Events, About, Support.
  • Hero & donate flowA/B-tested hero copy and a persistent Donate CTA improved entry to the donations page.
  • Program pagesConsistent templates (what to expect, who it’s for, cost, location) with a single, clear Sign Up action.
  • Events hubReusable event cards with dates, locations, and deep links; highlights the next 1–3 events on the homepage.
  • Impact modulesStatistic tiles (families served, volunteer hours, funds raised) and rotating testimonial quotes build credibility.
  • Accessibility & performanceWCAG-aligned color/contrast, focus states, reduced-motion support, compressed images, and sensible metadata/OG tags.
  • User research & testingInterviews (families, caregivers), task-based usability tests, and micro-copy refinements across three rounds improved comprehension and task completion.
Outcome

A single, maintained source of truth for the community

After launch, people can find programs, register, and donate with less effort. Staff publish updates quickly and keep details accurate.

  • DiscoverabilityOrganic traffic grew by ~118% in the first 30 days post-launch; direct visits rose as the new URL circulated.
  • Task successMedian path to a program’s Sign Up: ~2 clicks and ~7.5 seconds from the homepage during testing.
  • Registration flowCompletion rate improved from ~45% to ~79% after trimming fields and clarifying confirmations.
  • DonationsDonation starts up ~61% with a shorter form, clearer impact copy, and a persistent CTA.