Inspiration

Since 2009, BRIDGEGOOD has connected design with confidence, access, community and economic mobility. Its Design for Social Good philosophy helps people see themselves as creators, leaders and problem-solvers.

Until now, though, that philosophy has mostly lived in people: facilitator-led sessions, mentorship, weekly reflections, and conversations with the founder and core team. It works because it's personal, and that's exactly why it's hard to scale.

The challenge asked:

How might BRIDGEGOOD codify and scale its Design for Social Good philosophy so students, alumni, mentors, volunteers, staff, partners and outside communities can understand, practice, and carry it forward as the organization grows beyond any one person?

We didn't want to build another course, or a wall of inspirational quotes. We wanted the values and the reasoning behind them to be practiced, so the mindset travels through people rather than slides.

What it does

BridgeGoodx is BRIDGEGOOD's shared space for learning, practicing and carrying forward Design for Social Good. It's built around one repeatable community cycle:

Understand → Practice → Reflect and Share → Teach and Evolve → Understand again

There's no fixed curriculum: people enter wherever makes sense for them, and come back when they need support.

Welcome

An animated "Design for social good / people / purpose / passion / community" headline, followed by what each role does:

  • Students learn the mindset, find their own voice, and apply it to real-world challenges.
  • Alumni carry it forward into their careers, portfolios and the next cohort.
  • Mentors guide with care, honest feedback and good questions.
  • Chapter leads gather their communities and adapt the approach while keeping its values at the center.
  • Community Partners collaborate by contributing their real world design problems.
  • Company hosts open doors with mentors, sponsorship and workplaces that practice it.

Each line opens a pathway with one suggestion for every stage of the cycle.

Understand

The four principles as questions to return to, not rules, each with its reasoning and a concrete design choice set against the generic alternative. This page also covers how the approach differs from generic "human-centered" or "inclusion" claims, and what access, inclusion, community benefit and economic mobility actually mean here.

Design Decision Lab

Six realistic dilemmas, such as an accessibility fix versus a launch date, a powerful story without real consent, or a partner and their community wanting different things. You work through six steps:

  1. Meet the situation
  2. Choose an approach, or propose your own
  3. Explore consequences: who's helped, who's left out, the risks
  4. Hear other perspectives
  5. Reflect: What assumption did you make? Whose voice would you seek next?
  6. Take it into practice

Nothing is graded, because several answers can be defensible. The Lab is designed for an optional AI reflection helper that only asks follow-up questions, but it's switched off in this prototype, and every step works without it.

Practice Library

24 practical tools organized around real tasks: listen and understand, design inclusively, collaborate and navigate tension, build and test, reflect and grow, and teach and share. You can filter by role, goal, format, experience level and time. Every tool says when to use it, who to involve, how, what to ask, what to consider for accessibility, and how to suggest an improvement.

Living Playbook and steward review

The community's lessons, local adaptations and open questions, kept visibly separate from BRIDGEGOOD's core philosophy so authorship is never blurred. Anyone can contribute using a seven-part template with consent and attribution choices.

A BRIDGEGOOD steward reviews every contribution for relevance, consent, privacy, accessibility and alignment. They can discuss it with the contributor, publish it with the right label, or decline it with a reason. Recurring themes show which tools need improving.

Community events and chapters

Chapter leads, community partners and company hosts host critique circles, listening sessions and Demo Days on a chapter's calendar. Every event states its accessibility up front: step-free access, captions, languages and childcare. Afterwards, the host shares "what we learned" back into the Playbook. An interactive map shows each chapter.

Company hosts

A dedicated area for companies to host mentors, sponsor partner projects without steering them, and bring the principles into their own product teams.

How we built it

  • Stack: React Router 7 on Vite, React 19, Tailwind 4, Base UI / shadcn components, and our own Bridge Studio design system in BRIDGEGOOD's navy (#003365) and gold (#CD991D).
  • Content first: we started from the challenge brief and a Welcome Page and Community Playbook concept, and turned it into structured content (principles, scenarios, tools, Playbook entries) that BRIDGEGOOD can review and edit without touching the interface.
  • AI, kept off: the reflection helper is built with the Vercel AI SDK and can run on Claude or on Gemma. In this prototype it's deliberately switched off: the site tells visitors so, and the whole experience works without it.
  • Maps: MapLibre GL with OpenFreeMap tiles, plus a full list as the accessible alternative.
  • Data: demo logins for company host, chapter lead, community partner and steward. Demo data lives in the browser, so the whole cycle can be demoed with no backend.
  • Testing: unit tests for the review workflow and event rules; Playwright end-to-end flows; and an accessibility suite (axe-core plus reflow, zoom and text-spacing checks) over every page, in light and dark mode.
  • Workflow: a team working in parallel through pull requests, with Claude Code as a pair-programmer.

