Online Portfolio

Because of my internship, I am more aware of digital humanities technologies and I am more skilled in applying them to data visualization. It sparks my further interest in how to present a research result and my interest in data science.

In many ways, my internship with the Smithsonian Cultural Initiative—mapping cultural heritage sites destroyed in war-torn countries—is a good practice of interdisciplinary research. It demands digital skills, data management and curation, and public exhibition design. All of these are a step further from my major field (history). The hands-on experience in the mapping project prompted me to look into professional websites of web developers, such as Github and stackoverflow. I did not expect to have an overlapped area with computer science majors but, thanks to the internship, I had this chance to receive suggestions from tech people all over the world after I posted my questions and to look for answers in the questions posed by other people. It is an amazing and inspiring research experience that enhanced my digital skills and gave me new thoughts on the old points I had understood.

My internship work is data visualization using Mapbox and JavaScript language but I exercised multiple skills in the process. The first one is the research ability to find enough information in a short time. At the beginning of the project, there were many options for mapping tools, such as GIS, Geoda, Kepler.gl and Palladio. I had some experience with some but had to research others. After studying the nature and scope of the project and datasets we have, the team has decided to use Mapbox which demands intensive coding. Other tools either have graphic shortcomings or are better suited to other projects.

The second skill I gained in this mapping project is data management. To present the big data on a map, it takes a few steps: data mining, cleaning, storage, filtering and integrating. Each step teaches me something new when I work on them. For example, Mapbox requires the data format to be geojson, a very popular geospatial data format. In my past experience the software tools can take csv.file which can be easily converted from an Excel sheet. I spent some time on researching how to make geojson file, its format and storage. Mapbox does not take large datasets but you can use a weblink to store the data and when the code runs, it extracts data from the weblink. But this link has to end with “.geojson”. So my research extended to a new knowledge of geospatial mapping. Moreover, I have better understanding of Microsoft Excel thanks to data cleaning experience. Usually after storing data on a Github page, it will make a preview map. If this map doesn’t show, it means there is something irregular in the dataset. This confused me at the beginning because the dataset in Excel looked perfect. Actually, there were some cells causing the problem. The original datasets are collaborative work which pieces together the datasheets made by other interns. Sometimes cells have different formats, though they look the same, and when I copy and paste them into my own sheet designed for the mapbox map, they cause problems and need fixing. It took a great deal of time to figure this out.

My internship is a great learning and hands-on experience. I enjoy this research-learning process and the progress I made in it. Currently, I am very interested in data visualization and look into some tools though I don’t need to use them in my current project. Python is great in handling data but it’s not good for interaction. After signing up for Python courses, I understand why most front-end development, like the mapping projects I do, uses JavaScript. Excel is great, it can do some amazing data visualization such as graphs, charts and spirals just in Excel sheets, sometimes with little plug-ins. I guess many people do not know this hidden treasure and only see it as a datasheet. Programming languages such as Python and JavaScript are ultimate, but for most people, ready-made software tools are good enough to handle most situations and save you from the deep learning curves of a programming language.

In short, because of my internship, I am more skilled in digital humanities and interdisciplinary research. I owe many thanks to my team for their support, patience and kindness. I look forward to using the experience I get from my internship in the future digital humanities projects. Below are the two maps I have been working on: cultural heritage sites destroyed by war in Syria and Bosnia. They are still under construction.

Syria

Bosnia

Thanks to my digital humanities internship, I have gained hands-on experience as well as a few insights into this emergent and interdisciplinary area. First of all, I find digital humanities is a broad area that a small branch of it is worth deep research. Take mapping as example. Before the internship, I was complacent with Kepler gl, a mapping tool that can handle most geospatial work. However, when a real mapping project comes, I find it is only one of numerous options. Different mapping tools are designed to solve different problems and have unique features. After all, the web developers don’t make same products. It takes some time to study these mapping tools and find the perfect match for your project. For example, there are Google Maps, leaflet maps and mapbox maps. Besides ready-made tools, there are programming languages which enable you with greater customization freedom. So, which option you choose for your work really depends on the nature and scope of your project. Compared with the mapping work, this preliminary research of tools takes an equal amount of time. Similarly, this happens on other projects such as text analysis and network graphing. My academic training in digital humanities is a great stepping stone for my research on these technologies and I appreciate my internship experience to further my research skills and digital abilities.

Second, my research of tools and problem-solving experience in mapping make me wonder how much is out there in the field of digital public humanities which is simply not used to its full potential. Reasons are many: some resources have copyright, so they are not in the public domain or have limited access. Some resources are hidden in some corners or scattered everywhere in a website which require high skills to find them. And some databases have tech glitches which simply make it difficult to find your information even if you use keyword research. So, I find most useful information on computer science websites, such as Github and stackoverflow, where tech people around the world share information and solve problems for each other. Though digital humanities use some technology, it is an independent discipline and deserves its own platform of sources, research methods and theories and information sharing that focus on humanities projects, supported rather than dominated by computer science technologies. I envision a website or database that includes grant information, project proposals, academic research technology forums and examples of digital humanities projects. Just as web developers worldwide go to Github for information and problem solving, this website or database would serve as a good starting point of any person who is either interested in digital humanities or wants to further their knowledge. And most importantly, it should be easy to navigate.

Third, the internship makes me realize that analytical data skills are a must-have in this digital age, regardless of profession. Business needs it, museums need it, humanities need it, and science needs it. It’s not only for research purposes but also a great way to engage the public, as I am doing on the interactive maps in my internship. So, stimulated by this thought gained from the internship, I signed up for Python for data science courses, using the most popular programming language to process large datasets. I wonder if one day it there would be a course every college student needs to take, like current university core curriculum courses. I recommend digital humanities training programs include a coding course because I find it necessary in so many digital humanities projects. Ready-made tools are great but there is not a single that can fit all needs. The core of these tools is the programming language.

 

 

My coursework covers digital skills such as mapping, web publishing and text analysis as well as a public history course and learning and teaching history in the digital age. My internship project is mapping the destroyed cultural heritage sites of Syria and other war-torn countries. Thanks to the internship, I have refined my mapping skills by using JavaScript programming language and my coursework served as a stepping stone for my further understanding of mapping.

My coursework set me on the path and my internship leads me to go further on the path. The major mapping tool I learned in class is Kepler.gl. It can create data visualization upon a map after you upload geospatial data. I believe it can handle most of mapping work. However, due to the nature of my internship project, Kepler falls short to meet our needs. For example, we would like a number in the center of cluster while Kepler shows the intensity only by the size of the circles. Many destroyed sites share the same coordinates but Kepler can only show the information of the last site listed in the dataset while with coding, there can be a spiderifier effect in which multiple popup boxes fan out like spider legs to show information of all sites. So, the team decides to code on Mapbox maps instead of using Kepler gl which has many pre-set functions.

It feels like you are changing from a guest who can order combos on the menu to a chef who need to cook the food by himself to make the perfect dish he hopes for. It is interesting to figure out how Kepler gl developers work on the backstage when I put my hands on coding a map, in professional terms, it is called front-end web development, converting data to a graphical interface. So, in the past few months, I got myself into a web developer’s world: I learned and used JavaScript, Mapbox Maps, code editor, Github, formats of the data that work best for maps and where to make them, none of which in my expectation when I took my coursework. My practice used to make a dataset which met the requirements of Kepler and upload it. Thanks to my internship, I get a chance to see a broader world of mapping and it’s exciting to design your own map with total freedom of customization. Using JavaScript, I made choropleth maps, cluster maps, popup boxes on maps etc. After many trials, the team decides to use a cluster map with a few special effects on it.

I learned that besides on Syria, there will be mapping on Mali and Bosnia. I believe our maps can attract the public very well because of its interactive features. I look forward to the final products and wish those countries had less conflicts in the future.

 

 

 

 

 

 

 

 

Half way through my internship, I have been amazed at the coding experience and how it can run a large dataset. I did not expect I would use coding in my internship except a few functions that embed videos, internet links and maps in websites. I thought I would use ready-made software tools I learned to build some projects. To provide a brief recap: my project is mapping the destroyed cultural heritage sites in Syria and after many different trials, the format of map is an interactive cluster map with numbers in clusters and popup boxes that show the information of individual sites. This can be done by the mapping tools such as Kepler.gl but they have only a few customization features. To make the map better suit our needs, the team decides to use Mapbox where a developer can design a map by coding and have total freedom to decide what a map looks like. This is how I come to coding and it is exciting, challenging and rewarding experience.

Forrest Gump says “Life was like a box of chocolates. You never know what you’re gonna get.” Thanks to my internship, now I know my new chocolate is coding. However, the coding experience itself is like a box of chocolates—you never know what you are gonna get. Sometimes you spend a lot of time figuring out why the codes don’t work or figuring out why the map looks different from your expectation when you think you write the right codes. It’s like an adventure that you are excited to see what happens next after you create a code block and pray it works. Up to now, because of coding, I have experienced JavaScript, Mapbox-styled JavaScript, Spiderifier effect, Github and IT terms such as third-party library and Geojson format. Because of the internship, I have a taste of a web developer’s life: coding to create everything from cluster circles to popup boxes, from a geocoder to the sequence of information that shows up on the map. I enjoy this learning and exploring process and I owe many thanks to my team for their patience and support. Half way through the internship, the codes are successfully made. What I need to do now is to add new data (hundreds of entries) and make sure everything goes well. I hold breath for the final product and I am excited that we move to the next step.

For data security reason, I will create our own pages which store data. This is new experience to me because these pages must have particular web address extension. For example, the page that stores Syria data must end with “. geojson” in its web address so that when the codes run it can recognize the format and extract the information. I created one with Github. Now I look forward to seeing I can do the same under another domain name with wordpress.

My internship exceeds my expectation of internship and it is different from my original expectation. But that’s my life. It never goes as I plan but always turns out be more wonderful.

The success I have achieved in the Smithsonian internship is using JavaScript to do front-end development—mapping the data on Syrian cultural heritage sites. Instead of using Kepler.gl which has pre-set functions, I use mapbox because coding allows you greater freedom to design your map including colors, font, and visualization effects. I learned how to read and understand JavaScript and mapbox and run my data on them. Although all maps such as Google Maps and mapbox use JavaScript to make interactive maps, they have different JavaScript expressions. The codes that can work on mapbox do not apply on Google Maps. So, I not only need to understand JavaScript but the particular expressions of mapbox. With a few months of exploration and learning, I am familiar with JavaScript and mapbox expressions and use them to do mapping.

My second success is making more than one visualization effects now on the map. To achieve this, it requires more than simple combination of two blocks of codes; I need to coordinate and debug different lines to make them run. It’s like cooking. You need to process different food and integrate them together before it can be a tasty dish. After making a few single effects, now I can make two. For example, I added a geocoder in the cluster map so that a person can locate a cultural heritage site and find its information in the popup box.

The current challenge is to combine three or four visualization effects. I am working on a spiderifier effect on the cluster map. A similar example is below, one marker represents one location which makes up the cluster with other locations. When you click the cluster, markers will fan out from a cluster and, when you hover on a marker, a popup box containing the information of the location will show up. To make this map, you need to make a cluster map first, then make spider legs, and the last is to make the boxes pop up when you hover over the markers. All steps require coding. I am currently figuring out the codes to make the boxes pop up on markers. Together with the geocoder I added to the cluster map, there are four long blocks of codes for the four visualization effects. It is challenging and exciting. I feel I am climbing a mountain and getting close to the top.

