ISSS608 2016 17 T1 Project Team 3 Report

From Visual Analytics and Applications
Jump to navigation Jump to search

Proposal

Poster

Application

Report

 


Motivation

University ranking is always one consideration for to-be applicants. There is a certain prestige in having a better ranking, and universities generally work towards having better standing. According to Kaggle, "Ranking universities is a difficult, political, and controversial practice."

Through this visual analytics project, we look to analyse the world distribution of these universities, its attributes, rankings over time, and seek to draw insights from them.

This would also help parents, to-be applicants in their research for making informed decision in selecting their dream universities to pursue their higher education. 3 different sets of available university rankings are used in this visualizations. This would serve as an one stop-shop for them, instead of them scurrying about different websites and resources.


Tfm choice.jpg Tfm choice1.jpg



Review and Critic on Past Works

(Alvin)

In the paper by Gratzl, Lex, Gehlenborg, Pfister and Streit, an open source application called LineUp was utilized as an interactive technique for multiple attributes analysis. In this tool users are able to create the rankings of the universities based on their own assessment of the weightage of each attribute to the overall ranking. While this is an interesting way,

https://www.google.com.sg/?gfe_rd=cr&ei=haQ1WMSFD42FogPOyZ7ADA&gws_rd=ssl#q=university+ranking+visualization&start=20



Design Framework

Overview

For this project, we focused on the visualization of the rankings and attributes of three data sources, using a variety of visualization tools namely, Tableau, QlikSense, and d3.js. Individual data source exploration is done through Tableau, and QlikSense to gain insights into each dataset. Tableau is utilized in the creation of topographical visualizations and dashboards. QlikSense also offers dynamic visualizations and support for D3.js extensions.

D3.js offers dynamicity and is an interactive platform for easy access of the visual representations in browser format. The focus is on ensuring all interactive features are available across 3 data sets in D3.js, for ease of comparisons.

Data Source & Data Preparation

Tfmp data.png


These three datasets provide similar, yet individualistic insight in the overall score of each university and its world rank, with multi-year records. Other time-variant attributes of the university are also available.

The Shanghai data does not have the country information available, and hence, time is spent in ensuring that the country information is available. The regions information is also populated for all three datasets as they were not available in the raw dataset.

Data cleaning is conducted to ensure consistency within the data set, especially in the changing names of universities. Ranking is changed to numeric, and recoded where necessary. The CWUR, Shanghai and Times data are prepared in the CSV format, to be read in and parsed in d3.js.

Data from 3 datasets are combined (by university) where needed, for the needful visualization, for comparison.

Tfmp datadict.png


The diagram on the left also depicts the data dictionaries of the 3 datasets.

Their attributes show us the parameters measured, and the respective ranking the universities across the years.









IndicatorTable.PNG

The Table on the left put together the similar indicators from the three ranking systems under each of the criteria (measures). This provides a common baseline when making comparison between these measures from the three data sources.



Design Principles Used

World university rankings are lists of higher education institutions ordered using a combination of indicators. Rankings in the form of numbers and scores are rather hard to comprehend. There is a need to represent data in a more understandable visual format. In this project, we have adopted Shneiderman’s famous mantra as our design guidelines for our visual data analysis. The Mantra, “Overview first, zoom and filter, then details-on demand”, describes how data should be presented so that it is most effective for users.

Overview First
Overview provides a general context for understanding the dataset; it paints a “picture” of the whole data entity that the information visualization represents. It’s the first thing a viewer sees in the dashboard, and guides him / her to other parts of the visualisation for further exploration. For example, choropleth map is used a way to visualize the number of universities over a geographical area. This can show variations across the displayed location at an overview glance.

Zoom and filter
Zooming and filtering both involve reducing the complexity of the data representation by removing extraneous information from view. This involves zooming and filtering the data using the interactive features: filtering, highlighting, drill-down, range selector, etc. For example, zooming may be drilling down from all global to country-specific ranking data while filtering may be excluding information in a specific year range.

Details-on-demand
The details-on-demand can be useful for relating the detailed information by a simple action, such as a mouse-over for a tool-tip details. It should allow user to go all the way to dug to the minute details.

Tools Used & Data Visualisation Elements

Tableau, QlikSense and D3.js are used for visualization, while JMP is used during data preparation.


Tableau Visualisation

CWUR Map.png

Consistently across 3 datasets, the use of choropleth map allows one to look easily where the universities are. Filtering by year, region, country and rank is also possible.

This is the commonality across visualizations of the 3 datasets, and a powerful visualization. From the CWUR system, it shows that a majority of top 100 universities globally are located in United States.




  • CWUR

Lichin

  • SHANGHAI

Christine

  • TIMES

Alvin

Qlik Sense Visualisation

The use of Area Chart, Bar Chart and Table allows one to compare the World Rank based on selection by Year, Country.

The use of Radar Chart, Scatter Plot and Chord Diagram allows one to analyse and comparing the multi-attribute rankings for different Universities.

d3.js

  • Multi-Attributes Relationship

Scatter Plot (Tab: Indicator Analysis)

Line Graph (Tab: Comparison Analysis)

Parallel Coordinates Plot (Tab: Parallel)

Tree Plot (Tab: Tree)


Tfmp d3.1.png

1) Which are the top universities?

Allows users to have an initial look at the Top 50 universities as listed in the three sources.



Tfmp d3.2.png

2)What are the parameters used and the correlation amongst them?

Provides users an appreciation of the parameters used and the correlation among each other and to the world rank.



Tfmp d3.3.png

3) How do they compare?

Users could use this tool to do a quick comparison between the universities they are interested in.



Tfmp d3.4.png

4) What are the strengths and weaknesses?

Once users have shortlisted their universities of interest, they could use this parallel plot to review its strengths and weaknesses.



Tfmp d3.5.png

5) Summary

Users could use this collapsible tree to look at a summary of the attributes of the universities by the region, country and by year.





Demo & Use Cases

Use Case #1 - University Management's Perspective

Use Case #2 - Prospective Student's Perspective



Discussion



Future Work

LC

  • Inclusion of distribution of university on the choropleth map in D3 in ranking overview
  • Inclusion of choice in choosing the country and university in indicator analysis for granularity view.
  • Inclusion of a highlight feature for the selected node/university as its attribute moves through time in indicator analysis



Guides

Installation Guide

Tfm install.png

To run and use the application, please follow the following steps.

(1) Download the compressed package from the link provided below.

(Work in Progress)

(2) After unzipping the package, launch the ‘index.html’ file.

(Note: Mozilla Firefox is the preferred browser).


User Guide

Tfm userguide.png

After the ‘index.html’ file is launched using Mozilla Firefox, 5 tabs will present itself. One can toggle each tab to navigate through different visualizatons. Work In Progress