Human review is enforced in the code, not just the copy. A contribution can't be published until a person has ticked every check:

/** Publishing needs every review check, and records a new major version. */
export function publish(e: Entry, type: EntryType, at: string, by: string): Entry {
  if (!allChecksPassed(e)) throw new Error("Every review check must pass before publishing.")
  const version = e.status === "published" ? bump(e.version) : "1.0"
  return { ...e, type, status: "published", reviewedAt: at, version }
}

Challenges we ran into

  • Resisting slogans. The brief warned against reducing the philosophy to checklists and quotes. We rewrote the principles as questions, paired every value with a concrete design choice, and made the Lab show trade-offs instead of right answers.
  • Keeping people's judgment central. We designed the AI reflection helper to support people, not replace them: labelled as AI, questions only, never a grade, no personal contact details. We kept it switched off for this prototype, so the Lab, Library and Playbook rely entirely on people's own reflection and on human review.
  • Accessibility versus brand. BRIDGEGOOD's gold is only 2.4:1 contrast on our background, so it's reserved for decoration and the logo, never text. Our own accessibility checks caught the gold "GOOD" in the wordmark, so we render the logo as an image with a text alternative. The animated headline has a pause button and respects reduced-motion settings.
  • Changing direction mid-hackathon. We went from a mobile-first site, to a desktop-first app, to a rebuild around the Community Playbook concept, removing whole role areas while keeping what still fit (company hosts, chapters and events).
  • Merging parallel work. Teammates were landing features during the rebuild. Each merge meant deciding what to adapt (events now share learning through the Playbook) and what no longer fit.
  • Consent and privacy by design. Every person, chapter, event and story is synthetic and labelled as such. Events show an area, never an address. Contributions are screened for emails and phone numbers, and there's a route to request a correction or withdrawal.

Accomplishments that we're proud of

  • The whole cycle works end to end: practice a dilemma, open a related tool, share a lesson, and a steward reviews and publishes it with clear attribution.
  • Zero automated accessibility violations across every page in light and dark mode, plus reflow, zoom and text-spacing checks against WCAG 2.2, with keyboard-friendly navigation throughout.
  • Authorship is never ambiguous: BRIDGEGOOD's core philosophy is visually distinct from community examples, local adaptations and open questions.
  • "Social good" is specific: each principle has its reasoning, a concrete example and a question to return to, not a tagline.
  • A responsible way in for companies: hosts support chapters and partners without choosing their problems, and partner projects are never free work.

What we learned

  • A philosophy spreads through practice and conversation, not documentation. The most useful features create a moment of judgment (the Decision Lab) or a moment of giving back (the Playbook).
  • Scaling a community needs stewardship. Open contribution only builds trust when a person reviews it, labels it honestly and explains their decisions.
  • Accessibility constraints made the design better. They pushed us towards clearer language, real text alternatives and less decoration.
  • Technology should stay humble. The core experience works with no AI at all. Anything AI adds later should ask better questions and leave the decision with people.

What's next for BridgeGoodx

  • Review the draft wording with BRIDGEGOOD: the principles, scenarios, tools and core Playbook entries, so they reflect its own language and approved practices.
  • Decide together whether to switch on the AI reflection helper, with BRIDGEGOOD, students and mentors, and test it with them first if so.
  • Add a real database and accounts, so contributions, RSVPs and steward decisions are shared across devices, plus rate limiting before a public launch.
  • Grow the Decision Lab with scenarios written by and for chapters, educators and partners, and route approved Playbook proposals into it.
  • Pilot with one chapter, testing with students, alumni, mentors and a community partner against the concept's success measures: understanding, application, reflection, transfer, adaptation and trust.
  • Deploy publicly with BRIDGEGOOD's official logo and design assets.

Built With

Share this project:

Updates

Submission history