The Problem
We received feedback regularly and directly from clients that they want to see their academic and events calendar in one calendar.
The Schedule platform had a very roughly framed in-calendar experience that was added into the solution to meet a RFP requirement. The feature had not been cared for in several years and no feedback had been gathered on it in order to assess its usability. We inherited the Events platform from a third party. It also had a calendar and was a heavily used feature of the solution. There were lots of improvements that needed to be made to it in order to keep up with the demand of more clients using and finding issues.
Originally, this work was slated for Q3/Q4, but the business made a large pivot to start investing in a unified platform between our Academics and our Events platforms at the beginning of the year. Based on knowing how much our Event users relied on the calendar and needed improvements in their views, it was determined that my team would take on the work to unify the experience between the two solutions.
The Results:
Schedule clients immediate positive reaction and adoption to using the new calendar (37% in the first 3 weeks)
Events clients starting to use new calendar on the Academics side to help slowly beginning the transition to merging into the platform
Improved usability for both academics and event users with updated look and feel, new views of their information
New Weekly Grid by Room View immediate adoption by 62% of event users in the new platform
How we got here:
This was an excellent time to leverage the use of AI with iterating on improvements to be made. I used Claude to look at our current calendar and suggest quick UI improvements to be made. Here were the initial feedback about improvements:
1. Department color coding — assign each department a distinct color family (blue, purple, teal, amber…) so users scan by subject, not by reading truncated text
2. Conflict highlighting — flag overlapping blocks in red with a global conflict counter in the toolbar
3. Rich hover tooltip — show full course name, room, instructor, time, and enrollment on hover instead of truncated 4-character block labels
4. Named filter panel — replace "Quick Filters" with explicit filters for department, days of week, and time of day; show a live result count as filters are applied
5. Legend-as-filter chips — put department chips above the calendar so a single click toggles visibility; doubles as the color legend
1. The color coding improvement and hover tool tip were obvious first things to knock out with enhancing the calendar. I took some time to look at both calendars to evaluate shared views and what might be needed for each individually.
After a few iterations to look at styling and trying to keep the calendar look familiar to the alert pattern in our academic platform we discussed the issue of two color palettes for each platform. I needed to make styling decisions about what we would do now and what things we would push off to another time to enhance.
Decided that the first iteration would inherit the Event color palette would be used for all events, academic events would all have the same blue color. Future enhancements would be for users to change colors on academics (by subject, category, etc) but needed to be tested for impact, business need for it then was very low. A future change after successfully implementing the calendar would be to change all Event colors over to the Academics colors.
2. The conflict feedback provided by Claude was interesting to see suggested. How an institution has their calendars set up, they want to see a high level view of the day, week or event month depending on the use case. There is almost always overlap with several classes meeting at the same time, events on campus. The conflict highlight would mean almost all events would be highlighted with that so we did not consider that suggestion.
3. Tooltips and the information provided was high on the list of bridging the gap between a view only calendar and a fully editable calendar. We needed these tooltips to provide enough quick information for a user to know some basic information about the event with a preview, but know the next iteration would be to provide details to make it editable.
4. & 5. We had made filter improvements to the overall platform but this feedback was good to have in mind as we continued to strength test the filtering in all different aspects, especially in this new calendar.
Design + Iterate:
We were leveraging MobiScroll for both calendars and kept Mobiscroll for the unified calendar. The engineer I worked with was very comfortable making quick changes based on feedback to be able to test what we were working with - we needed to work on some transparency issues since using an opacity of a color for gradients and in views.
The visual enhancements were just the first step of implementing a new calendar. We couldn’t stop with just these changes. We need to have a details panel about each Event and Academic Event on the calendar for a user to be able to get the information they need and make changes from this calendar view. We knew this was how 80% of Events users managed their events and needed to push the centralized calendar from a view only source to an interactive and editable tool for users to be able to leverage
Outcome:
What had been a visually hard to read calendar experience quickly became the cornerstone for demoing how the two solutions, academics and events would eventually live side by side. Once the calendar was released we worked closely with our client solution engineer to quickly put together a talk track for how to show this new work off to current clients who were hesitant to migrate as well as prospective clients for where we were heading.
Leveraging AI at the beginning of the process to help move quickly through what to knock out as well as where to make improvements was critical for being able to accomplish these changes in a short time frame.
