Notiva

• 

  Notiva Home Page

Inspiration

I've always had trouble concentrating when reading online. Ad-filled articles and lengthy, unsummarized videos made it difficult to concentrate or learn effectively. "Why can't I just get the important part, quickly and clearly?" was a common thought of mine. My own battle with concentration and information overload gave rise to the concept for Notiva.

What it does

Notiva facilitates quicker and more intelligent content consumption by providing:

• Clean Content: This tool pulls articles or transcripts from any website or video without any interruptions.
• AI Summaries: Produces concise summaries instantly to help users grasp concepts more quickly.
• Export Options: This feature lets users download or save content as a PDF for later reading.
• Audio Experience: Transcodes information into speech for portable listening.

Notiva helps you read more effectively, comprehend information more quickly, and maintain focus whether you're a professional, student, or casual learner.

How we built it

For a quick, contemporary frontend, we used React and Vite to build Notiva. The styling was done by Tailwind CSS, particularly for layouts that are easy to read.

We used the Google Generative AI API for AI summarization. We utilized html-to-text and Mozilla's Readability library to extract the article content. The youtube-transcript package is used to handle YouTube transcripts.

The browser's native API powers text-to-speech, and we used jsPDF to enable PDF exports.

Supabase is used to manage user authentication. React-markdown is used for markdown rendering, and TypeScript is used for the application's writing with ESLint for code quality.

Challenges we ran into

• obtaining dependable, clear content from various video and article sources, some of which were poorly organized or deeply nested.
• Overseeing text-to-speech cross-browser compatibility.
• ensuring that exported PDFs maintained their useful and readable formatting.

Accomplishments that we're proud of

• created a practical tool based on a genuine personal ache.
• designed a simple, uncluttered interface that people genuinely like using.
• seamlessly combined a number of intricate technologies (AI, TTS, PDF, and web scraping).
• Testers gave positive feedback, stating that it actually improved their ability to concentrate.
• quickly transformed the concept from a frustrated idea into a functional prototype.

What we learned

• People seek clarity, and sometimes the most basic solution addresses the most complex issue.
• Developing practical tools requires a user-centered approach.
• A significant impact can be achieved by combining small, potent tools (such as AI + clear user interface + speech).

What's next for Notiva

• Support for browser extensions for one-click clean reading
• A personal library to store, arrange, and access saved summaries or articles
• Content-based AI question-answer feature (e.g., "What are the key takeaways?")

Built With

• gemini
• react
• tailwind
• vite