Week 1 - Lab Assignment 1 - Intro to Shiny

Tidy Submission (5%)


  • Ensure that your submission is neat and tidy. Please submit...
  1. Your RMarkdown (.rmd) file
  2. The rendered PDF
  3. The Markdown file (use html_document with keep_md: yes)
  4. All the figures in the *_files directory
  • Be sure to look at the .md file in GitHub to ensure that the figures are displayed correctly, including the animation.
  • Exercise 1 answers should be included in the markdown submission as usual: code, plots, and written answers.
  • Exercise 2 answers should also be included in the markdown, in addition to the deployment of the app itself on
  • Ensure that your markdown submission as a whole is easy to read: use appropriate formatting that clearly distinguishes between our questions and your answer, between different sub-parts of your answer, and with visible differences between code and English.
  • Ensure that the low-level flow of your writing is appropriate, with full sentences and using proper English with correct spelling and grammar.

Exercise 1: Displaying trends with animation vs traces vs faceting (18%)

Animations are often the first idea that people have about how to convey trends over time. This exercise compares the effectiveness of animations to the alternatives of faceting into small multiples and the derived data of traces.

Load the gapminder dataset (you can do this by loading the gapminder library; the dataset will then appear as a tibble called gapminder). Make the following three plots using ggplot2 -- each with GDP per capita on the x-axis and life expectancy on the y-axis.

1A Viz


(You do not need to put a response here. The grade here applies to the plots you make in Exercise 1.)

All of your plots should have reasonable context mechanics: an aptly chosen and informative title for the entire plot, understandable axis labels, axis tick marks as appropriate, legends as needed to document colors and other encoding choices (but without repetition with respect to other titles and labels), uncropped y axes starting at 0 unless alternative is justified, readable number formats where scientific notation is used only if clearly appropriate, and so on.

1B Animation


Plot 1. An animation of a single scatterplot: - Represent each country by a point.

  • Colour each country's point by continent.
    • Animate this plot over time (year), using the gganimate package.

1C Traces


Plot 2. A single static plot with traces: - For each country, use traces (with ggplot2::geom_path) to indicate progression over time. These should be overlaid on one plot. - Colour each country by continent.

1D Faceted Traces


Plot 3. A static trellis plot with traces: - Use faceting to separate the countries into their own panels (with ggplot2::facet_wrap). - Use traces (with ggplot2::geom_path) to indicate progression over time. - Colour each country by continent.

1E Analysis


Discuss the pros and cons of the three approaches, in terms of what tasks each approach supports well or poorly. Call out specific aspects of what structure is clearly visible in each plot, versus difficult to notice.

1F Paper (Optional)


Read the research paper
Effectiveness of Animation in Trend Visualization. Robertson, Fernandez, Fisher, Lee, and Stasko. IEEE Transactions on Visualization and Computer Graphics (Proc. InfoVis 2008), 14(6):1325-1332, 2008.

Discuss whether your analysis above aligns or disagrees with the conclusions of the paper authors.

Exercise 2 - Interactive plots with Shiny (77%)

2A Design and Code


Create an interactive visualization using Shiny with the gapminder dataset.

You should implement at least five input methods. You may tie these to any of the attributes in the dataset or to any aspects of the visual encoding; do design your app so that the interactivity is usefully adding value for the user. Here are some ideas:

  • select input - pick which attribute to encode, or pick which encoding to use
  • numeric input - change geom alpha/transparency value, or change attribute thresholds
  • radio buttons - change geom type, or change between showing raw and normalized data
  • slider input - change geom size, or change attribute thresholds
  • checkbox input - pick continents
  • text input - change graph title/legend, or add annotation
  • color input - change geom color
    • library(colourpicker) # library(devtools); devtools::install_github("daattali/colourpicker")

Visual guide to some of the Shiny inputs

2B Deploy


Deploy your Shiny app to and upload your source code to your assignment repository. Sometimes deployment will introduce bugs, so make sure to save some time for debugging! The console logs are very helpful here.

2C Document

rubric={writing:5, mechanics:5}

Document the functionality of your Shiny app in the markdown document in this repository. Explain each function included. YOU MUST INCLUDE SCREENSHOTS illustrating all of the functions your Shiny app performs. If your Shiny app fails to deploy to, we will be grading you solely on your screenshots; even if your deployment is perfect, screenshots are required.