Inspiration

Civic engagement is the cornerstone of a thriving democracy, yet many people find it challenging to understand their civic duties or get involved in their communities. Whether it’s understanding how voting works, registering to vote, or organizing local events around civic topics, there is a gap in accessible and engaging platforms for civic education and community building. Inspired by the need to make civic engagement easy, fun, and rewarding, here is Civvy — an all-in-one platform for learning and connecting around civic duties.

What it does

Civvy combines education and community engagement into one streamlined experience:

  • Learn: A learning platform where users can pick topics to learn and each topic includes modules with educational content followed by interactive quizzes. Users earn experience points (EXP) as they complete modules, track their progress, and save completed courses.

  • Connect: An events page where users can create, join, and organize local gatherings. These events can focus on activities such as voter registration drives, civic education workshops, or community discussions about political issues. The "Joined Events" tab makes it easy for users to keep track of their participation.

  • User Profiles: Each user has a profile with their progress stats, completed modules, and a navigation hub to access other features easily.

  • Landing Page: A polished front page to introduce Civvy’s features, creating a welcoming entry point for new users.

How we built it

  • Tech Stack: We used Clerk for user authentication, Convex to store user data and handle database actions, and React-Native and Expo for the web and iOS development.
  • Web and iOS Flows: We implemented and tested Google and email/password authentication for both web and iOS platforms.
  • Learning Modules: Built a modular learning system where each module has a unique ID stored in the database. Modules include content, followed by quizzes. User progress and completion status are stored and retrieved dynamically.
  • Events Page: Developed a dynamic events system where users can create and join events. Events are tied to the creator’s ID and stored in the database.
  • Design: Prototyped screens using V0, iterating quickly to ensure a cohesive user experience.

Challenges we ran into

  • Routing Issues: Initially, user routing during login/sign-up processes did not redirect correctly. This required debugging the Google sign-in flow to ensure users landed on the appropriate pages.
  • Database Structure: Storing user progress for learning modules and handling event creation while ensuring data consistency was a challenge that required careful planning and optimization.
  • Cross-Platform Consistency: Ensuring the web and iOS versions of the app provided a seamless and consistent user experience across different flows.
  • Voter Registration: Wanted to implement a custom page to perform voter registration but the APIs needed were not available or not feasible.

Accomplishments that we're proud of

  • Successfully implemented cross-platform sign-in and sign-up functionality using Google and email/password options.
  • Built an engaging and intuitive learning system with modules, quizzes, and progress tracking.
  • Developed a functional and scalable events system that fosters community engagement.
  • Created a polished UI with consistent design elements, making the app easy and enjoyable to use.
  • Integrated multiple technologies (Clerk, Convex, React-Native, Expo) into a cohesive app that works seamlessly.

What we learned

  • Authentication: Clerk is a powerful tool for user authentication, and we gained a deeper understanding of how to integrate it with other backend systems like Convex and Firebase.
  • UI/UX Design: Rapid prototyping tools like V0 can significantly speed up the design process, but aligning the design with technical implementation requires iteration and feedback.
  • Civic Engagement Needs: There is a strong demand for platforms that make civic education and engagement accessible, especially when designed in a gamified and community-oriented way.

What's next for Civvy

  • Expand Learning Modules: Add more topics and diversify the topics as well. Enable user-generated content for more diverse learning materials.
  • Gamification Features: Introduce badges, leaderboards, and streak tracking to further engage users.
  • Enhanced Events System: Allow users to filter and search events by location or topic. Add features for event chat and reminders.
  • Mobile App: Expand iOS support and develop an Android app to reach a wider audience.
  • Localization: Add multilingual support to make Civvy accessible to non-English speakers.
  • Partner with Organizations: Collaborate with nonprofits and civic groups to provide verified educational content and promote local events.
  • Voter Registration Page: Implement a custom page to perform voter registration per state.
Share this project:

Updates