Readify: Dyslexia-Friendly Reading Companion

Learn, Read, and Enjoy Without Barriers

Comment

Inspiration

Many students with dyslexia struggle with traditional reading tools, which can make learning slow and frustrating. We wanted to create an inclusive platform that supports reading, comprehension, and engagement for dyslexic learners while being enjoyable and intuitive for everyone.

What it does

  • Provides dyslexia-friendly reading fonts like OpenDyslexic.
  • Allows adjustable font size, line spacing, and background colors for optimal reading comfort.
  • Includes AI-powered text assistance for summaries and comprehension.
  • Offers gamified learning tools to make reading interactive and fun.
  • Supports text-to-speech (TTS) with highlighted word tracking.
  • Lets users save bookmarks locally or to a database.
  • Accepts file uploads for reading custom text documents.

How we built it

  • Frontend: React, CSS, responsive UI design.
  • Backend: Node.js, Express, MongoDB (for storing user bookmarks).
  • Features:
    • TTS integration using Web Speech API.
    • Dyslexia-friendly font management.
    • Interactive and animated UI components.
  • Authentication: React Context API + JWT for user login and registration.
  • Data Management: LocalStorage for local saves, MongoDB for DB saves.

Challenges we ran into

  • Implementing smooth word-by-word TTS highlighting.
  • Making UI fully accessible and dyslexia-friendly.
  • Managing local and database bookmarks in sync.
  • Ensuring responsive design for different screen sizes.

Accomplishments that we're proud of

  • Fully functional dyslexia-friendly reading environment.
  • Customizable reading experience for every learner.
  • Integrated AI assistance and gamified learning.
  • Seamless local and cloud-based bookmarking system.
  • Clean and interactive UI with animations.

What we learned

  • Best practices for accessibility and inclusivity in UI/UX.
  • Handling text-to-speech and dynamic word tracking in web apps.
  • Integrating localStorage with backend DB storage.
  • Managing state and context effectively in React.

What's next for Readify: Dyslexia-Friendly Reading Companion

  • Add multilingual support for non-English texts.
  • Enhance AI summarization and comprehension assistance.
  • Develop mobile-friendly React Native version.
  • Add collaborative reading and annotation features.
  • Integrate more gamification and progress tracking for students.
Share this project:

Updates