In many of our own lectures, professors ask students to indicate if they are following along (e.g., hand raising, and thumbs up/down reactions, one professor even said clap if you’re confused). We asked around, and students, including ourselves, often opt out of these reactions in-class to prevent looking like, in front of the whole class, that we’re the only ones not understanding the material. In turn, professors do not get an accurate overview of students’ understanding, harming both the professor and students. We want to make learning more productive through convenient and instantaneous feedback. We know people need what we’re making because we want to use this ourselves and have heard professors eager to gain student feedback during the lectures multiple times.

What it does

We are creating software that allows professors to gain real-time feedback on the pace and clarity of their lectures.

During lectures, students can anonymously indicate they are confused, speed of the lecture, and ask and upvote questions at any point. The feedback is instantaneously communicated to the professor anonymously.

On the professor’s side, as more students click on the confused button, a small circle floating on the professor’s screen will turn red to alert the professor to re-explain a concept in real-time. If no one is confused, the circle remains green.

If the professor wants more information, he/she can hover over the circle to expand the window. The window includes student data on preferred lecture speed, percent of people confused, and top student questions. Professors can clear the question bank when they click on the clear button. Confusion and speed reactions will be cleared every 30 seconds automatically.

How we built it

We used ElectronJS to build a cross-platform desktop client for both the professor and the student. In ElectronJS, we used HTML, CSS, and JavaScript to build a frontend as well as asynchronous techniques (using the electron ipcRenderer) to communicate between different processes. By leveraging special functions in ElectronJS, we’re able to produce a frameless, non-resizable, yet draggable floating window (that remains present even in a fullscreen) that perfectly achieves the behavior we intend for the floating indicator.

We used Firebase as a backend, leveraging the Firestore NoSQL database as a way to communicate the students’ engagement and feedback on the material, anonymously, with the professor. Implementation of snapshot listeners on both the student and professor clients allows for real-time feedback and achieves our value proposition of seamless feedback.

Challenges we ran into

While designing the interface for the professor, we really wanted to be certain to make it as simple as possible while still providing essential information about student sentiment. As such, we found it challenging to design a UI that fulfilled these requirements without disrupting the professor’s lecture. Ultimately, we created a small, circular floating icon that can be moved throughout the screen. The icon changes color depending on students' reported confusion and lecture speed.

Another design challenge that we faced was whether or not to incorporate a “speed up” request button for the students. We felt conflicted that this button may be rarely used, but if it were used it would offer a lot of benefits. Ultimately we decided to incorporate this feature because the increase in UI complexity was minimal compared to the benefit it provided. This is because if a lecture is going too slow, it can actually increase student confusion because the points may seem disconnected.

Accomplishments that we're proud of

We’re proud of narrowing down our scope to create a solution that solves a specific problem in the University track. VibeCheck effectively solves the problem that professors cannot gauge student understanding in lectures.

What we learned

We learned how to work as a team, and bounce ideas off each other. For design, wireframes, and pitch deck, we brushed up on Figma and learned how to use some of their new features.

In order to build our software, we learned how to use HTML, CSS, and JavaScript in a lightweight and scalable way as we built VibeCheck. We also learned how to use ElectronJS to realize the value proposition (e.g., seamless, non-disruptive, immediate feedback) we’ve envisioned. We also learned how to integrate Firebase with ElectronJS (given that this integration is not officially supported), learned how to use the NoSQL database structure of FireStore, and use its real-time database features to achieve real-time feedback (another one of our value propositions) between the student and the professor. Coming from a background of iOS app development with Swift, our developer really enjoyed learning how to use web-dev languages and platforms to create VibeCheck.

What's next for VibeCheck

The next feature we want to implement is to allow professors to monitor the progress of the class and potentially reach out to students who, based on the statistics tracked by our platform, indicate they struggled with the class material (whose identity is hidden from the professor unless they otherwise consent). Additionally, this data can be played back during lecture recordings so that viewers can identify parts of the lecture requiring careful attention.

*Github repo is not runnable because Google Cloud credentials are removed.

Share this project: