Designing For Real People

Behind the original request was a global team working across roles, time zones, and digital platforms—many of whom had never met in person. What connected them wasn’t process—it was purpose.

At first, the focus was on volunteers. But as we looked more closely, it became clear that the challenge wasn’t just onboarding—it was about making work possible for people who were already stretched thin, switching between devices, and juggling competing demands.

To design with empathy, we started by learning more about who we were designing for. We spoke with staff, volunteers, and board members, reviewed their workflows, and gathered insights about what they needed to feel confident and supported.

From these conversations, we developed three learner personas—each one reflecting a different set of needs, frustrations, and motivations that helped guide every design decision that followed.

Meet the People Behind the Work

The personas that follow were created by analyzing feedback, reviewing communications, and speaking directly with volunteers and board members. Each one represents a real cluster of needs that shaped how we approached the design.

What He Needs From the Site

Marcus wants quick, trustworthy resources he can share with others. He’s looking for a tool that offers clear language, step-by-step guidance, and links he can send without second-guessing.

Tech Setup & Accessibility

He mostly uses his phone and sometimes public computers. He needs mobile-friendly tools, low data usage, and simple visuals to help explain things clearly.

Frustration Triggers

  • Too much jargon or formal language
  • Resources that are hard to find or broken links
  • Pages with too many options or steps

Motivations & Learning Goals

Marcus wants to feel confident helping others. He’s motivated by lived experience and hopes to grow his own knowledge without being overwhelmed by complexity.

What She Needs From the Site

Lila wants a clear view of how the organization is functioning—key info, real-time updates, and a sense of what’s working. She’s looking for visibility, not more complexity.

Tech Setup & Accessibility

Uses a laptop and tablet, often between patients or meetings. She's tech-savvy but won't tolerate friction. She expects responsive design, logical structure, and data she can scan fast.

Frustration Triggers

  • Cluttered dashboards or hard-to-find reports
  • Redundancy or vague language
  • Needing to ask someone else for data

Motivations & Learning Goals

She's driven by purpose and professionalism. She wants to contribute without micromanaging and understand how systems are helping or hindering the mission. Her learning goal is efficiency: how can she help the team by being better informed?

What She Needs From the Site

Estrella wants a centralized, intuitive space where staff, volunteers, and community members can get what they need—without having to go through her. She’s looking for a tool that reduces repeated questions and helps others work independently, not one that adds more admin work to her plate.

Tech Setup & Accessibility

She switches between a laptop and mobile throughout the day. Comfortable with most tools but values simplicity—clean layouts, minimal clicks, and mobile responsiveness. While she doesn’t have specific accessibility needs, she wants the design to work well for team members with varying digital access and literacy.

Frustration Triggers

  • Overcomplicated or cluttered systems
  • Having to resend info or explain things repeatedly
  • Searching for outdated or scattered content
  • Feeling like she has to be the “source of truth”

Motivations & Learning Goals

Estrella is purpose-driven. She wants a platform that empowers others, builds clarity, and supports the mission sustainably. Her learning focus is on how the system can scale, track engagement, and share responsibility without micromanagement.

What We Learned From Listening

The initial request was simple: create a resource to help new volunteers get oriented. We anticipated a straightforward solution—maybe an interactive digital handbook with clickable links, embedded media, and simple checklists.

But as conversations deepened, so did our understanding of the organization—and the people behind it. What they really needed wasn’t just a one-time resource. It was a living digital home: a place to connect, access updates, and build shared culture across time zones, devices, and bandwidth.

Our learner personas helped surface why that mattered. These were people juggling caregiving, community work, and full-time jobs—often skimming through tasks on a phone or shifting between roles mid-day. The design couldn’t just be functional. It needed to be flexible, forgiving, and human-centered.

Experience the Problem

Now that you’ve met the people using this system, take a moment to feel what they were working with.

This short simulation isn’t a scavenger hunt—it’s a glimpse into the everyday friction that shaped this project from the start. The tools were there. The people were committed. But the experience? Scattered, clunky, and harder than it needed to be.

There’s no wrong way to explore. Just follow your instincts and notice what it’s like to navigate without a map.

Try it below.

From Insight to Action: Design Decisions That Made a Difference

The insights we gathered weren’t just ideas—they became criteria. Every choice we made had to support real people navigating real complexity: juggling roles, switching devices, skimming for answers between meetings. Below, you’ll find the key design decisions that shaped the final solution—grouped by the needs they addressed.

These themes reflect the core needs we uncovered—and how we translated them into purposeful, practical design.

    • Group related content and tasks in consistent, clearly labeled sections.

    • Use headings and subheadings to help people scan and find what they need.

    • Prioritize the most-used actions or links at the top of each page or list.

    • Include short summaries or “what this is for” text to orient people quickly.

    • Ensure every page works seamlessly on mobile, not just desktop.

    • Use responsive layouts and avoid horizontal scrolling.

    • Make buttons and links large enough to tap comfortably.

    • Test all tools and forms on phones and low-bandwidth environments.

    • Use high-contrast colors and large, legible fonts.

    • Write content that avoids jargon and assumes a range of reading levels.

    • Provide alt text and avoid using color alone to convey meaning.

    • Ensure navigation works with a keyboard and screen reader.

    • Limit options per page to reduce overwhelm.

    • Break complex processes into small, guided steps.

    • Avoid deep menu layers or hidden links.

    • Use consistent language and visual patterns across pages.

    • Make it easy for different people to find only what’s relevant to them.

    • Use permission-based visibility for documents, forms, and dashboards.

    • Reduce reliance on one person to share or approve everything.

    • Allow users to self-serve and act independently when possible.

    • Clearly label who last updated a document and when.

    • Use shared links or embed live documents to reduce version confusion.

    • Be upfront about where info came from and who to contact with questions.

    • Make decision-making logs, updates, or notes visible when relevant.

    • Reduce visual and mental clutter without removing meaningful context.

    • Use clear, action-oriented labels (e.g., “Get Help,” not “Support Portal”).

    • Give just enough detail to build confidence without overwhelming.

    • Keep it straightforward—but allow for complexity when it matters.

    • Design for autonomy—make it easy for people to take action without waiting for help.

    • Include simple guidance or tips near complex tools or forms.

    • Highlight opportunities for people to grow skills or deepen involvement.

    • Make tools feel approachable, not overwhelming—build confidence with each interaction.

Key Takeaways from This Phase

  • A cluttered system doesn’t just slow people down—it shapes how confident, connected, and capable they feel.

  • Designing for flexibility means more than being mobile-friendly—it means making space for different roles, rhythms, and realities.

  • Clear architecture and simple language aren’t just UX best practices—they’re a form of respect.

  • Discovery doesn’t end once the project kicks off. Sometimes the most useful insights show up when people respond to something real.

We had a clearer view of the real need. Now it was time to choose the right foundation and start building.

Discovery showed us the “why.” These early concepts helped us explore the “how.”