- 3D Visualization of CMU Faculty Relations
- Zhuoni Yang, Weiqi Fang, Chuankai Zhang
CMU Academy Relation Network – Social Web Project
Nowadays, due to development of Internet, people are more likely to search on their computers for information. When high school or undergraduate students want to choose the school they’ll be attending after they graduate, or enrolled students want to find professors that match their research interest, they usually would go to the school webpage and try to find the information they need. But as the format of different university or even different departments’ webpage varies, it is somehow difficult to generate useful information in certain category. We present a visualize solution benchmark for CMU faculty in four departments. It shows faculty information in four departments, illustrates the connection of research interest and gives user a big picture of CMU academic structure.
Over 4,000 faculties & staff members in CMU
Researchers in CMU: To match cooperator, search for Professor’s of similar research interest
Students in CMU: To find the right mentor, search for Professor’s information
People out of CMU: To connect researchers in interesting area
Make it easier and convenient for people to learn about CMU’s professors and their research interests
We got our ideas from several places. Previous work of visualization and research of relationship gave us inspiration of our current project.
Visualization of Wikipedia
When studying the course of wikipedia and doing the wikipedia homework, we came across different projects of visualization that emphasize the relationship of concepts. This gave us inspiration of doing a visualization project.
1. Wiki Galaxy : An interactive visualization of Wikipedia articles as a galaxy of stars. Relevant articles are grouped together into clusters of stars, creating a constellation of human knowledge. This fancy visualization attempt kind of gave us a view of relation illustration.
2. Xefer : Examine the assertion that continuously following the first link of any Wikipedia article eventually leads to the one for “Philosophy”.
Visualization of different concept and relationship
1. High-resolution maps of science: In order to explore the topic of how academic papers are linked, Johan Bollen et. al used clickstream data to draw detailed maps of science, from the point of view of those actually reading the papers. That is, instead of relying on citations, they used log data on how readers request papers, in the form of a billion user interactions on various web portals.
After we decided to do a visualization of relationship, we began our investigation of to find out what visualization could have actual benefit to people’s life and make their information retrieve easier. We did several survey and interview of students and professor around us. It turns out that many students have very poor overview of CMU even after they get admitted or studied here for several months or years. One of our group member in other class has a bachelor classmate who has no idea what LTI and HCI department means. And we received many students’ complaint that it is very difficult to extract information from different university webpage as they are all totally different from each other. Thus we come up with our final project idea of building a CMU faculty network to show the structure of CMU’s faculty and department. This project aim to giving students of CMU or interested in CMU a big picture of faculty and departments. We believe that this could help them get the information or match of research interest much easier.
We decided to collect our data from four departments: HCI, LTI, ML and Robotics. We chose these departments for the reason that these four are very popular among students and faculties in each department have specific research interest. We got personal information like name, title, research field, homepage and google scholar webpage from CMU website, wikipedia and personal homepage. HCI and LTI webpage are kind of well constructed as most professors’ research interests have already categorized and easy to scrap. But there’s many professors that we have to generate the information from google scholar or other sources.
After we collected raw data from four departments, we did data cleaning and put the data together and saved as .csv format.
We decided to use four kinds of visualization in our final project, the table, sphere, helix and grid. In the table visualization, faculties are categorized separated in four departments, each section indicate one department and each small rectangle has one professor’s name, picture and title on it.
As a visualization of faculty relationship, one important part is to illustrate the connection of faculties. In limited time of this final project, we decided to use the research interest as a connection while collecting our data and writing the code. When choosing on each professor, the system will automatically highlight professors with same research interest in the database. This function could let the student know which professor has certain research interest so if they have interest in certain areas, say, crowdsourcing, they will easily know who to talk to.
Other system functionality
Furthermore, we noticed that the original squares are too small to put enough information on it. So we added an amplify function on hearing the mouse_click function of each square and put all other information we collected on it.
Due to the limitation of time, we didn’t achieve all the goals we had in our first presentation. We definitely could expand our current dataset. Now we only included 4 departments and we could cover all the faculties in CMU. For now, users only have access to see the data we have and after several user testing, many students said that it would be nice if we could add the search function to it, which would allow them to search certain research field or name. Furthermore, the UI of this visualization could be further improved.
We have three prototypes in total. In the first prototype, we implemented basic read and write file function in it and fed the system with the csv data we generated. The first prototype only have the basic visualization function.
In the second prototype, we investigated the research interest of each professor and added them to the data. We did further data cleaning and implemented the highlighting function where on clicking each professor, the professors with same research interest would be highlighted.
In the final prototype, we did user testing and A/B testing to refine our app. We added an amplify function to show more info of each professor while the button is clicked. Furthermore, we refined the UI, alignment, and fixed several bugs.
In this final project, we designed a visualization application of CMU faculty. We picked four departments: HCI, LTI, Robotics and ML, and built a dataset of their personal information and research interest. After that, we visualized the data using three.js and connected the faculties with same research interest. We done several user testing and had many students tried on this app. Every student said this project is really innovative and could make the academic structure of CMU clear and intuitive. Their suggestion include adding more department into it, embed the search function and improvement of user interface. But as a conclusion, we think we achieved our original purpose and the result met our expectation.
Through the whole process of the project, not only have we strongly improved our programming skills, but we also explored lots of fantastic interactive projects related to this course. We worked as a group to design the pipeline, set the goals, implement the system functionality and solve the problem. We found that when it comes to information retrieval, there is a really large space for us to optimize and do something about it. When designing social website, designer often tend to trap themselves in expert blindness. Their design often are well organized and categorized but not user-friendly enough for new users to quickly get the information they need. This visualization, in a bigger picture, is an attempt to find a better solution of searching certain information in academic areas.
 Wikigalaxy: https://github.com/xdef3r/WikiGalaxy
 All Roads Lead to “Philosophy”: https://xefer.com/2011/05/wikipedia
 R. Biuk-Aghai. Visualizing co-authorship networks in online Wikipedia. Communications and Information Technologies, 737–742, 2006.
 U. Brandes, P. Kenis, J. Lerner, and D. van Raaij. Network analysis of collaboration structure in Wikipedia. In Proceedings of WWW, 2009.
 M. Newman and J. Park. Why social networks are different from other types of networks. Physical Review E, 68(3):36122, 2003.
 C. Ware, Information Visualization: Perception for Design., Morgan Kaufmann Publishers, Inc, 2004.