Data Platform
In the age of data, universities have many opportunities to leverage information pertaining to their operations, such as their students, funding, and budgets. However, finding the most relevant data, determining the correct course of action, and preventing siloed information are common challenges across any organization. I designed data visualizations and numerous features for a university’s web app, which aggregates data into a dashboard. My goal was to display the data in a digestible, intuitive manner to empower administrators and principal investigators to make informed, data-driven decisions, monitor their projects at the click of a button, and improve communication across departments.
Design Values
I defined the following design values to create a focused and effective user experience:
Data Visualizations
Admissions
Upon interviewing key stakeholders who were incidentally also our target users, we discovered that one of their top priorities was to gain insights on how to attract competitive students throughout their admissions process. Based on their needs, I created a storyboard to communicate and validate my concept for an animated visualization that shows the number of students flowing through each stage of the admissions process at any given point in time, with customizable data category groupings and filters.
Once the concept was approved, I jumped into the design process, which I continuously validated with our users as they came to fruition. User feedback provided numerous insights, such as breaking down cohorts beyond the academic school year to academic semesters and making key metrics such as total applications, acceptance rate, total acceptances, yield rate, and total confirmations readily accessible. I also applied the concept of layers to the visualization, so the admissions staff could quickly see the academic data they prioritized most highly by hovering over each stage of the admissions process, and click a bubble to access additional data.
I also included a comparison feature which allows administrators to view their selected cohort’s data alongside data from the previous year. Usability tests revealed that it was unclear whether the filters selected within the sidebar were applied within the secondary data visualizations, so I displayed which filters were applied above the data. I also incorporated key insights into each visualization, so the users would intuitively know what the data meant at a glance.
Although data categories differed for the geographic data, I maintained the same design schema so the administrators would intuitively know how it worked based on the primary visualization. To avoid overwhelming the users and provide them with the big picture upon opening the visualization, I provided a zoomed out, full view of the geographical data when the page initially loads. From there, the users could zoom in and out down to the city level, and hover over regions to view the data at their own leisure.
Finances
Financial data and timelines are crucial for principal investigators and financial administrators to stay on budget and successfully manage their projects. In order to configure the data accurately and in a manner that matched the users’ mental models, I created a data map to define the hierarchical structure.
I ensured that users could effortlessly see whether an award’s balance was positive or negative by color coding them blue and orange to accommodate red/green color blindness. I also incorporated approval forms into the timeline because they were a necessary step to conduct research, but visually distinguished them from the awards, as they did not contain a negative or positive balance. The filters allow users to focus on either of these data types. In addition, I marked important dates on the timeline for the user’s reference, such as “today” and the dates that approval forms were due. For the budget visualization, I maintained the same color scheme for the purpose of recognizability, and displayed the total project budget in tandem with the remaining balance so the user would have a reference of what proportion of the budget had been spent.
UI Design
The UI design of the dashboard that housed the above data visualizations was just as significant as the data itself to ensure that users could navigate, share, and interact with the data successfully.
Favorites
Imagine that your job involves navigating a high volume of data day to day, and you need to apply specific filters every time to keep track of the insights you are looking for. Being able to save, or “favorite” the data would save you a massive amount of time, and possibly a few headaches. Since this functionality involves a series of actions, I created flows before jumping into the design to ensure that the steps are intuitive and efficient.
Once the flow was validated, I designed a Favorites screen and made pertinent information such as the applied features highly visible. I also provided the option to name the favorited report for users who valued customizability, but populated the form field with an automatically generated name for users who preferred to save time. Once the report was successfully favorited, I ensured that a confirmation toaster notification would appear to provide peace of mind through instant feedback that the action succeeded.
Help
Incorporating help functionality allowed us to quickly gather data on technical and usability issues, and respond to our users post launch. I incorporated categories of issues to help organize the help tickets for those addressing the issues, and made the remaining character count visible to remove guesswork.
Share Report
Sharing reports allows users to communicate their findings quickly, but security is vital for confidential data. Therefore, I incorporated functionality for the user to make a link private and designate specific users with permissions to view it.
Shared Filters
Users frequently view multiple reports side by side to get a bigger picture. Often, these reports have sorting and filter options in common. In order to prevent users from having to redundantly modify these mechanisms, I added functionality for users to configure them separately or in tandem.
