Sonic Sync

Sonic Sync is an inclusive platform empowering the Deaf community to learn, connect, and thrive through sign language courses and career opportunities.

Comment 1

Inspiration

Did you know that over 466 million people worldwide live with disabling hearing loss? Many of them, especially deaf individuals, face severe challenges accessing quality education in their native language: sign language. In many countries, deaf students attend under-resourced schools and lack inclusive learning environments, leaving them unprepared for the job market. This stark reality inspired us to create Sonic Sync.

Some of our close friends in the deaf community struggled to access meaningful courses and find jobs that respected their communication needs. Sonic Sync was born from this experience. We envisioned an inclusive platform where deaf learners can access high-quality, sign-language-first education, and deaf instructors can share knowledge and earn. Sonic Sync also connects users to deaf-friendly job opportunities, building a future where every voice is heard, seen, and valued.

What it does

Sonic Sync is an inclusive community platform built to empower the Deaf community through education, career opportunities, and social connection.

Our platform is designed to empower its users through several core features:

  • Sign Language Courses: Sonic Sync offers a robust learning management system where users can explore sign language courses, subtitled content, and lessons taught by expert Deaf instructors. Features like saving course progress, resuming playback, and bookmarking ensure a seamless learning experience.

  • Inclusive Job Board: Sonic Sync features a dedicated job board that connects Deaf and Mute job seekers with “Deaf-Friendly” employers committed to accessible workplaces. Users can upload resumes and receive job suggestions tailored by our smart engine, matching profiles to relevant opportunities from our database.

  • Vibrant Community Forum: A dynamic forum enables users to connect, share experiences, ask questions, and engage in discussions, fostering a supportive network.

  • Personalized User Profiles: Users have comprehensive profiles to track learning, manage bookmarks, save jobs, and customize notifications. Instructors can access a dedicated dashboard after signing up as regular users and contacting our team for verification. Once approved, they can upload their courses and manage all their content through this instructor dashboard.

How we built it

Sonic Sync was developed with a modern, efficient, and scalable technology stack, primarily leveraging the rapid development capabilities of Bolt.new.

  1. Frontend: The user interface is built with React, delivering a dynamic and responsive experience. Tailwind CSS provides utility-first styling for rapid and consistent design across the platform. React Router handles seamless navigation, while React Hook Form simplifies form handling and validation.

  2. Backend & Database: Supabase serves as the robust backend infrastructure, including:

  • PostgreSQL Database for managing user profiles, courses, jobs, forum posts, comments, and other critical application data.

  • Supabase Authentication ensures secure user registration, login, and session management, including OAuth integration with Google.

  • Supabase Storage manages images, videos, user avatars, and resume files efficiently.

  • Supabase Realtime powers live updates in the forum and notification systems, creating an interactive experience.

Development Approach: We adopted a component-based architecture for the frontend, ensuring reusability and maintainability. Our focus was on crafting an intuitive, visually appealing interface, prioritizing accessibility for all users.

Prompt Engineering & Development Process: Throughout development, we followed prompt engineering best practices, meticulously designing backend logic, database schemas, and wireframes before moving to frontend implementation. Our structured approach, crucial when building on a no-code platform like Bolt.new, allowed us to optimize the prompts, ensure seamless integrations, and produce a polished final product.

External Tools Used in Support Roles: While the core development of SonicSync was accomplished in Bolt.new, we leveraged several external tools in supportive roles to enhance productivity and precision. We utilized Perplexity.ai for crafting optimized prompts tailored for Bolt.new, ensuring efficient and context-aware development flows. Additionally, ChatGPT and Claude served as invaluable resources for generating isolated code snippets when needed to slightly change the code, resolving specific implementation challenges, and making quick UI or logic adjustments. These AI tools complemented our development process, helping us iterate rapidly without straying from Bolt.new as the primary platform.

Challenges we ran into

Developing Sonic Sync presented several interesting challenges:

  • Prompt Engineering & Managing Complexity: Building Sonic Sync with AI-driven prompt workflows was a unique challenge. We had to master prompt engineering best practices, ensuring precise instructions for Bolt.new while avoiding ambiguous outputs or spaghetti code as our codebase grew.

  • Real-time Data Synchronization: Implementing Supabase Realtime for forum interactions and notifications demanded careful handling of subscriptions and state management to prevent data inconsistencies and optimize performance.

  • Video Processing & Storage: Managing video files of courses, secure uploads, and generating thumbnails at specific timestamps required significant optimization and robust backend solutions.

  • Resume Parsing & Job Matching: Extracting keywords from uploaded PDF resumes using PDF.js and matching them intelligently with job listings was complex. Fine-tuning our matching algorithms to deliver meaningful recommendations took considerable effort.

  • Complex Row Level Security: Crafting granular Row Level Security (RLS) policies in Supabase for different user roles (such as user, admin, and instructor) was intricate, often leading to unexpected access issues that required meticulous debugging.

  • Accessibility & Diverse UX: Designing an intuitive experience accessible to both Deaf and hearing users demanded a deep understanding of visual communication and continuous iteration to meet diverse needs.

