Inspiration
As an undergraduate student who has experienced all levels of education through school, I took the initiative to create an app interface that could help students of all ages to practice and expand their skill sets through an online platform. Throughout my experiences in school, I found many technical applications to be helpful to myself and my peers especially during the COVID-19 pandemic. I was not able to collaborate with others through these applications as much as I wanted to. Due to this, I was inspired to create an application that allows students to network with other students in various subject areas, challenge each other to friendly quizzes, join study chat rooms and manage their workload effectively. To support and promote learning, I decided to create Quizler. Through Quizler, students can study independently or with their classmates as well as explore other students’ ideas and resources, promoting collaborative skills and an enjoyable way to study.
What it does
Quizler provides students with many ways of enhancing their learning and attentiveness. Students have the ability to follow other students and share their school-related posts with one another. There is also a chat system for communication purposes. The main benefit of Quizler is that it provides free quizzes and questions to students based on their course or subject of choice. Students can also challenge each other in quizzes over meetings, which provides a social and enjoyable aspect. In addition, they can join chat rooms and collaborate on different topics to study together for a quiz or test, sort of like a virtual study room! Finally, students can improve and maintain their time management skills through the to-do list page. Time management and keeping track of assigned work and deadlines are essential for students’ success.
How we built it
Quizler had two main components in order to create it. Firstly, Figma was used to create the overall appearance and prototype using the graphics and prototyping tools. JavaScript and HTML & CSS were used for the chat room I created, which is open to all users registered on Quizler app. To create the database system for the Chat Room, the Node.js and Express.js libraries were implemented.
Challenges we ran into
As I am not extremely advanced and familiar with Figma, I ran into various challenges and was unable to figure out specific features for a long period of time. This required thorough research and troubleshooting. For example, a specific issue was bringing text and shapes to the front on top of other objects, but researching ways to resolve the issue helped me overcome this challenge. Additionally, I only knew some basics of JavaScript and HTML & CSS initially with this project. This led to many instances where I got confused and did not understand how to continue with the code. Once again, this took troubleshooting and research. For instance, some of my code did not run since the Node.js and Express.js libraries were not properly installed within my workspace. To resolve this issue, I had to research alternative ways to download the libraries using the terminal command prompt.
Accomplishments that we're proud of
I am proud of creating a successful code for the chat room using JavaScript and implementing the GUI using HTML & CSS as well as prototyping the app on Figma. At first, I was nervous about using these applications, but going out of my comfort zone allowed me to build a successful project. I also wish to expand my knowledge using these languages in the future and this project allowed me to experience these applications thoroughly.
What we learned
From a technical standpoint, I learned how to use JavaScript, HTML & CSS, which will be beneficial for future projects and courses that I will take. For the best possible outcome, I tried my best to learn as much as possible by watching Youtube videos and researching online. I have used Figma before in a club and I used some of my skills for this project. Through the challenges I faced, I learned new features and tricks in Figma.
What's next for Quizler
Due to the time constraint, I was not able to code every single component of the app so for the future, I aim to further use JavaScript and HTML & CSS to create the remaining components for Quizler and hopefully put the app to use in real-life.
Log in or sign up for Devpost to join the conversation.