OVERVIEW
I created this interactive visualization to explore U.S. college data in a way that feels intuitive and meaningful. The dataset included everything from SAT scores and admission rates to cost, income, and student demographics. I wanted to design a tool that didn’t just show the data, but also it help users understand it.
Using a mix of JavaScript, HTML, CSS, and Tableau, I built a visual experience that makes it easy to spot patterns, compare schools, and dive into the details that matter most, whether that’s affordability, diversity, or outcomes after graduation.
KEY TOPICS
Data Visualization,
Interactive Filtering
Front-End Development
UI/UX for Data
Features &
Interaction Design
The x-axis is customizable, allowing users to explore different aspects of college data such as SAT scores, ACT median, school cost, student population, faculty salary, and average family income. A filtering tool lets users select and compare specific variables, making the visualization interactive and tailored to individual interests.
The visualization allows users to switch the x-axis to compare different aspects of college data. In the example below, the x-axis has been changed from SAT Average to Admission Rate. As a result, the graph dynamically updates to reflect this shift, offering a new perspective on how admission selectivity relates to post-graduate earnings.
Each data point in the graph is visually coded by school type:
Solid circles represent public schools
Outlined circles represent private schools
This distinction is key when analyzing factors like cost, average family income, or student outcomes, which often vary significantly between public and private institutions.
Users can filter by private and public institutions, making it easier to focus on trends.
Users can also compare colleges by geographic region. This is particularly helpful when researching options within a specific part of the country.
In this filtered view, only colleges located in the Southeast region are displayed. This allows users to dive deeper into regional patterns and economic outcomes.
When hovering over any data point, a tooltip appears showing key details about the selected school. In this example, the user hovers over California Maritime Academy, and the tooltip displays its Admission Rate (x-axis) and Mean Earnings 8 Years After Entry (y-axis), corresponding to the current axis settings.
Beyond hover, clicking a data point reveals an in-depth profile of the selected university. For instance, when Georgia Tech is clicked, a panel opens with detailed stats like region, control type, median debt, and a pie chart of racial demographics—offering a fuller picture of the school.
In this example, the axes have been changed again. Median Debt is now on the y-axis. The tooltip automatically updates to show the new metric values, demonstrating how responsive the tool is to different data configurations.
The visualization is designed to support both high-level pattern discovery and deep dives into specific schools.
At a glance, users can spot trends such as:
Which colleges have higher earnings outcomes
SAT or ACT score distributions
Which schools don’t require standardized test scores (e.g. those showing a score of 0)
These outliers can often tell a story, like identifying schools that are test-optional in their admissions.
One notable trend the visualization reveals: Public colleges generally have lower costs than private institutions. With the filters and axis controls, users can easily validate these patterns across different schools and regions.
Learnings
This project pushed me to think beyond just making things “work.” I had to consider how people explore and understand complex data, what makes something intuitive, what slows people down, and how to surface meaningful patterns without overwhelming the user. I got to exercise my front-end skills with JavaScript, HTML, and CSS, but more importantly, I learned how to translate raw data into an experience that invites curiosity. Seeing how a few thoughtful filters or interactions could completely change what someone notices in the data was one of the most rewarding parts.
