Discussion Forum (LMS)
Late Day Policy
Spring '16 Projects
Assignment #3: Intro to (Web-Based) Interaction
The primary goal for this assignment is to familiarize yourself
with a new tool for creating interactive visual artifacts.
documents based on data. The website contains a huge and varied
collection of eye-catching and compelling examples.
Note: If you're already a D3 expert, you can choose another
new-to-you interaction toolkit. Possibilities include:
VTK Visualization Toolkit (it doesn't
have to be a web-based tool!). Do the same exercises below with the
other tool and compare the results and overall usability of the tool
to what you would expect to see from D3.
First, explore some of the examples on the D3 website. Download the
files, modify them, test out your changes, and start to read the
Brainstorm ideas for an interactive visual artifact. It doesn't
necessarily have to be a "visualization" in our strict definition. In
fact, you're welcome to be silly & possibly exemplify some of the "bad
visualization" traits we identified in class and in Assignment #1,
such as pie charts, chart junk, etc.
Even if it's a silly example, you should still have a story or
purpose and a target audience for this visualization. Why is a
dynamic interaction beneficial for this task/data?
There are a variety of different types of "interaction" you may
include. For example, pop up text messages, data
On paper, draft a simple storyboard and/or wizard-of-oz this
interaction. Don't get too complicated, since this is a short
assignment. Take photos of these drawings and include and include
them with your submission. Note: it's ok if you deviate from or
change your plan once you tackle implementation.
Implement that visualization artifact in D3. If your design was
overly-ambitious, focus on a couple features or interaction mechanisms
that are most interesting to you. You should do some coding for this
assignment, but you are encouraged to borrow from examples. Just cite
the original source(s) for your work and give credit to the author(s).
Write a short review of the tool. How quick was the installation and
learning to use the tool? What resources were most useful? What
sorts of applications/datasets are most appropriate for this tool?
What are the limitations of this tool? What are some
suggestions/cautions to others who consider using this tool?
How to Submit
If your assignment is self-contained and portable... great! Submit
the interactive artifact. Simple instructions to show off the results
should either be included within the artifact or as a separate
plaintext or .pdf file.
Alteratively (if your artifact is not self-contained and portable),
take a bunch of screenshots and organize them as either plaintext with
separate image files (.png or .jpg) with clear file names, or .pdf
with embedded images.
Make sure the code you wrote is clearly labeled. And that code you
borrowed from others (with or without modification) is appropriately
labeled and cited. Note: The code does not have to be perfect or
documented in detail. We recognize that this is rough prototype work.
Include your early storyboard/wizard-of-oz sketches. Document how
your design ideas changed as you progressed in the assignment.
Follow the homework server submission
instructions to zip up these files and upload your assignment to
the homework submission server.
Note: Contact the instructor if you don't have access to the homework