While we were back in school, before the COVID-19 pandemic, there was one prominent problem in our classes. While many platforms existed for teacher-to-student and student-to-teacher communication, there was nowhere for students to communicate with each other and help each other out. In fact, some of our classmates tried to solve this problem by creating group chats for classes on apps like Instagram and Snapchat. However, a large concern with such a solution is that these social media apps are inherently distracting, we didn't join these group chats myself because we were concerned that they would be detrimental to my education; chats were often going off-topic, or even inappropriate content being posted.

A platform encouraging classmates to help each other out would greatly enrich the learning experience for everyone. As schools began to close down due to COVID-19, this problem became even more pertinent as it prevented struggling students from getting the help they needed through after-school study sessions, peer tutoring sessions, and the like. Even though these meet-ups might still be possible, they are a lot harder to organize and execute, causing many struggling students to be left with insufficient help and few ways to get it.

What it does

To solve these issues, we created DigiClass, a platform that encourages student-to-student interaction in an optimal and incentivizing manner. Currently, there are three main parts to DigiClass, a discussion page, a question page, and a room page. In the discussion page, students can discuss with one another in real-time for short and simple things, such as the textbook pages for homework, or if there was a test the next day. For more detailed questions relating to the current subject or lesson, students would use the questions panel. It's based on a similar system to StackExchange, where students can ask questions and the most upvoted ones bubble to the top. This way, teachers and other students are able to get a good overview of the most common questions about a certain subject or lesson, and instead of the inefficient method of having the teacher answer every student's question separately through email, every student can benefit from this question page and teachers also don't need to repeatedly answer individual questions.

In addition, we understand that teachers don't always have enough time or resources to help every student and answer every question. That's why we made it possible for students to also answer one another's questions. Answers to questions can also be upvoted, and each question can also be approved by the teacher for official confirmation. This way, instead of teachers spending their time writing out answers to every question, their workload is now reduced to simply reviewing the answers and correcting them as necessary. By answering other students' questions, students can gain "reputation", which can be used to give them higher priorities in other features for the app. For example, when students send teachers private questions or messages, instead of being sorted by the time sent, they are instead sorted based on the reputation of the students. This way, students will have an incentive to gain reputation as they will be able to receive quicker and more prioritized responses from teachers to their questions and emails.

The last page is a room page, where students can connect with one another through video chat. Instead of forcing students to download other distracting applications such as Instagram or Discord for video calling, Digiclass comes with a video call feature for students to directly connect to one another. This video calling feature can be used in a variety of ways, ranging from one-on-one help, a quiet virtual study session, or as a place to communicate with one another about their results for a quiz or a test, This page also provides more than just a place to video chat, as it also provides integrations with other educational apps. Here, you can see that we've integrated with Tabulo, a digital whiteboard that greatly facilitates visual teaching, as you can draw from your phone onto the computer instead of struggling with a mouse. We made it so that when you upload a picture through DigiClass and open it via Tabulo, it will automatically create a room for you with the picture you used in the background so that you can immediately share your room with others and start helping or receiving help with minimal friction. This could be helpful in a variety of situations—not just when you have a worksheet that you need help on. By using this integration, you can allow others to write on the same worksheet as you, so they can correct your steps and also write out the correct steps in real-time.

DigiClass also features a mobile application so that you won't miss a message, and can chat with friends on the go.

How we built it

We used a lot of different technologies to turn DigiClass into reality. The front-end of the application is built with Vue.js and Quasar Framework, which gives the app a standard and beautiful layout with Material Design. The backend server is a Node.js server using Express and uses PostgreSQL for accounts, and Redis and for real-time publishing and subscriptions to the client. The video calling feature is built with WebRTC, PeerJS and vanilla JavaScript.

Challenges we ran into

As we were using somewhat uncommon technologies, we had to install PostgreSQL and Redis, which wasn't as easy as we expected, especially on Windows. We spent a lot of time debugging and tracking down errors related to the installation of these tools. In addition, a lot of these technologies were new, such as WebRTC and the combination of Redis +, and so we spent a lot more time debugging these unfamiliar and uncommon bugs we were encountering.

Accomplishments that we're proud of

As we started approaching the submission deadline, we began to pick up the pace and development was quickly underway. However, as we sped up the process, many more bugs came up and cross-OS compatibility was becoming more and more of an issue. Thankfully, we were able to solve them very quickly due to our experience of working with previous bugs and being able to resolve them quickly. We are also proud of how we were able to troubleshoot, integrate and learn so many different tools in such a short amount of time.

What's next for DigiClass

Of course, as all of this was built in only 36 hours, we believe that DigiClass has a ton of potential in the future to be a standard app in all virtual and physical classrooms, as it can unlock the hidden value in providing an easily accessible platform for students to assist one another.

Share this project: