{"id":10351,"date":"2018-09-11T14:26:33","date_gmt":"2018-09-11T18:26:33","guid":{"rendered":"http:\/\/studentwork.prattsi.org\/infovis\/?p=10351"},"modified":"2019-01-11T00:02:24","modified_gmt":"2019-01-11T05:02:24","slug":"understanding-who-we-are-milestones-in-demographic-data-throughout-history","status":"publish","type":"post","link":"https:\/\/studentwork.prattsi.org\/infovis\/labs\/understanding-who-we-are-milestones-in-demographic-data-throughout-history\/","title":{"rendered":"Understanding who we are: milestones in demographic data throughout history"},"content":{"rendered":"

\"Shot[Figure 1: Title slide of Timeline JS project]<\/p>\n

Introduction<\/strong><\/h2>\n

Demography, or the study of quantitative data about characteristics of human populations, has been a field of study since ancient, pre-Roman times. The analysis of population data can tell us a great deal about changes like migration patterns, overpopulation risks, fertility rates, and more. This data then helps inform policies and societal structures that we can use to change undesirable states. This project seeks to illuminate the major milestones in the field of demography throughout history, using a timeline visualization.<\/p>\n

Timelines are by nature linear constructs that metaphorically follow the path of time. The sophistication level of visual literacy required to understand a timeline is fairly low, as we are presented with the concept of time moving in one linear direction from an early age. For this reason, I have created a timeline using TimelineJS.<\/p>\n

Materials<\/h2>\n
    \n
  1. TimelineJS:<\/a> a free and open source timeline tool developed by Knight Lab<\/a> out of Northwestern University. Per their website, it \u201cenables anyone to build visually rich, interactive timelines \u2026 using nothing more than a Google spreadsheet.\u201d<\/li>\n
  2. Google Sheets<\/a>: part of the Google Drive, Sheets is a free, online spreadsheet program similar to Microsoft Excel in functionality<\/li>\n
  3. Wikipedia<\/a> for data and image collection.<\/li>\n
  4. Imgur<\/a>, for free image hosting where appropriate.<\/li>\n<\/ol>\n

    Methods<\/h2>\n

    The development of this project spanned five steps:<\/p>\n

      \n
    1. Goal <\/strong><\/li>\n<\/ol>\n

      After learning about the history of information visualization in my coursework, I was interested to learn more about demographic data in particular. When did the study of population characteristics begin, and how did it evolve throughout history to become the nuanced field of study that it is today?<\/p>\n

        \n
      1. Data Collection<\/strong><\/li>\n<\/ol>\n

        To answer the question above, I searched for landmark use cases (or milestones) of demographic data. My definition of \u201clandmark uses\u201d were ones that (a) uncovered previously unknown patterns or (b) contained groundbreaking visualizations as compared to predecessors. I primarily used open source data from Wikipedia, searching on keywords like \u201cdemography,\u201d \u201chistorical demography,\u201d \u201cpopulation statistics,\u201d and used these articles\u2019 contextual links to uncover data.<\/p>\n

          \n
        1. Media Sourcing<\/strong><\/li>\n<\/ol>\n

          Having identified the milestones, I then sought multimedia to make the entries visually compelling and meaningful. My priority was to find images of the publications or visualizations themselves, in order to help the user understand the progressively sophisticated ways in which demographic data has been represented over time.<\/p>\n

          Media links require active and valid URL\u2019s for entry into the TimelineJS Google Sheet, which proved to be difficult in some cases. Using Wikipedia as a central media source, I found that many images are hosted on a different site and displayed as thumbnails in Wikipedia articles. In these cases, I would click on the image, follow it to the original site, and copy the image address.<\/p>\n

          In other cases, the link to original content was broken, and I had to find the image through a Google Image search. However, I soon found that I couldn\u2019t always use the \u201cCopy Image Address\u201d command from a Google Image result, as that would result in an invalid URL link. By using the Developer Tools function in Chrome, and was able to inspect the image on the webpage and find its original location.<\/p>\n

          Lastly, I encountered some issues with sourcing media for the 2018 milestone which highlights the birth of web-based interactive visualizations. TimelineJS\u2019s Help section notes that the Media column does not support HTML web addresses. My workaround was to screenshot the site, upload the image to Imgur, and use that image link as my media source. I then embedded HTML language in the Paragraph column of the Google Sheet to hyperlink to the site itself.<\/p>\n

            \n
          1. Google Sheet Creation<\/strong><\/li>\n<\/ol>\n

            With all media and data compiled, the next step was to fill out the Google Sheet template provided by TimelineJS. A sample screenshot of the Google Sheet template with some of the timeline data is below.<\/p>\n

            \"Picture<\/p>\n

            [Figure 2: Google Sheet Template]<\/p>\n

            Not all of the fields required entries \u2013 I used the required fields and any additional ones that I felt would make my visualization more attractive, such as Background and Media Caption.<\/p>\n

            5. Visualization creation <\/strong><\/p>\n

            The final product was created by going back to TimelineJS\u2019s website, inputting the Google Sheet link, and then securing the resultant Timeline link.<\/p>\n

            Results<\/h2>\n

            The final TimelineJS file can be accessed here<\/a>.<\/p>\n

            The final Google Sheet data is also available, here<\/a>.<\/p>\n

            It is my hope that this timeline guides others who may be interested in learning about the history of demographic data. The visualization successfully showcases the ease and power of TimelineJS from both an author\u2019s and user\u2019s perspective. The signifying arrows on each side of the screen clearly dictate that to progress or regress the timeline, the arrows can be clicked to view the related milestone.<\/p>\n

            Reflection and Future Direction<\/h2>\n

            While TimelineJS has many advantages, it quickly becomes clear that there are also certain limitations. First, there are limited ways to customize the slides in the Optional Settings section of the website (below).<\/p>\n

            \"Image<\/p>\n

            [Figure 3: Optional Settings menu on TimelineJS site]<\/p>\n

            Some improvements that Knight Lab could create would be: allowing authors to use a font of their choice, to add a \u201cFinal\u201d option under the Type column to allow for a conclusory slide, and to allow for the embedding of web-based visualizations in the timeline. It would be wise to think of TimelineJS as a great way to gather related events are sequential in nature, and to do so in a quick, relatively easy way for beginners. For more advanced practitioners, other tools may be more effective.<\/p>\n

            On a personal front, I would have liked to find demographic milestones in the 20th<\/sup> century. I found it difficult to find any major breakthroughs, which was surprising. This gap caused an odd jump from 1900 to 2000 in my timeline. While my goal was to showcase the progression of demographic studies at a very high level, and I feel I\u2019ve accomplished this goal, in the future I would potentially want to tailor my focus from the 1800\u2019s-present day. This would create a more insightful analysis of the overall trends from the industrial to computer age.<\/p>\n","protected":false},"excerpt":{"rendered":"

            [Figure 1: Title slide of Timeline JS project] Introduction Demography, or the study of quantitative data about characteristics of human populations, has been a field of study since ancient, pre-Roman times. The analysis of population data can tell us a great deal about changes like migration patterns, overpopulation risks, fertility rates, and more. This data…<\/p>\n","protected":false},"author":273,"featured_media":10352,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[149,339],"tags":[242,5,243,119],"coauthors":[322],"class_list":["post-10351","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-labs","category-timelines","tag-demographics","tag-information-visualization","tag-lab-reports","tag-timelinejs"],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/studentwork.prattsi.org\/infovis\/wp-content\/uploads\/sites\/3\/2018\/09\/Screen-Shot-2018-09-06-at-1.49.39-PM.png?fit=3278%2C1304&ssl=1","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/paBdcV-2GX","_links":{"self":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/10351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/users\/273"}],"replies":[{"embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/comments?post=10351"}],"version-history":[{"count":4,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/10351\/revisions"}],"predecessor-version":[{"id":10358,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/10351\/revisions\/10358"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/media\/10352"}],"wp:attachment":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/media?parent=10351"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/categories?post=10351"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/tags?post=10351"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/coauthors?post=10351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}