EdTok [Advanced]

EdTok is an intuitive platform for students and teachers alike. It revolutionizes learning with short videos and quizzes designed by educators, presented in a familiar format for modern students.

Comment

Project Name: EdTok

Elevator Pitch: EdTok is an intuitive platform for students and teachers alike. It revolutionizes learning with short videos and quizzes designed by educators, presented in a familiar format for modern students.

About the project:

Inspiration

In today's fast-paced digital age, short-form content has become increasingly popular, especially among younger audiences. Platforms like TikTok, Instagram’s reels, and YouTube’s shorts have shown how engaging these bite-sized videos can be. We were inspired to utilize this engagement for educational purposes by creating a platform where teachers can share concise and impactful lessons to quickly convey useful information to their students in a familiar manner.

What It Does

EdTok allows teachers to upload short-form educational videos organized into separate classes, subjects, and courses, and then follow their video series with quizzes to test students’ understanding. We compressed the videos with our own custom algorithm to ensure teachers are not severely limited or blocked by paywalls in what they can upload, in an attempt to give them the tools to teach students to the best of their abilities. When students access the platform, the videos are presented in a TikTok-like format, providing an engaging and familiar user experience.

How we built it

We built our frontend using HTML-CSS-Javascript techniques with the React.js library to provide a dynamic user interface that mimics the TikTok-like video scrolling experience. We used React-player to create a video player, Google Fonts to select our font-family, and react-router-dom to Link our websites. In our backend, which is made on the flask framework, we used Python’s moviepy and ffmpeg libraries to load and manipulate video and audio files, along with implementing a complete authentication api with access tokens for security. We then converted the video files to numpy arrays and ran various compression algorithms using cv2. Then we later decompressed the videos by reversing the operations, and recombined the video and audio files with moviepy and ffmpeg.

Challenges we ran into

Building EdTok within the hackathon time frame presented several challenges:

  • Video Compression: Developing a fast compression algorithm that maintains video quality while reducing file size was a complex task that required extensive testing and optimization.
  • UI/UX: Designing an intuitive and engaging user interface that resonates with students and teachers alike required multiple iterations and feedback sessions.
    • Frontend Building Once we had completed our design, converting it into code was our next hurdle. Turning one Figma frame into html, css and javascript (or to be specific, jsx), took hours just to get all the details right
  • Integration: Ensuring smooth integration between the frontend and backend was crucial to providing a seamless user experience.
  • Time Constraints: Managing our time effectively to balance feature development, debugging, and testing was a constant challenge throughout the project. ## Accomplishments that we're proud of We are proud of creating an engaging and user-friendly interface that makes learning fun and accessible, implementing a robust backend infrastructure capable of handling video uploads and quiz interactions seamlessly, and successfully designing a basic video compression algorithm that preserves quality all within the given time limit. ## What we learned Throughout this hackathon, we learned a lot about what it takes to develop an educational platform. Among which are the following:
  • User Engagement: The importance of keeping students engaged with familiar and interactive content
  • Video Compression: Various compression techniques like downsampling and how to apply them to videos
  • Backend Development: The importance of a robust and scalable backend to handle functionalities.
  • Collaboration: The significance of teamwork and communication in bringing a project to life, as well as utilizing each of our unique tablets to make this project come to life ## What's next for EdTok We would like to include automated checks on the videos that are uploaded to ensure that they are educational and truthful. We could do this by cross-referencing the content with established knowledge, maybe by extracting the audio with speech to text techniques and getting it fact checked by an AI like chat-GPT. We would also like to ensure that students can even more easily find the type of content they need, which would involve a more robust search engine that time did not allow for in this project. All in all though, we hope to continue to grow our platform, and spread it to teachers and students alike to allow as many people as possible to benefit from our work.

Built With

Share this project:

Updates