Besides constant trials of code in the code editor, when I encounter problems, I look to Github for possible solutions. Web developers around the world post, discuss and solve problems over there. Though I may not find exactly the same problems and solutions, they inspire me to look at my codes in different ways. This is another part I like about the internship. It expands my life boundaries and makes new possibilities. As a humanities person, I never expected my life would crisscross with IT engineers and Github.

So, with success and challenges, I look forward to successfully making the map which spiderfies the clusters and to what happens next.

Thanks to the internship, I have been developing data visualization and web map presentation skills. The interactive map requires JavaScript language to visualize the large datasets. This is one step further to my digital humanities training in class because it requires intensive coding. The ultimate goal of the project is to present the data of Syria on interactive maps in a visual and aesthetic manner. After a few months working on interactive maps, I am familiar with the expressions used to spatial data analysis and applied them to create different types of visualization such as popup box on hover, choropleth map and cluster map. Below is a choropleth map. Hover over the province, you can see the information in the white box. You can also zoom out a bit to have the full view of Syria.

One skill I am developing is to refine the design of the map, making it more informative while visually aesthetic. It takes smart organization of digital means rather than one more block of codes. For example, the popup box when you hover over a place on a cluster map contains limited information due to the limited space while the dataset may contain large amount of information about one place. Digging my digital toolkit, I am experimenting with a few solutions to solve this space problem: 1) make a webpage for more details and insert the hyperlink. I am coding to see if Mapbox allows to embed a link in the popup box. 2) Slightly change the coordinates of a place. An area is usually made up of more than one pair of coordinates. By distributing a few pairs of coordinates to the same location, for example, Palmyra of Syria, a few popup boxes are available. 3) other types of map. The exact shape of the final project is not yet set. If it has to be one map, it takes some time to design the map and see if the design is technologically workable. Below is an example. It is a cluster map. I added a search bar where you can search the place on the map and the information of a place will show up in the popup box when you hover over it. You can also zoom out a bit to have the full view of the cluster map.

The skill I will develop in the future is combining multiple visualization effects in one map. This is not simply adding blocks of code together because different codes for different visualization effects sometimes contradict with each other. I need to parse the data, coordinate expressions and APIs, and see if they can work together. As the mapping goes on, I predict I will have to at least have a try for it. I hold breath for the result.

In the past few months, I have been working on a data visualization of damaged and destroyed cultural sites in Syria. I managed the data and tried to find good ways to present them on the interactive maps. The main programming language is JavaScript and according to my research, JavaScript is the mostly used programming language to make interactive maps, so, my focus has been on trying JavaScript and D3.js to bring data to life. D3.js is a JavaScript library for manipulating documents based on data.

What I am enjoying the most during this experience is furthering my understanding of how to use a programming language—JavaScript in this case—to produce dynamic and interactive data visualization in web browsers. I meet the director, Dr. Daniels, once a week and besides presenting and discussing my ideas and data visualization work, I can learn about some new styling and visualization effects under his guidance or suggestions and then explore how to make them. Sometimes I use Kepler gl if Kepler happens to make great visualization without the need for much customization. But most of the time, I need to code and make visualization on mapbox which enables you to customize the map to your needs. Coding is challenging but very fulfilling experience. Codes are beautiful when they work and drive you crazy when they don’t. However, the problem-solving process is the fastest way to deepen my understanding of JavaScript and interactive data visualization in web browsers. There are example codes on mapbox’s website, but this does not mean you just copy and paste the code and it is done. Instead, it is a bone frame that needs you to add flesh and blood. Based on different datasets, the codes may or may not work. For example, a block of codes, I call it Block A, works, and Block B works but Block A+Block B doesn’t work. Sometimes your code is exactly like the example code mapbox gives but it does not work. By figuring out what was going on in these problems, I furthered my understanding of JavaScript and interactive map making. I have saved on file the customized codes of the visualization effects I successfully made so that in the final project, there is less customization workload and faster completion of data visualization.

