Skip to content

Latest commit

 

History

History
41 lines (31 loc) · 2.74 KB

data-visualization.md

File metadata and controls

41 lines (31 loc) · 2.74 KB

HCDE 598 Winter 2017

Week 5 Homework

Data Visualization

Due Saturday, 02/25, at 9pm

Note: You have 2 weeks to complete this assignment.

Goals

The purpose of this exercise is to give you a chance to create a data visualization using p5.js.

Specification

In this assignment you should create a unique data visualization using a small set of data (of any kind). Your program must dynamically create the visualization from the data set (this means I should be able to change your data, and the visualization will change too). Your visualization should be graphically interesting, and should include some sort of user interaction or changes based on actions the user takes.

Your program should use loops(for or while, or both), arrays, functions and parameters. The birthday visualization we created is a good example of what I am expecting.

This is a much more challenging assignment then past assignments and as such you will have two weeks to complete it. You should complete your program in stages, and reach out to your instructor if you get stuck or need any help along the way.

Tips

  • Choose a small dataset, or a subset of a large data set
  • Sketch and plan your ideas before you start to code
  • Start small, get small pieces working first; don't try and write your code all at once
  • Add in the user interactions last, after you get the visual representation of the data working

Optional Extensions

  • Learn how to read your data from a .csv into an array, instead of storing the data directly in your program
  • Build tools that let your users manipulate the data visualization on screen

Submission

  • Your code should have a top comment block with your name, last edited date, and a brief description of the entire program
  • Each line in setup and draw should have a comment
  • Each function that you created should have a top comment briefly explaining what that function does (note that setup and draw do not need top comments)
  • Add your creative exploration projects to your Github portfolio and submit a link to this project on canvas along with an image of your sketches
    • If you are comfortable with HTML and CSS also add your sketches to your portfolio

Inspiration