Matt, the first-timer
Explore a first volunteer opportunity
Browse complete opportunities before creating an account, then understand the schedule, expectations, and commitment.
Path: Browse opportunities
Pittsburgh Cares
Helping volunteers find their way into service.
I redesigned Pittsburgh Cares to make volunteer opportunities easier to find, understand, and act on. The result is a clearer path from interest to participation.
01 · Project overview
From uncertain interest to a clear next step.
Problem
Volunteers couldn't see what was available or what it involved, and group organizers couldn't tell whether a host had room for them before reaching out.
Approach
I audited the live site, held three contextual conversations, and designed the information architecture and interface. I tested the prototype with five participants, then retested the group flow with two.
Outcome
Three paths matched to what people came to do, with no account needed to browse. Group booking was the hardest task at 3.0/5; after three fixes, both retest participants rated it 5/5.
Initial ease ratings (average of 5)
- First-time volunteer
- 4.8/5
- Corporate organizer
- 3.0/5
- Returning volunteer
- 5.0/5
Group-booking retest after three fixes (n=2)
- Silas
- 4 to 5
- Sheila
- 2 to 5
02 · Understanding the problem
The original experience made opportunities difficult to reach.
Pittsburgh Cares connects people and organizations with volunteer opportunities across the region. As a designer based in Pittsburgh, I chose to examine how someone ready to help would find a suitable opportunity and understand what to do next.
I reviewed the live site as a new volunteer and as a group organizer: how opportunities were presented, where each path led, and what information was available before someone committed.
Original Pittsburgh Cares website
A rotating nine-slide carousel filled the first view
- 1The large rotating image area occupies the first view without showing current volunteer opportunities.
The route to browsing opportunities appears farther down the page; see the "Before click" image in the next pair.
Original Pittsburgh Cares website
Finding an opportunity sent volunteers to a different-looking portal
Before click
After click
Before click: the volunteer entry-point cards, including Find an opportunity, sit farther down the original homepage.
- 1After click: the destination changes to a separately branded Pittsburgh Cares Volunteer Portal.
- 2The destination header presents Sign up and Login controls alongside the calendar.
Carousels, images of text and missing filters blocked browsing
- User control and freedom: the nine-slide carousel moved important information before visitors could finish reading.
- Visibility of system status: browsing opportunities moved visitors to a differently branded domain without warning, where Sign up and Login controls appeared in the destination header.
- Accessibility (images of text): statistics, labels, and headings embedded in images could not be resized, selected, or read by assistive technology.
- Flexibility and efficiency of use: opportunities could not be filtered by date, cause, format, distance, or commitment.
Competitive audit
Competitors did discovery well; only one offered even partial group coordination
| Platform | Location / distance filter | Date / availability filter | In-person vs. virtual | Open capacity shown | What-to-expect details | Group coordination |
|---|---|---|---|---|---|---|
  | Yes | Not observed | Yes | Not observed | Not observed | Not observed |
 | Yes | Yes | Not observed | Not observed | Not observed | Not observed |
 | Not observed | Not observed | Not observed | Yes | Yes | Not observed |
 | Not observed | Yes | Not observed | Not observed | Not observed | Partial |
