“Flipbooks” are new tools that present side-by-side, aligned, incremental code-output evolution via automated code parsing and reconstruction.
Good examples of code behavior help programmers accomplish unfamiliar tasks. Tools for communicating code behavior have improved in recent years. “Dynamic documents” show chunks of code and its resultant output, like a graph or a data table, immediately thereafter. But creators using these tools often must choose between big-picture or narrow-focus demonstration. Creators tend to either demonstrate a complete code pipeline that accomplishes a realistic task or instead demonstrate a minimal example which clarifies the behavior of a particular function, but how it might be used in a larger project isn’t clear. Flipbooks help address this problem, allowing creators to build a real work product and allowing consumers to walk incrementally through a code pipeline, focusing on any unfamiliar steps.
Essentially, flipbooks seek to minimize guesswork about how code input and its output relate. As such flipbooks hold much promise as an educational, communication, and reference medium.
Click once in the box the below to initiate the session; then use the right and left arrow to “flip” through the book to see how to make an animated “racing” bar chart of the population size of the most populous countries over time.
In mid 2018 Garrick Aden-Buie, a data scientist at the Moffitt Cancer Center, created and debuted a side-by-side format for code and figure output in the slide-show tool, Xaringan, an RMarkdown tool. He demonstrated in incremental steps how someone might build up a plot using the popular R visualization package ggplot2. In August 2018, I emulated this work, but using a code style I developed which I called “slowggplott”, which is entirely sequential and more incremental than typical workflows. In September, Emi Tanaka, a Lecturer in Statistics at the University of Sydney, implemented a similar sequential workflow demonstration, that was partially automated.
I approached Garrick and Emi in October about working together to create a “flipbook” of exemplary data visualizations. We soon had a fully automated framework to parse ggplot2 code, and present its reconstruction along with associated output!
The procedure to automatically parse and reconstruct code was tested and refined on small projects. Then, I created a “flipbook” of a sizable collection of my portfolio of data visualizations. After writing descriptions to introduce the plots, I publicized the work in February, 2019; the flipbook was met an enthusiastic reception.
Since then, I’ve taken the development lead in making a number of changes to the foundational code to improve the tool and to extend use cases.
The February 2019 debut of the flipbook technique unveiled in its application to a substantial collection of my data visualization code in the ggplot flipbook. Shortly thereafter, the reveal code was extended to handle data manipulation pipelines which allowed for the creation of The Tidyverse in Action.
Since then flipbook tool has been applied in explaining how to create visualizations important to statistical pedagogy, as in The Galton Board flipbook ; political decision rules as in D’Hondt/Jefferson Allocation; and custom plot types, as in a racing barchart.
Returning to the initial focus of data visualization using ggplot, new resources have been created focused on providing systematic and theoretical foundations for understanding ggplot2 – the implementation of the powerful Grammar of Graphics framework in R – including a ggplot grammar guide and ggplot themes.
Use of the framework has also been explored outside of its “Tidyverse” roots in a data.table flipbook, and leaflet’s interactive maps for R for example.
A code repository for the smaller flipbooks projects “lives” in one place, here, for reference. Larger projects’ code is also open access and is available for examination and emulation.
The next frontier was making the technique easy to use, problem free. One step to this end was to use others’ code to create Flipbooks as was done in #TidyTuesday walk through. Four visualizers generously allowed me to use their beautiful work. Problems with the code parsing were uncovered and addressed through this process.
Additionally, I’m worked on and testing materials to help people create their own books with minimal hassle. A guide exists in the A flipbook minimal example and the The checkerboard example. In a June 2019 workshop participants at the University of Illinois, successfully produced their own flipbook using the minimal example as a guide.
In this phase, research assistance from DU masters student Ryan Granier was extremely valuable in helping to move the project forward. Thanks Ryan!
Sequentially revealing code is the current implementation of flipbooks. However, there are certainly circumstances in which it would make more sense to reveal things out-of-order to better communicate about code input and subsequent output behavior. Tackling non-sequential reveal is therefore on the to do-list.
UseThere are several modalities for using flipbookr. These are presented in the following flipbook (which is built from the template delivered with the package):
in traditional presentations
An additional adaptation of the parsing and reveal code allows users to slowly reveal the components of a plot without also featuring the code to produce the plot in A flipbook minimal example, a strategy that International Health Professor Hans Rosling used in his stunning and viral presentations, and a technique that is recommended by data journalist Mona Chalabi and Harvard Professor of Government Matthew Blackwell.
The### Strategies for showing evolution
```### Guiding template
I’m currently working on a manuscript thinking about flipbooks from a theoretical perspective, describing the format and our particular implementation, as well as articulating its merits in reducing the burden in connecting code to its resultant output.
The feedback on the flipbook format has been very encouraging and a big motivation to keep working on this project. The ggplot flipbook was a top story on Hacker News and was featured as a highlight in the R Weekly newsletter.
Some of the most encouraging feedback about flipbooks has come from individuals, via Twitter. Their comments can be viewed here.
Feedback comes from individuals around the world including the following locations!
Houston, TX | Strijtem, Flanders (Belgium) | Rotterdam, The Netherlands | Utah, USA | Buenos Aires | Utah, USA | Chicago, IL | España | Washington, DC | España | Chicago | Baltimore, MD | South Africa | Aalborg, Denmark | Dresden, Germany | Orlando, FL | Philadelphia, PA | Oslo, Norway | Omaha, NE | Rotterdam, The Netherlands | UK | Switzerland | Turners Falls, MA | Montpellier, France | San Francisco, CA | San Francisco, CA | Hong Kong | Fairfax, Virginia USA | Bundoora,Victoria, Australia | Ile-de-France, France | Bundoora,Victoria, Australia | On Your Left || Bridge 4 | Chicago | Lansing, MI | Austin, TX | New York, NY | United States | United Kingdom | Chicago | Palmerston North, New Zealand | Coventry/Birmingham | Cambridge, MA | Strasbourg, France | Sydney, New South Wales | Dublin City, Ireland | RTP, NC | Tallahassee, Florida, USA | Princeton, NJ | Carrboro, NC | Yokohama City Tsurumi Ward | Rio | Boston | Sheffield/Leeds | moon | Singapore | London, England | Lisbon, Portugal | Ghana. | Vancouver, BC | Santa Barbara, CA | Houston, TX | Waco, Texas | Victoria, British Columbia | Austin, TX | Quincy, MA | Chicago, IL | Dallas, TX | Canada | Utrecht | Paris, France | Philadelphia, PA | Sydney, New South Wales | Toronto, Canada | Utrecht, The Netherlands | Ho Chi Minh, Viet Nam | Lima, Peru | Sydney | Sydney, Australia | roFL