Meet the Frames

Tired being stuck in front of a Google Meet screen all day for online classes? Here's a fun solution to make the pandemic learning all the better , especially for the younger students.

Comment

Meet the Frames

Team MtF's entry for Tech Together NewYork Hackathon 2020

Team Members: Niveditha N, Avnit, Melody, Mansi Saini, Stacy and Ekam Gupta

Idea

How do educators keep the youngest students engaged and interested in learning in the midst of a worldwide pandemic? Our extension is created to keep these students engaged by making distance learning more easily accessible and fun for them.

Inspiration

As the pandemic takes its toll on our everyday lives, the effects on students are most noticeable. While for older students sitting in front of the computer for long lectures might not be a big deal, for the younger students without an element of entertainment that is engaging it is much harder to stay focused. That's where Mansi came up with the idea to create a Chrome extension for Google Meet designed to provide that element.

Source: https://www.nytimes.com/2020/06/05/us/coronavirus-education-lost-learning.html

Topics Covered

  • Education
  • Self Care and self-reward
  • Entertainment

What Should the Extension Be Able To Do?

  • On completion this Extension will work with Google Meet to empower Educators to create incentives for their students to engage with learning in a way that is entertaining as it teaches.
  • Educators are given the ability to load quiz questions that will pop up at intervals throughout the lesson. Students will be rewarded with points for correct answers.
  • As they accumulate points, the students are able to choose custom backgrounds to add. Students also get special birthday backgrounds on their birthday.

How much we could achieve in 48 hours?

  • Design a UI prototype and logo in Figma of the extension
  • Build HTML & CSS frameworks
  • Majority of JS written and implemented

How we built it

  • Figma for the UI design
  • HTML and CSS for form entry
  • JavaScript for managing user data via local storage.
  • Used git and github for collaboration
  • We managed team communications through Discord, including using webhooks to monitor GitHub commits and branches.

Challenges we ran into

  • Getting everything done on time!
  • Collaborating with teammates in four different time zones.
  • It was difficult making the right amount of confetti particles to fill up a page in JavaScript and getting them to move/rotate in a falling motion.
  • Integrating the JavaScript files to work within the extension.
  • Debugging the JavaScript files.
  • fixing and building .json files.

Accomplishments that we're proud of

  • The UI turned out really nice. We are pretty new to most of the frameworks we are using, so it is satisfying to get our code to work as intended!
  • Our team coordinated and worked well together in spite of the major differences in our time zones that included PST, CST, EST, and IST.
  • Most of us are not experienced programmers, we could still implement the project.

What we learned

  • How to integrate several different platforms and frameworks to create one product
  • How to work in a team while all in different locations and time zones
  • Some of us are using GitHub for the first time in a team setting, so using pull requests and code review is a new skill.
  • We could improve our web development skills.

What's next for Meet The Frames ?

  • Completing the milestones we couldn't complete in 48 hours including:
    • Completing the leaderboard functionality
  • Adding more custom backgrounds
  • Adding additional perks to the points system
  • Integrating project other online video-call teaching platforms like zoom.
Share this project:

Updates