Inspiration

In today’s world, nearly every interaction is driven by money. While this system works for many, it excludes people who lack financial resources but still possess valuable skills, knowledge, and time. After COVID-19, this gap became even more apparent, many people needed help, and many others were willing to help, but financial barriers stood in the way. At the same time, social isolation increased dramatically. People became more disconnected from their neighbors and local communities, despite living closer than ever.

Xchange was inspired by the belief that community support should not depend on income. We wanted to create a platform that shifts interactions away from transactional exchanges and toward mutual aid, trust, and human connection. By enabling people to help one another using their skills, Xchange empowers communities to become more resilient, inclusive, and connected.

What it does

Xchange is a mobile app that connects people within a community by allowing them to exchange services in a structured and reliable way. Users create profiles that include their location, basic identification, the skills they can offer, and the favors or services they need. Using matching algorithms, the app suggests connections between users whose needs and skills align, making it easy for them to contact each other and arrange an exchange. This system helps users get tasks done efficiently while building trust and collaboration within their community.

Key Features

  • Profile-Based Service Exchange: Users list the services they can offer and the help they’re looking for in one clear profile.
  • Smart Local Matching: The platform suggests nearby users whose skills and needs align, making connections easy and relevant.
  • Mutual Ratings & Public Feedback: Users rate each other after exchanges, creating transparency, trust, and accountability.
  • Quality Threshold for Providers: Only users above a minimum rating can offer services, helping maintain reliable and respectful interactions.

How we built it

The idea for Xchange came from reflecting on moments in our own lives where help was needed, but money wasn’t always available. That reflection led to the idea of neighbors helping neighbors through skill sharing.

We designed and prototyped the app using Figma, carefully mapping out user flows, screens, and interactions to ensure the experience was intuitive and welcoming. To simulate the matching logic, we used React, JavaScript, HTML, and CSS, demonstrating how users could be paired based on services, needs, and location.

The core feature is a smart matching algorithm that identifies perfect two-way matches (you help me, I help you) and partial matches for potential chain trades. We used React's component-based architecture to create three main views: registration, matching dashboard, and messaging. Tailwind CSS provided consistent, accessible styling with high-contrast colors and clear visual hierarchy, green for perfect matches, blue for partial matches.

State management with React hooks keeps everything synchronized: user profiles, search results, and active conversations all update in real-time. The messaging system includes simulated responses to demonstrate how neighbors would coordinate trades, complete with timestamps and system confirmations. We prioritized accessibility from the start with keyboard navigation, screen reader support, and WCAG-compliant contrast ratios.

This combination of thoughtful design and functional logic allowed us to bring Xchange to life as a realistic and impactful prototype that shows how technology can strengthen community bonds.

Challenges we ran into

One of our biggest challenges was balancing innovation with feasibility. We wanted to build something meaningful and socially impactful while staying within the time and technical constraints of a hackathon. Defining the right scope forced us to prioritize features that truly mattered to users.

The biggest challenge we faced was designing a matching algorithm that could handle real-world bartering complexity beyond simple keyword matching. Initially, our algorithm only looked for perfect two-way matches (you want what I have AND I want what you have). The problem? In a real community, perfect matches are rare. If Sarah offers guitar lessons and wants web design, but Mike offers web design but wants lawn care—they can't help each other directly. This created a frustrating user experience where most searches returned zero results. As a result, we implemented a two-tier system with partial matches. Now users see both direct trades AND potential chain trades. This expanded match possibilities dramatically while still prioritizing perfect matches visually with green badges.

Another major challenge was designing the interface and overall user flow in Figma. Determining how users would move between screens, how much information to show at once, and how to keep the app clean yet functional required multiple iterations. Through testing layouts and refining navigation, we were able to create a clear and intuitive experience.

Accomplishments that we're proud of

By the end of the hackathon, we successfully:

  • Designed a complete Figma prototype with all major screens and user flows
  • Created an intuitive, user-friendly interface focused on accessibility and clarity
  • Planned core features such as location-based matching, profiles, and a trust-based rating system
  • Strengthened our collaboration and rapid iteration skills
  • Applied user-centered design principles to solve a real-world problem

Most importantly, we produced a tangible product that demonstrates the real-world potential of Xchange and its ability to strengthen communities.

What we learned

This hackathon taught us the importance of designing with users in mind. Creating the app’s screens and workflows forced us to think deeply about usability, clarity, and purpose. We learned how small design decisions can significantly impact how users interact with a platform.

Beyond technical skills, we learned how to plan efficiently, adapt quickly, and make thoughtful trade-offs under time pressure. This experience strengthened our understanding of how to turn an abstract idea into a concrete, visual product.

What's next for Xchange

The next major step for Xchange is implementing and refining the matching algorithms. A fully functional system that matches users based on skills, requested services, location, and reliability is essential for real-world success.

Improving this logic would ensure fair, efficient, and relevant matches, increasing trust and user satisfaction. Developing this system would bridge the gap between our visual prototype and a fully operational app, turning Xchange into a practical tool for community-based service exchange.

Alongside this, a reward system such as points, badges, or achievement levels for completing services and maintaining high ratings would motivate users to stay active and provide quality support.

With our current algorithm, we filter through the entire user database on every search. This works fine for a prototype with 8 users, but what happens with 10,000 users? The app would freeze. For future production, we would move matching to a backend server with indexed database queries, implement search algorithms like Elasticsearch for instant results, add location-based filtering to narrow the pool before matching, and cache common search results. For the prototype, we accepted this limitation to demonstrate the concept without backend complexity.

Share this project:

Updates