Volunteer Matching Website

InspirationInspiration

A lot of students actually want to volunteer, but it’s harder than it should be. When we looked online, we saw huge lists of opportunities that were confusing, and it wasn’t clear which ones fit our schedule or where we live. Sometimes we also didn’t know what the organization even does, or what we should say when we contact them. We wanted to make something that helps students go from “I want to help” to “I’m doing it” without feeling overwhelmed.

What it does

CauseCompass AI is a volunteer matching website that helps you find opportunities based on your interests, the cause you care about, how much time you have, and your location (including remote options). After you pick your preferences, the AI ranks the opportunities and gives them an AI score, plus a short explanation for why each one matches you. It also writes a message you can send to the organization so you don’t have to start from a blank page. Then it can make a quick voice briefing you can listen to, and it creates a study pack (flashcards) so you can learn about the cause and feel prepared before you volunteer.

How we built it

We built a modern website with a filter panel and volunteer opportunity cards, kind of like a clean shopping site but for volunteering. You can bookmark favorites, open a card to see details, and keep things organized. For the AI part, we used Featherless.ai to run a model that actually does the matching and ranking (not just chatting). We used Opennote to generate flashcards about the opportunity and the cause, and we used ElevenLabs to turn the AI’s plan into a realistic voice audio clip. We also used sample data so the whole project works even before connecting a real database.

Challenges we ran into

One problem was that the AI sometimes tried to generate way too much text, which caused errors. We fixed that by limiting how much the AI can output and making it return clean JSON so the app can reliably read the results. Another challenge was making sure the AI’s answers were structured the same way every time, which took prompt tuning and testing. We also learned that some APIs don’t always like being called directly from the browser because of security rules, so for a real version we would use a simple server proxy to protect keys and avoid CORS issues.

Accomplishments that we're proud of

We’re proud that the project feels like a real product with a polished design, not just a rough demo. We like that it’s easy to explain: you enter what you care about, the AI ranks options, and then it helps you take the next steps. We’re also proud that we used multiple AI services in one flow—ranking and reasoning, learning tools, and voice output—and made them work together in a way that actually helps students.

What we learned

We learned that AI is most useful when it’s part of the main system, not just an extra feature. Making the AI do the ranking and generate the outreach message made the website feel way more helpful. We also learned that good prompts and limits matter a lot, because websites need consistent outputs. Finally, we learned that building a full project isn’t only about the AI—it’s also about good UI, handling errors, and making the experience easy for users.

What's next for Volunteer Matching Website

Next, we want to connect the website to real volunteer listings instead of sample data, and add a small backend so API keys are safe and everything works smoothly. We also want features like a calendar export, reminders, and maybe a “volunteer plan” that helps you stick with it over time. Another idea is letting schools and clubs share lists of opportunities and track group volunteering. And we’d like to deploy it on a free .XYZ domain so anyone can try it online.

Built With

• css
• elevenlabs
• featherless
• html
• javascript
• opennote
• vscode