1st lab-timelinejs


Visualization

INTRODUCTION 

In the 1st Lab, I created a timeline for 6 Amazing Data Visualizations of Creativity and Art History by TimelineJS. This topic demonstrates how the artists arrange data to record art activities and express their own concepts visually, and I chose this topic because I am interested to explore how artists manipulate and visualize data in different ways. For example in 1973, George Maciunas designed a grand art history chart about Fluxus, which was an international network or artists active in the 1960s and 1970s, and map is simply composed by lines, blocks, and texts in black and white; In 2011, Ward Shelley designed diagrams also about Fluxus history, but this one is colorful and complex which looks like the blood vessel in the human body. This timeline Figure 1 includes 6 artworks from 1973 to 2013 and shows their title, images, timeline, and description. 

Figure 1 Timeline for 6 Amazing Data Visualizations of Creativity and Art History DESIGN CRITIQUE

MATERIALS, SOFTWARE AND DATASETS

TimelineJS is an open-source tool which provides an interactive and visual timeline for users, and it could be embedded in the web interface. In this topic, I researched the cross-disciplinary areas about art and data visualization, and then I found the article, 10 Amazing Data Visualizations of Creativity and Art History, on ArtNews. This article introduces how artists visualize data to record historical events or express their own ideas. The artworks were selected in to the timeline include Diagram of Historical Development of Fluxus and Other 4 Dimensional, Aural, Optic, Olfactory, Epithelial and Tactile Art Forms, Diagram of Historical Development of Fluxus and Other 4 Dimensional, Extra Large Fluxus Diagram V.3, Map of the Culinary Process: Decoding the Genome of Cooking, Potential future sketch, and Investigating the Myth of the Avant-Garde. 

PROCESS

TimelineJS is easily to use for the new customers, and I only took 3 steps to create my timeline:

  1. Build a new Google Spreadsheet and insert Start Year, End Year, Display Date, Headline, Text, Media, Media Caption and Group
  2. Publish it to the web and copy the spreadsheet URL 
  3. Paste spreadsheet URL into the Timeline Knight Lab to generate the new timeline, and the preview allow users to check the result

RESUILTS

This timeline includes 6 artworks from 1973 to 2013, and they are demonstrated by the slide form. The slide is composed of two parts, the examples with images, titles, and texts on the top and the timeline bar on the bottom. The arrows on the left and right provide the previous and the next title as the reminder for audiences. In the timeline bar, the group names are locked on the left side showing the higher level information. 

Final result: https://cdn.knightlab.com/libs/timeline3/latest/embed/index.html?source=1P8QYWGIKoh4O6UinvPcovzg91hxxBVyUGpBLG8TF8Hk&font=Default&lang=en&initial_zoom=2&height=650 

DESIGN CRITIQUE & REFLECTION

-Brief Introduction

After I finished the timeline and checked the sample on the web, I found a brief introduction at the beginning of the whole timeline which is helpful for the audiences to have a general idea about the database. In the brief introduction, I can make an attractive title for them and also summarize a short paragraph for content preview. Also, an interested and representative background image could do a lot of heavy lifting on the page, and it helped immensely in conveying the content.

-Detailed pictures 

Some images showing on my timeline are a large size, such as two diagrams for Fluxus history, and even the web interface could be enlarged but the audiences still can not read the detailed texts and images. The advantage for the whole size is to provide a complete view and idea about the historical events and works, but the opposite side is that the audience may miss a few detailed information so that their memories about this topic is blurry and does not last long. 

-Connections and Trend

Compare with the tool which is used to explain the historical events, I feel my timeline for 6 Amazing Data Visualizations of Creativity and Art History does not have strong associations between every sample or the trend to tell the story in a narrative way. The associations of each sample could engage audiences to remember the data in series, and also narrate the story in a kind of a trend which also could reinforce the memory.  I tried to group artworks by 1980’, 2000’, and 2010’, but it does not help the audience to categorize memories and it is repeated with the timeline. Therefore, I think the next time I will try to find out the potential connections between data and summarize the trend for the storytelling. 

Figure 2 Timeline Bar