Thanks to the internship, I have the opportunity to work out data visualization on maps and use a programming language I used to build websites only. I solve problems faster and faster because of my increasing knowledge of JavaScript. My curiosity and passion in data visualization prompted me to have signed up for a Python for Data Science certificate of Cornell University. I am very excited about and look forward to what data visualization Python can create. I have knowledge of Python but this systemic training can strengthen my toolkit in data visualization.

My work style preference, based on the experience in the past few months, is to focus on mapping in one day or two instead of working three hours a day. Since I have other responsibilities to juggle, to contribute a whole day to only one type of work helps me better focus on the work and finish it. It takes time to work back and forth between coding and dataset management and one day or two are the ideal time length for such work.

Currently I have the amazing opportunity to do a digital humanities internship at the Smithsonian Cultural Rescue Initiative (https://culturalrescue.si.edu/). The mission of the initiative is “to protect cultural heritage threatened or impacted by disasters and to help U.S. and international communities preserve their identities and history.” The Conflict Culture Research Network (https://culturalrescue.si.edu/what-we-do/research/culture-conflict-research-network/), a part of the Initiative, involves many countries but I am currently working on Syria, managing and visualizing data of the cultural heritage sites. There are two datasets—the cultural heritage sites and the cultural heritage sites impacted by war. I have some creative responsibilities to explore what data visualization effects there can be and how to present the data in the most effective manner.

I am most excited to be doing data visualization using various software tools and coding. After researching a great variety of mapping tools such as Arc GIS, QGIS and Geoda, I have narrowed my focus to two mapping tools which suit the project better: Kepler.gl and Mapbox Studio. They are two powerful open-source geospatial analysis tools for large-scale datasets. They can create various visualization effects on the map, making it possible to investigate trends on a geographical level. Kepler is easier for beginners to use; you simply upload the datasets and click various options to analyze trends and visualize data (https://medium.com/vis-gl/animating-40-years-of-california-earthquakes-e4ffcdd4a289). Kepler requires no programming but it limits you to pre-set functions. Mapbox has a deeper learning curve but is more powerful in customization and visualization. In Mapbox, you can customize everything on a map and create any effect you want on it. However, with more options to create maps comes coding. Mapbox uses JavaScript language. I had knowledge of Java when I built my websites to insert images, adjust font and change colors of text etc. but Mapbox definitely requires more knowledge of coding because the user needs coding to create complex effects on maps (https://docs.mapbox.com/mapbox-gl-js/example/timeline-animation/). While trying to create different visualization effects on the map, I am deepening my understanding of JavaScript language.

I am excited to do this because it is a wonderful opportunity to improve my digital skills and contribute to Conflict Culture Research Network and the cultural preservation of Syria. I am very glad to present scholarship in a dynamic and visualized way to the public because it may reach more people and engage them to join the preservation work than the traditional way to publish findings. Thanks to the internship, I am exploring Python, another popular programming language, to see what data visualization it can create. I look forward to further progress on the path of programming.

I am building my project on the Women’s Suffrage Movement on Omeka. Up to now, everything has gone well.

I had a few technical problems but solved them with the aid of Internet or found substitutes which can make the same effect on the website. For example, in my Omeka project on the Chinese At America’s gate in the last semester, I used Youtube Import plugin to move the metadata and link of a youtube video into the Omeka. It’s faster, convenient and gets as much metadata as possible. But this time when I do the same thing, Omeka keeps reminding me I maxed out the API quota while I only imported the links of a few short videoclips. It turns out it may not my problem but the developer’s because Blackboard had the same problem earlier this year. So, after  many trials, I find a substitute to embed a video in the webpage but I still need to enter metadata manually.

Currently I am building the project as I planned and with the material I have found. My next step is after finishing this project building, I will check and refine each part. For example, I will see if I will have more good ideas about the final project the students will do, find more interesting primary sources of U.S. women’s suffrage, or learn new digital skills that make my website look better.