Accomplishments that we're proud of

We are immensely proud of several key accomplishments throughout the development of Sonic Sync:

  • Comprehensive Feature Set: Successfully integrating a wide array of features from interactive courses and a dynamic job board to a community forum and personalized dashboards into a cohesive, user-friendly platform.

  • Polished User Interface: Creating a clean, modern, and highly responsive user interface that is both aesthetically pleasing and functionally intuitive, significantly enhancing the user experience.

  • Robust Authentication and Authorization: Implementing a secure and flexible authentication system with distinct user roles (admin, user, instructor) and granular access controls, ensuring data integrity and user privacy.

  • Seamless Supabase Integration: Effectively leveraging Supabase’s full suite of services (Auth, Database, Storage, Realtime) to build a powerful and scalable backend with minimal overhead.

  • Accessibility-First Design: Prioritizing accessibility throughout the design and development process, ensuring the platform is genuinely usable and beneficial for the Deaf and Mute community.

  • Automated Content Processing: Successfully implemented automated video thumbnail generation and intelligent resume parsing, which significantly streamlines content management and enhances user utility.

What we learned

The journey of building Sonic Sync provided invaluable lessons:

  • Bolt.new Power: We developed a deep appreciation for Bolt.new capabilities in accelerating full-stack development, enabling us to prototype and build complex features with remarkable efficiency rapidly.

  • Prompt Engineering for AI: Working on AI-driven features underscored the critical importance of precise prompt engineering to guide AI effectively, ensuring accurate, contextually relevant outputs for translation and content generation.

  • Deepening Accessibility Understanding: We reinforced the principle that accessibility is not an afterthought but a foundation. We learned to critically consider visual design, navigation, and interaction patterns from the perspective of Deaf users, ultimately creating a more inclusive product.

  • Supabase’s Versatility: We discovered the immense versatility of Supabase as a comprehensive backend-as-a-service, seamlessly managing authentication, database operations, real-time data, and file storage—all within a unified ecosystem.

  • Iterative Development: The project emphasized the necessity of iterative development. Addressing complex RLS policies and nuanced UX challenges taught us the value of continuous testing, user feedback, and adaptive problem-solving.

What's next for Sonic Sync

The future of Sonic Sync is bright, with ambitious plans to expand its features and impact:

  • Enhanced AI Capabilities: We plan to advance our AI-powered sign language translation, including real-time interpretation for live interactions and a more nuanced understanding of context. Our goal is to enable sign language avatars to translate video courses from subtitles in real time.

  • Mobile Application: We will develop native mobile apps for iOS and Android using Expo, ensuring seamless access to Sonic Sync anywhere, anytime.

  • Advanced Instructor Tools: We aim to empower instructors with enhanced tools for creating courses, managing students, and analyzing engagement and learning outcomes.

  • Community Expansion: We’re actively pursuing partnerships with Deaf organizations, educational institutions, and businesses to extend our reach and deepen our impact within the global Deaf and Mute community.

  • Continuous Improvement: We are committed to ongoing performance optimization, UX refinement, and content library growth to keep Sonic Sync a leading resource for inclusive education and employment.

  • Payment Integration: We plan to implement secure payment processing, enabling premium course offerings and subscription models to support platform sustainability and growth.

Challenge Compliance:

  • Startup Challenge (Use Supabase to prep your Bolt.new project to scale to millions.): Sonic Sync leverages Supabase as the backbone of our backend infrastructure, preparing our Bolt.new project to scale efficiently to millions of users. We utilize Supabase’s powerful services, including a PostgreSQL database, authentication, secure storage for media files such as video courses and resumes, and real-time subscriptions for features like forum activity and notifications. The integration of Supabase’s Row Level Security (RLS) ensures granular data privacy and multi-role access control, underscoring our commitment to building a robust, scalable, and secure application ready for global adoption. By architecting Sonic Sync entirely on Supabase, we’ve laid a solid foundation not only for our current feature set but for future expansion, like real-time AI translation, ensuring SonicSync can grow into a global hub for the Deaf community.

  • Deploy Challenge (Use Netlify to deploy your full-stack Bolt.new application): We have successfully deployed Sonic Sync as a full-stack application using Netlify. Our live application, available at https://sonicsync.app, demonstrates a seamless deployment pipeline and the ability to deliver a fast, reliable user experience globally. The buying of a custom domain within Netlify was easy, and Netlify handled all the domain registration processes for us. Additionally, our project has HTTPS enabled with an SSL/TLS certificate, ensuring secure connections for all users. Netlify’s platform ensures our static assets, dynamic pages, and API interactions are optimized for performance and scalability, crucial for serving a diverse, worldwide user base. By deploying on Netlify, we ensured Sonic Sync is accessible anywhere in the world with lightning-fast performance, a necessity for our mission of inclusivity. This deployment showcases Bolt.new flexibility to integrate with modern hosting solutions and demonstrates our readiness to serve millions of users securely and efficiently.

Built With

Share this project:

Updates