Watch Youtube, Vimeo and Local Videos With Immediate Audio Transcription

Overview of My Submission

I previously introduced Wordleit which is a platform I'm building with tools that would get the best use out of Deepgram's speech recognition services.

Wordleit Streamer is a free online video streamer for Youtube, Vimeo and local mp4 videos supported with Deepgram AI Speech To Text. It's allowing the user to play the video and using a microphone, the user can record the audio coming out from external speakers and then Deepgram is going to live transcribe the audio.

Wordleit Streamer is useful for people who are Deaf, have hard of hearing, or have difficulty processing auditory information.

Table of Content
Built with
Submission Category
Link to Code on GitHub
Link to the tool live demo
Additional Resources and Tutorial

Built with:

• Laravel 9
• VueJS 3
• Tailwind 3
• Deepgram
• Plyr
• Vue Plyr
• Deployed on Heroku

Future improvements:

• Adding translation.
• More formats and sources for videos.
• Allowing the user to stream with Webcams and get immediate live transcription.

Submission Category:

• Accessibility Advocates.

Link to Code on GitHub::

MooseSaeed / wordleit

Wordleit is a free open source markdown text editor that gives you a seamless experience as both a reader and a writer. Supported with AI Speech Recognition.

Welcome To My Wordleit 👋

Wordleit Editor is a free open source markdown text editor that gives you a seamless experience as both a reader and a writer. Supported with AI Speech Recognition. Text to speech - Speech to text - Mp3 to Text.

Wordleit Streamer is a free open source video streamer and online transcriptor tool.

Wordleit Grammy AI Bot AI speaking Bot created to serve your purposes.

🏠 Homepage

✨ Editor Demo

✨ Streamer Demo

✨ Grammy Demo

Hackathon Submissions:

• Wordleit Editor

1- https://dev.to/moose_said/write-articles-with-ai-speech-recognition-and-live-preview-508k

2- https://dev.to/moose_said/use-vocal-commands-to-apply-markdown-to-your-article-99

3- https://dev.to/moose_said/text-editor-with-text-to-speech-and-speech-to-text-4l37

• Wordleit Streamer:

https://dev.to/moose_said/online-video-streamer-and-audio-transcription-2ein

• Wordleit Grammy

https://dev.to/moose_said/add-ai-robot-to-your-portfolio-or-company-website-3045

Author

👤 Mostafa Said

• Website: https://twitter.com/Moose_Said
• Twitter: @Moose_Said
• Github: @MooseSaeed
• LinkedIn: @moosesaid

🤝 Contributing

Contributions, issues and feature requests are welcome!
Feel free to check issues page.

⚙️ Built with:

• Visual Studio Code

• Laravel 9
• VueJS 3
• TailwindCSS

        <ul dir="auto">
            <li>
                <div dir="auto">
                    <a target="_blank" rel="noopener noreferrer nofollow" href="https://avatars.githubusercontent.com/u/17422641?s=200"><img src="https://avatars.githubusercontent.com/u/17422641?s=200" alt="deepgram" width="40" height="40" style="max-width: 100%;"></a>
                    <a href="https://deepgram.com/" rel="nofollow">Deepgram</a>
                </div>
            </li>
            <li>
                <div dir="auto">
                    <a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/23579958/143738613-d374adcf-24b8-4f44-8e75-673d5681c1a5.png"><img src="https://user-images.githubusercontent.com/23579958/143738613-d374adcf-24b8-4f44-8e75-673d5681c1a5.png" alt="plyr" height="20" style="max-width: 100%;"></a>
                    <a href="https://github.com/redxtech/vue-plyr">Plyr Vue</a>
                </div>
            </li>
            <li>
                <div dir="auto">
                    <a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/881b3d162f1a3fdb13e9c8507afe5f40be73e59b6c4b907901e06a1ccd7f70df/68747470733a2f2f6d61726b65642e6a732e6f72672f696d672f6c6f676f2d626c61636b2e737667"><img src="https://camo.githubusercontent.com/881b3d162f1a3fdb13e9c8507afe5f40be73e59b6c4b907901e06a1ccd7f70df/68747470733a2f2f6d61726b65642e6a732e6f72672f696d672f6c6f676f2d626c61636b2e737667" alt="deepgram" width="40" height="40" data-canonical-src="https://marked.js.org/img/logo-black.svg" style="max-width: 100%;"></a>
                    <a href="https://marked.js.org/" rel="nofollow">MarkedJS</a>
                </div>
            </li>
            <li>
                <div dir="auto">
                    <a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/61d22c54c2d885e3364693b3a15d0a8d17d7f4294f14ff41622fdd64373b10b0/68747470733a2f2f692e6962622e636f2f534b564a526e732f616e696d6174656373732e706e67"><img src="https://camo.githubusercontent.com/61d22c54c2d885e3364693b3a15d0a8d17d7f4294f14ff41622fdd64373b10b0/68747470733a2f2f692e6962622e636f2f534b564a526e732f616e696d6174656373732e706e67" alt="animatecss" width="40" height="40" data-canonical-src="https://i.ibb.co/SKVJRns/animatecss.png" style="max-width: 100%;"></a>
                    <a href="https://animate.style/" rel="nofollow">AnimateCSS</a>
                </div>
            </li>
        </ul>

Show your support

Give a ⭐️ if this project helped you!

…

View on GitHub

Link to the tool live demo:

https://wordleit.herokuapp.com/streamer

Additional Resources / Info:

Small demo to show you how it works:

Thanks for checking this out and stay tuned for my next updates on this 😍 Please let me know what you think below :)