Following the first significant release for theCourseForum in about 2 years, we wanted to share a behind the scenes look at the recent changes. In the past two months we've gotten a lot accomplished. We've redesigned course browsing and the course page. We've also released a new schedule generator which generates, saves, and exports your calendar for you. Lastly, we've almost completed a new textbook exchange which will be released in the next couple weeks.
We had an awesome team assembled during the past few weeks to implement these changes and get them pushed to the live site. We were building on a beta site that the whole CourseForum team contributed to throughout the last year, so we had plenty to work with. Below, the summer team runs through their contributions to the new update.
Alan, Atallah, Lawrence, and Kienan working on release night (Mario was there in spirit)
Redesigning the Course Page and Browsing
Since joining theCourseForum, I always found it funny that we had all this data, yet many of our interfaces were still simple lists. With this redesign, my goal was to bring more data into the interface while retaining a clean, streamlined experience. Users shoud be able to tell whether we have data for a course without having to click all the way through to the section page. Additionally, the data should be displayed in a visual manner which is elegant and easy to understand. With these goals in mind, I started off sketching different layouts for the pages.
I focused on the course page first, trying to figure out the best way to display and arrange the ratings, textbooks, and reviews. It was my first time trying to design UI elements, so my initial sketches and mockups were rather sparse and simplistic. I changed my mind a lot - often finishing a full mockup before discovering a layout that worked better. Even as I started implementing the designs, I did a lot of tweaking when I realized some ideas didn't work as well as I imagined. Many thanks to Mario and Atallah for bearing with me through all the changes.
In the end, I arrived at a course page that is (hopefully) significantly more visual and interactive. The stats section displays a more contextual rating breakdown and hovering over the gradewheel gives you the percentages for each grade. You can then flip through the carousel of textbook cards and follow the Amazon links for further browsing. Finally, the more prominent voting buttons increase the significance of voting and interacting with other users' reviews. Also don't forget to use the save course button at the top so that you can easy access your courses in the scheduler! I hope that these improvements lead to a more enjoyable and useful course page.
For the course and professor listings, we originally wanted to implement expandable accordians for each item. We considered flattening out the grade wheel along the bottom and including that in the expanded view. However, while implementing that option, I realized there was too much going on. The user was required to click multiple times to proceed to the next page and the grades bar seemed unnecessary. In trying to simplify everything, I ended up with the final course and professor card designs.
The course and professor name blocks act as the buttons that progress the user to the next page. The user can see an overview of the rating and gpa data as well as the last time the class was offered or the professor taught. If a course or professor has no data, it will be readily apparent, saving the user from clicking through all the way to the course page.
I also added a time filter in the upper right corner. Previously, there hadn't been any indication for when a course was being offered. We now automatically filter out all classes that aren't offered for the upcoming semester. If you'd like to see all classes that have ever been offered, it's just a matter of switching the filter to all. This should make planning for the upcoming semester significantly more streamlined.
Designing the new pages was a really fun experience for me and I really hope that you all find them more useful and appealing. They're certainly not perfect, but I hope they provide an improvement upon the previous version. I'm currently working on ways to improve navigation so that, among other things, you can get around without using your browser's back button. In addition, I'll be working on other pages such as search and a "My Courses" page, all the while making use of our data to provide a richer user experience.
This feature has been a long time coming, an idea in the team’s backlog for many a semester. Its long-awaited release has made this moment all the more satisfying, but it did not come easy. The first stab towards implementing it was taken over a year ago by Nicholas Bergh at UVA’s first hackathon. This initial step gave us a partly working version that continued to be nurtured by all parts of the team until it became what it is today. A young and fresh deliverable beta version.
Throughout its development we saw several scheduler generators made by other UVA students come and go. We realized that for ours to be useable and loved it had to be (nearly) perfect. Although we went through several working versions ourselves, we wanted the user experience to be pleasant and we wanted the integration with the rest of our site to be seamless. It wasn’t without relentless discussion and dedication that we felt confident in delivering. We wanted theCourseForum to even further become a vital part of the course scheduling process.
One piece that I put a lot of my soul into was generating with options. Realizing that generating all possible schedules could be a little overwhelming. There are more factors that come into play. If time for lunch is important to a student, then we should help them find it. If getting up early is actually an act of self-harm, theCourseForum can help! If one wants a Thirsty Thursday, who are we to stop them?
It is the latter of these three that led to the favorite line of code I've ever written:
if params[:thirst] == 'true'
With all of this, the scheduler feature still didn't qualify to be out of beta. In fact, changes were being made to it just minutes before we released. There are a few UI issues that hold it back, which is why we are putting it in the hands of the users. We welcome any feedback you have for us. Don't hesitate to let us know what can be improved! There's still a lot of work to be done and I look forward to seeing the scheduler become a very powerful and slick tool.
Putting It All Together
One of my jobs was to make sure the new site was compatible with the old database. There were a few tables in our MySQL that had to be dropped and a few new ones to be created. I logged all these differences in a special file named db_changes.sql. When run, this file would transform the old database into a compatible one.
The final step in our launch was running db_changes.sql on our master database. But, I had worked on this early in the summer, meaning much of my efforts were in an outdated context. By August 1st, some of our changes caused conflicts with the scripts. The process took a little longer than expected, but early that morning, we finally pushed to live.
Lawrence is finishing up work on a textbook exchange feature that we'll be releasing in the next couple weeks in time for classes. It's looking seriously awesome and I can't wait to use it. Stay tuned for more information on the exchange and other future updates!