Four directions I took into the redesign:
- Distance and format filters (Idealist / VolunteerMatch)
- Date filtering (JustServe)
- Open spots and what-to-expect details before signup (Golden)
- A dedicated path for coordinating a group (Points of Light Engage)
03 · Defining the direction
Three audiences needed three different paths.
These proto-personas came from the audit and research above. They are working hypotheses, not validated user segments.
This redesign focuses on individual and group volunteers. Tools for nonprofit partners were out of scope, and older volunteers are represented by Emma, the recurring senior volunteer.
Brooke, the corporate team organizer
Coordinate a team event
Confirm that a host can support the group size, dates, logistics, and accessibility needs before sharing contact details.
Path: Plan a team day
Emma, the recurring senior volunteer
Return to an existing commitment
Reach upcoming shifts, reconfirm, check in, or cancel without repeating discovery and registration steps.
Path: My volunteering
Central design question
How might we design distinct paths through Pittsburgh Cares so each audience reaches what they need without friction meant for someone else?
Design priorities
- Show opportunities before asking for an account.
- Surface capacity, dates, accessibility, and expectations before commitment.
- Protect a fast lane for returning volunteers.
Primary journey · Proto-persona 1
Matt’s path showed where early interest broke down
Matt, our first-time volunteer, wanted a Saturday opportunity and enough information to decide whether it fit.
Original site
Original site: Feels the pull
Emotion: medium-high
Sees a post about a food drive and decides this is the weekend he finally does something.
Redesign direction: Meet intent immediately with real, dated opportunities on the landing page.
Original site
Original site: Hits the wall
Emotion: low
Selects the volunteer path and arrives at a separately branded portal with Sign up and Login controls alongside the opportunity calendar.
Redesign direction: Keep opportunity browsing within the main experience and show available shifts before presenting account actions.
Original site
Original site: Sizes it up
Emotion: medium-low
Finds one listing that looks plausible but can't tell what to wear, how physical it is, or who else will be there.
Redesign direction: A “What to expect” strip: dress code, activity level, group size, who you'll work alongside.
With the redesign
With the redesign: Commits
Emotion: medium-high
Gives name, email, and a time slot, then taps “Register as a guest”.
Redesign direction: Keep the ask lightweight: an RSVP, not an application.
With the redesign
With the redesign: Shows up
Emotion: high
Arrives Saturday morning, finds the check-in table, gets a task in under five minutes.
Redesign direction: Repeat the what-to-expect details in the confirmation so it's on his phone at the door.
With the redesign
With the redesign: Reflects
Emotion: high
Leaves feeling useful and open to a second shift.
Redesign direction: Offer one nearby next shift, not a newsletter subscription.
04 · Designing the experience
Three goals became three focused paths.
Each path matches how much structure the task needs.
What I found → what I changed
| Finding | Evidence (where it came from) | Design decision |
|---|---|---|
| Nine-slide rotating carousel filled the first view and moved content before people finished reading | Original homepage audit + heuristic review (User control and freedom) | Three intent-based path cards on the homepage, real dated opportunities up front |
| “Find an opportunity” sent volunteers to a separately branded Galaxy Digital portal with Sign up and Login in the header | Calendar handoff audit + heuristic review (Visibility of system status) | Browsing stays in the main experience, no account needed; guest registration (name, email, shift time) |
| Statistics, labels and headings were embedded in images | Heuristic review (Accessibility: images of text) | |
| No filtering by date, cause, format, distance or commitment | Heuristic review (Flexibility and efficiency of use) | Filters for ZIP, distance, cause, date, format, open spots |
| Matt couldn’t tell dress, physical demands or who else attends | Matt’s journey, stage 3 | “What to expect” strip: dress code, activity level, group size, co-workers |
| Group organizers couldn’t tell if a host had room before reaching out | Problem statement, Brooke proto-persona | “Hosts with capacity” step; capacity shown before contact details |
| Competitors handled discovery; only Points of Light Engage offered even partial group coordination | Competitive audit | A dedicated “Plan a team day” path |
| Early wireframe had four entry paths and a four-question quiz | Selected wireframe | Three paths; quiz became the lighter “Help me choose” panel |
One lane per audience, from Home to done
Matt
The first-timer
Home
Has a free Saturday and selects Browse opportunities.
Browse opportunities
Filters six listings and selects View details.
Opportunity detail
Reviews expectations, access, contact, and tips.
Sounds doable?
Yes fill in the guest form.
No back to Browse opportunities.
Register
Enters name, email, and time slot, then selects Register as a guest and sees "You're registered."
Brooke
The corporate team organizer
Home
Needs a volunteer day for 10–60 people and selects Plan a team day.
Your request
Enters headcount, dates, cause, setting, and access needs, then selects Find matching hosts.
Hosts with capacity
Compares viable and undersized options.
A host fits the request?
Yes review this host.
No back to Your request.
Review and contact details
Adds organizer details, consents to contact, and submits the team-day request.
Request received
Pittsburgh Cares and the selected host review the request. Capacity remains pending until the host approves it.
Emma
The recurring senior volunteer
My volunteering
Opens it from the persistent navigation.
Email lookup
Selects Send me my link, then Open my shifts.
Upcoming shifts
Sees upcoming shifts and hours logged.
Needs reconfirmation?
Yes Reconfirm this shift, then see "Confirmed. Nothing else to do."
No keep current status.
Supporting structure
Navigation followed volunteer intent
Each audience's path is reachable from the persistent navigation, not only from Home.
- Built in the prototype
- Proposed, not built
Home
Browse opportunities
Persistent navMatt's path
- Filters: ZIP, distance, cause, date, format, open spots
- Six opportunity listings with save for later
- ‘Help me choose’ nudge panel
- Opportunity details: what to expect, accessibility, pro tips
- Guest registration: name, email, shift time
Plan a team day
Persistent navBrooke's path
- Step 1 · Your request
- Step 2 · Hosts with capacity
- Step 3 · Review and contact details
My volunteering
Persistent navEmma's path
- Email-link lookup
- Upcoming shifts: reconfirm, check in, can't make it
- Hours logged with download
Account
Persistent navShared
- Sign in with an email link
- Browse as a guest
- Saved profile across devices, Proposed
Help & Legal
FooterShared
- Frequently asked questions (section on Home)
- Contact & support
- Accessibility Statement
- Privacy Policy
- Terms of Use
Home, with five sections:
- Browse opportunities (Persistent nav · Matt's path)
- Filters: ZIP, distance, cause, date, format, open spots (Built)
- Six opportunity listings with save for later (Built)
- ‘Help me choose’ nudge panel (Built)
- Opportunity details: what to expect, accessibility, pro tips (Built)
- Guest registration: name, email, shift time (Built)
- Plan a team day (Persistent nav · Brooke's path)
- Step 1 · Your request (Built)
- Step 2 · Hosts with capacity (Built)
- Step 3 · Review and contact details (Built)
- My volunteering (Persistent nav · Emma's path)
- Email-link lookup (Built)
- Upcoming shifts: reconfirm, check in, can't make it (Built)
- Hours logged with download (Built)
- Account (Persistent nav · Shared)
- Sign in with an email link (Built)
- Browse as a guest (Built)
- Saved profile across devices (Proposed, not built)
- Help & Legal (Footer · Shared)
- Frequently asked questions (section on Home) (Built)
- Contact & support (Built)
- Accessibility Statement (Built)
- Privacy Policy (Built)
- Terms of Use (Built)
Selected wireframe
Four entry paths became three
05 · Testing and iteration
Two tasks went smoothly; group booking needed another round.
Five participants completed initial moderated testing on the prototype. In those sessions, participants completed the first-time browsing task and the returning-volunteer task successfully; group booking produced the most friction. Two of the five participants returned for retests limited to the group-booking task.
Group booking scored lowest at 3.0/5, then reached 5/5 in both retests
Ease ratings are post-task self-reports on a 1–5 scale, where 5 is very easy. Scores are averages across the five initial sessions.
01
First-time volunteer (persona: Matt)
4.8/5Performed well in the initial sessions.
02
Corporate organizer (persona: Brooke)
3.0/5The most friction of the study, and the source of nearly every logged issue.
Group-booking ease: before vs. after
Both participants who returned for the retest, after three fixes.
| Participant | Before | After |
|---|---|---|
| Silas | 4/5 | 5/5 |
| Sheila | 2/5 | 5/5 |
03
Returning volunteer (persona: Emma)
5.0/5Performed well in the initial sessions, with no hesitation observed.
01 · First-time volunteer
4.8/5Initial five-session average · persona: Matt
Task
Find an opportunity that fits and RSVP without creating an account.
What happened
All five participants browsed the prototype's opportunity listings and completed an RSVP without ever being asked to sign up. The “What to Expect” strip was praised unprompted in 4 of 5 sessions.
Friction logged
- The “See if it fits” link was mistaken for the primary CTA.
02 · Corporate organizer
3.0/5Initial five-session average · persona: Brooke
Task
Submit a request for a 30–50 person team day for a company group.
What happened
Participants recognized the group path as its own route, then stalled inside the team-day request form itself. It was the lowest-scoring task of the study.
Friction logged
- Group size only accepted increments of 5; hit in 3 of 3 sessions with a non-round headcount.
- No working back-navigation from deep in the flow; it failed in 3 of 3 sessions where it was attempted.
- Unclear whether the request was received or the event was booked, and whether the date field wanted a range or one date.
03 · Returning volunteer
5.0/5Initial five-session average · persona: Emma
Task
Reconfirm a recurring shift.
What happened
All five participants rated it 5/5 with no hesitation or issues, including a 65-year-old weekly volunteer who closely matched Emma's profile.
- “Yes, I can't make it” read as awkward button copy. Fixed: now “Can't make it.”
- An optional post-RSVP account step was read as required. Fixed: now labeled “This step is optional.”
- A post-event impact report appeared before the event. Fixed: now labeled as sample data.
- Participants were unsure why Sign in exists after completing tasks without it. Not yet addressed.
Iteration details
What changed after usability testing
01
Organizers couldn’t enter their exact group size
Observation
The selector limited group sizes to multiples of five. Three participants needed to enter a different headcount and were forced to round their group size up or down.
Design response
Replaced the fixed increments with free numeric entry, keeping the increment-of-5 buttons as optional quick-select shortcuts.
After
Result
Confirmed in both retests. Silas found the exact-entry control unprompted; Sheila entered her exact headcount of 41 without hesitating.
02
Back navigation dumped organizers out of the flow
Observation
Three participants who tried to move backward from deep in the group-booking flow were kicked all the way out and had to restart the request from the beginning.
Design response
Added a persistent step indicator and breadcrumb, so each step is a place you can return to.
After
Result
Confirmed. Silas specifically tested backward navigation at each step and it held.
“there's a back button here... every step of the way so that you can go back”
Silas, retest session
03
Request status was unclear, and the date field contradicted Task 1
Observation
Two participants finished the group-booking flow unsure whether the request had gone through. Two others were confused by the earliest/latest date-range picker after using an exact single-date picker minutes earlier.
Design response
Added a distinct request-received state explaining that Pittsburgh Cares and the selected host will review the request and that capacity remains pending until host approval. An inline hint near the date fields supports organizers who already have one specific date.
After
Result
Silas reached the request-received screen showing the point of contact.
Not yet confirmed: the hint for organizers with one specific date drew no comment in either retest.
Not yet confirmed: The Request received screen includes a sample post-event impact report, labeled as example data, showing the planned format for attendance, hours, output, and host feedback. Labeling the post-event report as sample data didn't come up in either retest.
06 · Final design
Clearer choices before commitment.
The responsive prototype makes opportunity details, availability, capacity, and next steps visible across individual, group, and returning-volunteer paths.
The finished experience
Three clear paths from the homepage
The first screen routes people by what they came to do instead of forcing every audience through one funnel.
The homepage routes new volunteers to Browse opportunities, companies to Plan a team day, and returning volunteers to My volunteering, each with a short note on what to expect.
Path 1 · For new volunteers · Matt
Browse, review, register
A first-time volunteer finds an opportunity, reviews the commitment, and registers as a guest.
Step 1 of 3 · Browse
Six opportunities with filters up front
Filter by location, cause, date, format, and open spots.
Step 2 of 3 · Opportunity detail
Details before the guest form
Expectations and access info sit beside a three-field form.
Step 3 of 3 · Confirmation
A phone-ready confirmation
Date, time, named contact, and what to expect, ready for check-in.
Path 2 · For companies · Brooke
Plan a team day
Organizers see which hosts have room for their group before sharing contact details.
Step 1 of 3 · Your request
A request shaped around the group
Headcount, dates, cause, setting, and access needs.
Step 2 of 3 · Hosts with capacity
Capacity comes first
A host without enough room for the group sits apart from the matches.
Step 3 of 3 · Request received
A clear pending state.
Capacity stays pending until the host approves, and a packet covers logistics.
Path 3 · For returning volunteers · Emma
My volunteering
Upcoming shifts
Shifts and hours in one place
Reconfirm, check in, or cancel from one card after an email-link handoff.
Live prototype
Try the Pittsburgh Cares prototype
Try the browse, team-planning, and returning-volunteer paths after reviewing the evidence behind them.
Try the live prototypeThe live build uses shared blue and rust accents.
Core palette
Ink
#1F2A33
Ink Soft
#45525D
Background
#F3EFE6
Card
#FFFCF7
Line
#D8D1C5
Persona accents
Blue — shared interactive
#246B83
Rust — shared path accent
#C65D3A
Rust Soft
#F5E4DC
Warm Panel
#EEE8DC
Grey — shared
#5D666D
Semantic colors
Open / Confirmed
#39745B
Pain / Destructive
#B42318
Prototype typography
Bitter 600/700 for display text
Atkinson Hyperlegible Next 400/500/700 for body and interface text
Chosen for legibility, including its slashed zero, which keeps 0 and O distinct in dates and phone numbers.
Components
MUSTSHOULDCOULDShared interactive accent4px chip radius6px pill radius8px card radius
07 · Reflection
The details around a team-day request carry the experience.
This project changed how I think about volunteer platforms: discovery matters, but the work of coordinating people, constraints, and expectations determines whether intent becomes participation.
01
Design group coordination as its own task
A group organizer is solving for headcount, dates, logistics, and approval, not personal interest. Giving group coordination its own path from the start, instead of adapting an individual flow, is now a default for me.
02
Make operational constraints visible early
Capacity, availability, accessibility, and a named contact shaped whether an organizer could proceed. I will surface those constraints at the comparison stage, before people invest time in forms or outreach.
03
Test language and interaction details early
Small details changed how the flow was understood: fixed headcount steps, back navigation, date wording, and the request status all created friction. I will test consequential labels and controls before polishing the broader experience.
Limitations
Results are directional: five participants from a convenience sample, with two returning for the group-booking retest. The Testing section notes which changes aren't confirmed yet.
Next steps
With another round, I would recruit corporate organizers who plan volunteer events, retest the two changes not yet confirmed, clarify why guests would need Sign in, and run a card sort before finalizing navigation labels.