Inspiration
There are many factors that a student considers when choosing a class. UBC Hover Grades is a way to quickly determine statistical historical grade information quickly and easily when searching for classes.
The Problem: When students choose classes, they often choose based on the course summary alone, which can be as brief as a few sentences. Considering that a student is spending upwards of $500 for a class, it's important to be as informed as possible when making course decisions.
Knowing statistical grade information provides insight for a student in many ways. Maybe a class has a notorious reputation for being extremely challenging; however, if the class has a pass rate is high, a student need not be afraid of failure and can graduate on schedule, while taking a challenging class that is in line with their interests!
On the other hand, if a class has a high rate of failure, the student can mentally prepare themselves for the rigours of the class and potentially achieve a higher grade as a result.
What it does
The Solution: We want to create a tool that provides a frictionless solution towards seeing historical grade information for a class.
On UBC's course selection page, simply hover over a course hyperlink and the historical grade information, if available, will be displayed. The student can see fields such as the average, high, low and pass rate.
How we built it
We leveraged a beautiful API created by Donny Fan for course grade information. This allowed us to work on developing the Chrome Extension that would modify UBC course selection websites to show the grades data provided by the API.
We used similar projects such as Check My Prof for inspiration on the UX for the project. We used the Google Chrome Extension docs to understand what APIs would be useful for the project. To keep the project light, we did not use any well-known Javascript libraries.
Challenges we ran into
Tooltips are very challenging, especially in the context of a chrome extension where reliance on a framework isn't possible. We tried to leverage a framework such as React in some way, but it ended up being a hindrance. React only works with code that is fully controlled by the developer. Because chrome extensions seek to modify existing applications in many cases, vanilla JS is the way to go!
Accomplishments that we're proud of
Using the Chrome Extension API was really fun! We're really impressed with how simple and accessible chrome extensions are. This is the first time we worked on chrome extensions and it's really exciting so have a completed project at the end of it. Also, we're thrilled with the end result as we spent quite a long time scouring course information once we had our MVP complete.
What's next for UBC Hover Grades
We will publish this extension to the Chrome Web Store and advertise it to the UBC student body. We can't wait to get this extension in the hands of UBC students!
The next feature is to show historical course grade information for a specific professor of a particular course. Two courses that are the same on paper with different instructors often feel like different courses entirely; the grades information should reflect those offerings as being separate.
Acknowledgements
The cursor free icon used in our Devpost's thumbnail was made by Vitaly Gorbachev from www.flaticon.com
Log in or sign up for Devpost to join the conversation.