A2 for Data Science

Due date: Apr 02 (23:55)

This is an introductory assignment designed to get you up and running with HTML, CSS, JavaScript, and designing a visualization with D3. Be aware that this course uses version 6 of D3.

Learning objectives

Instructions

Use the usa_nominal_gdp_1997-2020.csv dataset for this assignment.

Recommended procedure

A multi-line chart showing the yearly nominal GDP (Millions of current dollars) of the states in the USA

Grading

We’ve broken the learning objectives down by numerical grade, 1 through 5. You will receive the best grade for which you’ve met at least one objective plus all fully completed grades below. Please be aware that that means that if you haven’t fully met all objectives for getting a 3 then you won't get a 2 or 1 even if you’ve completed all the objectives for the grade 2 or 1. We’ve structured the objectives so that they build on each other for the most part. So, in order to show that you’ve learned something for grade 2 then you’ll need to show that you’ve also met all requirements for grade 3, grade 4 and then some.

Grade 4 (50% - 62%)

Grade 3 (62.5% - 74.5%)

all the above plus:

Grade 2 (75% - 87%)

all the above plus:

Grade 1 (87.5% - 100%)

all the above plus:

Submission instructions

Submissions should be done BOTH on Moodle and on the Uni Wien Almighty servers (see the instructions below), e.g.: http://wwwlab.cs.univie.ac.at/~myusername/VIS23S/A2/ (replace 'myusername' with your u:account username, which you use to login to Uni Wien services such as u:space)

Make sure your submission (i.e. the code) on the almighty web instance and on Moodle are identical. If you make any changes to your web instance submission after the deadline, make sure you submit the same changes to Moodle as well. These submissions will be compared by us and the modification dates of the files on the web servers will be checked in accordance with the deadlines & grace day usage.

Using your Almighty Web Instance

Login to your student web server instance with the following credentials using a FTP/SFTP client:

Under the user directory (/home/myusername) in the server, create a folder called "public_html" (if it doesn't exist already). The files in this directory are made automatically online under http://wwwlab.cs.univie.ac.at/~myusername/ (replace 'myusername' with your u:account username, which you use to login to Uni Wien services such as u:space)

Inside the public_html folder create a folder called "VIS23S". Inside VIS23S create a folder called "A2". Your submission files should be placed directly in this order, that means your index.html should be immediately inside the A2 folder for this particular submission.

Make sure you visit the site http://wwwlab.cs.univie.ac.at/~{u:account username}/VIS23S/A2/ on your browser (we'll test with Chrome / Firefox) and that your code runs as expected.

Moodle Submission

Please submit a folder containing an index.html file which will open the view, the data file, and a readme describing what you did, why, and the data source(s) you used, as well as any other associated files to moodle. Please be sure if you submit a zip or tar.gz file that it properly unzips the files into a directory. It’s a good idea to try unzipping your file before submitting it to ensure that everything unzips properly and you don’t lose points. Use the following naming scheme for your submission: “myusername_A2.zip” - replace myusername with your u:account username. When we grade your work we will run

python -m SimpleHTTPServer

in the directory and then open index.html. So please ensure that your visualization works correctly under those conditions. Also, please make sure that you include your name in the readme file.

Just to be clear, here is a sample directory layout. You do not have to use this exact format but it must be clear which file is your readme, your html page, your data file, and your javascript file.

myusername
      \
      | README.md
      | index.html
      | d3.min.js
      | vis.js
      | style.css
      | data.csv
    

Any additional libraries without prior permission will result in a 0


A2 for Digital Humanities

Due Date: Apr 02 (23:55)

Critiquing a visualization

The use of visualization is pervasive in the media: explanatory diagrams in magazines and textbooks, graphs describing statistics, budgets, and predictions, images showing spatial layouts of objects, new experimental data plotted against theoretical expectations, etc. In each case, the author of the visualization tries to convey a point of view by emphasizing some aspects of the data while toning down other aspects. The result can vary widely, from informative to misleading. What do you think, how did you and your peers do on your first homework? Can you apply the design principles we talked about in class?

Assignment

Now, you will critique the visualizations created for assignment 1. For this purpose, you will be randomly assigned an A1 visualization created by one of your peers. Apply the knowledge of design principles to identify pros and cons of the visualization design that was assigned to you. Try to challenge design decisions and ask “why” about any aspect of the design. Keep in mind that it is important to write about which aspects of the visualization you believe effectively communicates the data, as well as those that you think could be further improved. Your overall write-up should be 2-3 pages long.

As different visualizations can emphasize different aspects of a data set, you should try to identify what aspects of the data were most effectively communicated. What story (or stories) did the designers try to tell you? Just as important, also note which aspects of the data might have been obscured or down-played due to this visualization design.

Please note that this critique will be a very different write-up compared to what you did for assignment 1. Assignment 1 asked you to explain your own reasoning process in coming up with the visualizations. In this assignment, you should reflect and constructively critique someone else's approach.

Understanding the data and evaluating the visualization may take some time. So plan accordingly. Also try to apply the design recommendations discussed in class and our readings. Please feel free to include alternative visualization prototypes (using your favorite tool) as a way to illustrate your critique.

Reviewers

Please find the link for which dashboard you have to review in this list.

Procedure and Submission

Please submit a PDF-document (2-3 pages) containing

Submit the file via Moodle. Use the following naming scheme for your submission: "matrikelnumber_A2.pdf".


Late submission

Late Submissions are possible, you have a total of five grace days for all assignments. After these days are used up, remaining assignments must be submitted on time.

Academic Honesty