Category: Georgia DH News

Source: Georgia Tech Digital Humanities Lab
URL: Data by Design: Automating the Chapter Timeline
Each chapter of Data by Design has a chapter timeline, which places images and visualizations on a vertical minimap, allowing the user to get a sense of the chapter and their progress within it at a glance. Additionally, all user highlights will be visualized on the timeline as they’re made. The map will allow the user to click objects within it and be taken to the corresponding spot in the chapter. Embracing the notion of a “meta-visualization,” each chapter’s timeline is styled after the main visualization in that chapter. The Peabody timeline at time of writing   Initially, the chapter timeline…
Read More: Data by Design: Automating the Chapter Timeline

Source: Georgia Tech Digital Humanities Lab
URL: Data by Design: Static Visualizations for Playfair’s Chapter
Besides the “Export and Import to and from all North-America” scrollytelling visualization, I also created several static visualizations using d3 to showcase Playfair’s method with modern technologies. The first two visualizations use the same data of Playfair’s import-export chart. The stacked bar graph on the left uses a similar axis and labels as the import-export chart. I have each bar with constant width representing each year we have in the CSV and positioned chronologically. For year 1770 to year 1782, where we have detailed data points, the bars are overlapping each other. The Coxcomb graph on the right uses a…
Read More: Data by Design: Static Visualizations for Playfair’s Chapter

Source: Georgia Tech Digital Humanities Lab
URL: Data by Design: Code Reuse and Visualizations
When I joined, the team had done a considerable amount of research, design, and requirements exploration in addition to our small prototype. One of the ideas continually emphasized was that the book would be heavily data-driven. This can be a bit of a buzzword and a swiss-army-knife of a term – the first two D’s in the popular web visualization tool D3 are “data-driven,” for a technical example, while data-driven can characterize approaches in other disciplines, like data journalism. Data by Design is situated in a broad meaning of the category – we’re data-driven in the sense that the scope…
Read More: Data by Design: Code Reuse and Visualizations

Source: Georgia Tech Digital Humanities Lab
URL: Data by Design: Playfair Visualization, Step by Step
In Playfair’s chapter, we remade his original “Imports and Exports to and from North-America” graph with d3. We also breakdown his process of making visualizations with engraving and compared it to the modern way of using software tools. Playfair’s original visualization D3 recreation of Playfair’s visualization The recreation integrated the scrolly-telling feature we had for this project, breaking down the process of Playfair’s engraving and transformed it into today’s data plotting method with d3. As the reader scroll through the web page, components of the visualization appears in the order of creation along with text explanation. https://dhlab.lmc.gatech.edu/wp-content/uploads/2021/02/Screen-Recording-2021-02-13-at-13.37.49.mp4   The visualization…
Read More: Data by Design: Playfair Visualization, Step by Step

Source: Georgia Tech Digital Humanities Lab
URL: Data by Design: Front Page Timeline
On the front page, we decided to implement a timeline below the main title to give our readers an overview of all the visualizations we will be covering in the book. The timeline consists of three main parts, the gray horizontal bar representing time from the year 1786 to the year 1900, multiple blue vertical bars at each time mark representing the number of visualization we collected for that specific year, and the image frames that showcase the thumbnails of those visualizations. The image information is stored in the points array in the data function of the Vue component. The…
Read More: Data by Design: Front Page Timeline

Source: UGA Digital Humanities Initiative
URL: Digital Archive of Texas English Speech
  Lars Hinrichs Associate Professor of Linguistics, University of Texas at Austin Axel Bohmann Assistant Professor of English, University of Freiburg In our latest Digi Colloquium, guest speakers Lars Hinrichs and Axel Bohmann presented “The Promise of Nine Decades’ Worth of Interviews: Building the Digital…
Read More: Digital Archive of Texas English Speech

Source: Georgia Tech Digital Humanities Lab
URL: The Data by Design Notebook: Drag and Drop
In my last post, I introduced Data by Design’s notebook feature, and spoke a bit about the design and implementation of the chapter highlighting capability. Highlighting, though, is only the first step in this user story, and we wanted a drag-and-drop interface that felt simple and natural to move highlights to the notebook. In this post, I want to outline how I integrated drag-and-drop throughout DxD’s UI. Why Drag and Drop? Although we all intuitively felt that we wanted drag-and-drop for this interface, I want to parse that here. Why does drag and drop feel natural and appropriate? When does…
Read More: The Data by Design Notebook: Drag and Drop

Source: Georgia Tech Digital Humanities Lab
URL: The Data by Design Notebook: Highlighting
(placeholder)
Read More: The Data by Design Notebook: Highlighting

Source: Georgia Tech Digital Humanities Lab
URL: Data by Design Chapter Navline Implementation
I’ve been working on the implementation of the chapter navigation line. Here are some features listed: Blocks/Nodes with different colors represent different types of visualization, where their position in the navline is determined by their position in the chapter. The user is able to scroll through the chapter and having their reading progress represented by the colored part of the navline. The user’s current location is indicated by a separate block/node on the navline. The user’s highlight(linked to the notebook) is represented by a separate column of blocks/nodes (peabody and dubois) or its background (playfair). The transparency of the blocks/nodes/background…
Read More: Data by Design Chapter Navline Implementation