These are the main goals of this assignment:
- to start thinking about visualizations in terms of user interaction
- to get started implementing custom visualizations using all the techniques we’ve learned so far. This involves your recently acquired knowledge about visual perception and color, as well as interaction techniques.
- to prepare you for the final semester project
Your task is to create a custom interactive information visualization. You are free to pick any framework you like, as long as you implement the visualization yourself (as opposed to just using the interactive features of Tableau)
Here is one way to start:
- Pick a domain you’re interested in
This can be any freely available data set. This can also be something you got from scraping websites, that you derived from an API (e.g. Twitter), or anything that you compiled yourself and you feel passionate about. Feel free to use an example from your own research, but do not pick an example that you already have created visualizations for. My suggestion is to not spend too much time on getting the data set and save some time to implement the visualization. - Sketch out the interactive affordances that match the user intent
You’re the designer and decide what you would like the users of your visualization to be able to do. This is closely related to the user intent. You might want to enable them to filter down a bigger dataset, to reconfigure a static view, or any other interaction technique we’ve looked at. The sketches become part of your writeup and are a required deliverable. I recommend to sketch your ideas out by hand. - Implement the visualization
I’d recommend to use some of the frameworks we’ve looked at in class (such as D3.js or RaphaëlJS) or any other visualization framework that fits your needs (for example Processing or ProcessingJS). The effort you’re putting into this assignment will greatly help you with your final semester project. - Apply some visual polish
Present your visualization in a clean and visually appealing way. Don’t stress too much about this, but also don’t forget esthetics after putting in hard work implementing your visualization.
I would like you to learn from each other and benefit from each other’s skills. You’re free to work in groups of two for this assignment, as long as contribute some code.
Deliverable
- Your Visualization along with instructions how to access it (including source code)
- 2 page writeup (500 words) containing
- Your sketches
- Why you chose the interaction technique
- Problems you ran into, if any
- Role of each team member, provided you worked in teams.
- Compress everything into a zip file
- LastnameFirstnameA3.zip (e.g. JungDonghyukA3.zip)
Due Date
Tuesday March 6, 5:00PM, by email to DH.
dhjung0201@gmail.com or donghyuk-jung@ischool.berkeley.edu