rework site structure one more time

_freeze/slides/telling-a-story/execute-results/html.json

@@ -0,0 +1,21 @@
+{
+  "hash": "6912e5c165ee2db004272081678f740b",
+  "result": {
+    "engine": "knitr",
+    "markdown": "---\ntitle: \"Telling a story\"\nauthor: \"Claus O. Wilke\"\nformat: \n  revealjs:\n    theme:\n      - default\n      - Wilke-theme.scss\n    auto-stretch: false\nexecute:\n  fig-format: svg\n  fig-asp: 0.618\n  fig-width: 5.5\n---\n\n\n\n\n\n\n## How did I get to teach data visualization?\n\n![](../assets/telling-a-story/cowplot-logo.svg){.fragment .absolute  top=\"22%\" left=\"13%\" width=\"30%\" }\n\n![](https://clauswilke.com/dataviz/cover.png){.fragment .absolute  top=\"20%\" left=\"53%\" width=\"30%\" style=\"box-shadow: 3px 5px 3px 1px #00000080;\"}\n\n## What is a story?\n\n<br>\n\n::: {.fragment}\nA story is a collection of observations, facts, or events presented in a specific order such that they create an [emotional reaction.]{.highlight}\n:::\n\n\n## Every story needs an arc\n\n::: {.fragment .center-text}\nOpening\n:::\n\n::: {.fragment .center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: 0; margin-bottom: -0.3em;\"}\n\nChallenge\n:::\n\n::: {.fragment .center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: 0; margin-bottom: -0.3em;\"}\n\nAction\n:::\n\n::: {.fragment .center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: 0; margin-bottom: -0.3em;\"}\n\nResolution\n:::\n\n## Every story needs an arc\n\n::: {.center-text}\nOpening\n:::\n\n::: {.center-text .highlight}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: 0; margin-bottom: -0.3em;\"}\n\nChallenge\n:::\n\n::: {.center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: 0; margin-bottom: -0.3em;\"}\n\nAction\n:::\n\n::: {.center-text .highlight}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: 0; margin-bottom: -0.3em;\"}\n\nResolution\n:::\n\n::: {.absolute-bottom-right .small-font}\nChallenge and resolution are<br>the two most important parts\n:::\n\n## Mapping my story onto this format\n\n::: {.fragment .small-font .move-down-1em}\n**Opening:** We need to make many data visualizations in my lab\n:::\n\n::: {.fragment .small-font .move-down-1em}\n**Challenge:** I end up telling my students the same things over and over\n:::\n\n::: {.fragment .small-font .move-down-1em}\n**Action:** I go and write a book about data visualization\n:::\n\n::: {.fragment .small-font .move-down-1em}\n**Resolution:** The book is written. But now I teach the material, so I still keep saying the same things over and over\n:::\n\n## Other story structures\n\n::: {.fragment .center-text .move-up-half-em}\nAction\n:::\n\n::: {.fragment .center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: -0.1em; margin-bottom: -0.5em;\"}\n\nBackground\n:::\n\n::: {.fragment .center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: -0.1em; margin-bottom: -0.5em;\"}\n\nDevelopment\n:::\n\n::: {.fragment .center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: -0.1em; margin-bottom: -0.5em;\"}\n\nClimax\n:::\n\n::: {.fragment .center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: -0.1em; margin-bottom: -0.5em;\"}\n\nEnding\n:::\n\n::: {.fragment .absolute-bottom-right .small-font}\n(Better for action movies<br>than for scientific reports)\n:::\n\n## Mapping my story onto this format\n\n::: {.fragment .move-down-1em .small-font}\n**Action:** In May 2017, I embark on a major project: Write a book on data visualization\n:::\n\n::: {.fragment .move-down-1em .small-font}\n**Background:** I do this because we need to make many data visualizations in my lab, and I end up telling my students the same things over and over\n:::\n\n::: {.fragment .move-down-1em .small-font}\n**Development:** Writing the book takes me almost two years; along the way, I add many features to ggplot2 and become a member of the ggplot2 team\n:::\n\n::: {.fragment .move-down-1em .small-font}\n**Climax:** The book is released in April 2019\n:::\n\n::: {.fragment .move-down-1em .small-font}\n**Ending:** Now I'm a dataviz teacher\n:::\n\n## Other story structures\n\n<br><br>\n\n::: {.fragment .center-text}\nLead\n:::\n\n::: {.fragment .center-text}\n![](../assets/telling-a-story/arrow.svg){width=\"3%\" style=\"margin-top: 0; margin-bottom: -0.3em;\"}\n\nDevelopment\n:::\n\n::: {.fragment .absolute-bottom-right .small-font}\n(Commonly used in newspaper articles)\n:::\n\n## Mapping my story onto this format\n\n::: {.fragment .small-font .move-down-1em}\n**Lead:** Because I see the need for more education in data visualization, I have written an entire book about the topic\n:::\n\n::: {.fragment .small-font .move-down-1em}\n**Development:** I had previously written an R package to improve figure design, but it wasn't sufficient: Good judgement cannot be automated\n:::\n\n::: {.fragment .small-font .move-down-1em}\nSo I wrote a book; the book is entirely about concepts, not about coding, and it is meant as a resource for anybody doing data visualizations, regardless of their preferred visualization software\n:::\n\n<!-- Segment ends here -->\n\n# Telling a story with figures\n\n## Example: Preprints in biology\n\n\n\n\n::: {.cell}\n::: {.cell-output-display}\n![&nbsp;](telling-a-story_files/figure-revealjs/preprints-part1-1.svg){width=80%}\n:::\n:::\n\n\n\n\n::: {.absolute-bottom-right}\nOpening\n:::\n\n## Example: Preprints in biology\n\n\n\n\n::: {.cell}\n::: {.cell-output-display}\n![&nbsp;](telling-a-story_files/figure-revealjs/preprints-part2-1.svg){width=80%}\n:::\n:::\n\n\n\n\n[What happened in 2014 to curtail the growth?]{.small-font style=\"position: absolute; top: 42%; left: 58%; width: 3.8in; background: white;\"}\n\n\n::: {.absolute-bottom-right}\nChallenge\n:::\n\n## Example: Preprints in biology\n\n\n\n\n::: {.cell}\n::: {.cell-output-display}\n![&nbsp;](telling-a-story_files/figure-revealjs/preprints-part3-1.svg){width=80%}\n:::\n:::\n\n\n\n\n[bioRxiv opened in 2014]{.small-font style=\"position: absolute; top: 60%; left: 62%; width: 3.8in; background: white;\"}\n\n\n::: {.absolute-bottom-right}\nResolution\n:::\n\n## Keep in mind\n\n::: {.incremental}\n- Every figure needs a clear purpose within the story arc\n- A complete arc will usually require at least two figures\n:::\n\n## Prepare figures that make a clear point\n\n:::{.fragment}\n\n\n\n::: {.cell}\n::: {.cell-output-display}\n![&nbsp;](telling-a-story_files/figure-revealjs/arrival-delay-vs-distance-1.svg){width=80%}\n:::\n:::\n\n\n\n:::\n\n## Prepare figures that make a clear point\n\n\n\n\n::: {.cell}\n::: {.cell-output-display}\n![&nbsp;](telling-a-story_files/figure-revealjs/mean-arrival-delay-nyc-1.svg){width=80%}\n:::\n:::\n\n\n\n\n[American and Delta have the shortest delays]{.small-font style=\"position: absolute; top: 14%; left: 38%; width: 3.8in; background: white;\"}\n\n## Make your figures memorable\n\n<br>\n\n![](https://clauswilke.com/dataviz/telling_a_story_files/figure-html/petownership-bar-1.png){.fragment width=\"80%\" fig-align=\"center\"}\n\n## Make your figures memorable\n\n<br>\n\n![](https://clauswilke.com/dataviz/telling_a_story_files/figure-html/petownership-isotype-1.png){width=\"80%\" fig-align=\"center\"}\n\n<!-- Segment ends here -->\n\n## Further reading\n\n::: {.small-font}\n- Fundamentals of Data Visualization: [Chapter 29: Telling a story and making a point](https://clauswilke.com/dataviz/telling-a-story.html)\n\n- Joshua Schimel (2011) Writing Science: How to Write Papers That Get Cited and Proposals That Get Funded\n:::",
+    "supporting": [
+      "telling-a-story_files"
+    ],
+    "filters": [
+      "rmarkdown/pagebreak.lua"
+    ],
+    "includes": {
+      "include-after-body": [
+        "\n<script>\n  // htmlwidgets need to know to resize themselves when slides are shown/hidden.\n  // Fire the \"slideenter\" event (handled by htmlwidgets.js) when the current\n  // slide changes (different for each slide format).\n  (function () {\n    // dispatch for htmlwidgets\n    function fireSlideEnter() {\n      const event = window.document.createEvent(\"Event\");\n      event.initEvent(\"slideenter\", true, true);\n      window.document.dispatchEvent(event);\n    }\n\n    function fireSlideChanged(previousSlide, currentSlide) {\n      fireSlideEnter();\n\n      // dispatch for shiny\n      if (window.jQuery) {\n        if (previousSlide) {\n          window.jQuery(previousSlide).trigger(\"hidden\");\n        }\n        if (currentSlide) {\n          window.jQuery(currentSlide).trigger(\"shown\");\n        }\n      }\n    }\n\n    // hookup for slidy\n    if (window.w3c_slidy) {\n      window.w3c_slidy.add_observer(function (slide_num) {\n        // slide_num starts at position 1\n        fireSlideChanged(null, w3c_slidy.slides[slide_num - 1]);\n      });\n    }\n\n  })();\n</script>\n\n"
+      ]
+    },
+    "engineDependencies": {},
+    "preserve": {},
+    "postProcess": true
+  }
+}

_freeze/slides/test/execute-results/html.json

@@ -0,0 +1,19 @@
+{
+  "hash": "46688b6519feeede427450b4f0a592d5",
+  "result": {
+    "engine": "knitr",
+    "markdown": "---\ntitle: \"Telling a story\"\nauthor: \"Claus O. Wilke\"\nformat: \n  revealjs:\n    theme:\n      - default\n      - Wilke-theme.scss\n    auto-stretch: false\nexecute:\n  fig-format: svg\n  fig-asp: 0.618\n  fig-width: 5.5\n---\n\n\n\n\n\n## How did I get to teach data visualization?\n\n![](../assets/telling-a-story/cowplot-logo.svg){.fragment .absolute  top=\"22%\" left=\"13%\" width=\"30%\" }\n\n![](https://clauswilke.com/dataviz/cover.png){.fragment .absolute  top=\"20%\" left=\"53%\" width=\"30%\" style=\"box-shadow: 3px 5px 3px 1px #00000080;\"}\n",
+    "supporting": [],
+    "filters": [
+      "rmarkdown/pagebreak.lua"
+    ],
+    "includes": {
+      "include-after-body": [
+        "\n<script>\n  // htmlwidgets need to know to resize themselves when slides are shown/hidden.\n  // Fire the \"slideenter\" event (handled by htmlwidgets.js) when the current\n  // slide changes (different for each slide format).\n  (function () {\n    // dispatch for htmlwidgets\n    function fireSlideEnter() {\n      const event = window.document.createEvent(\"Event\");\n      event.initEvent(\"slideenter\", true, true);\n      window.document.dispatchEvent(event);\n    }\n\n    function fireSlideChanged(previousSlide, currentSlide) {\n      fireSlideEnter();\n\n      // dispatch for shiny\n      if (window.jQuery) {\n        if (previousSlide) {\n          window.jQuery(previousSlide).trigger(\"hidden\");\n        }\n        if (currentSlide) {\n          window.jQuery(currentSlide).trigger(\"shown\");\n        }\n      }\n    }\n\n    // hookup for slidy\n    if (window.w3c_slidy) {\n      window.w3c_slidy.add_observer(function (slide_num) {\n        // slide_num starts at position 1\n        fireSlideChanged(null, w3c_slidy.slides[slide_num - 1]);\n      });\n    }\n\n  })();\n</script>\n\n"
+      ]
+    },
+    "engineDependencies": {},
+    "preserve": {},
+    "postProcess": true
+  }
+}

_quarto.yml

@@ -2,11 +2,10 @@ project:
   type: website
   render:
     - "*.qmd"
-    - "!slides/"
     - "!worksheets/"
   resources:
-    - "slides/"
     - "worksheets/"
+    - "assets/"
 
 website:
   title: "SDS 366"
@@ -23,9 +22,9 @@ website:
     - text: "Slides"
       menu:
         - text: "Class 2: Aesthetic mappings"
-          href: slides/aesthetic-mappings.html
+          href: slides/aesthetic-mappings.qmd
         - text: "Class 3: Telling a story"
-          href: slides/telling-a-story.html
+          href: slides/telling-a-story.qmd
 
     - text: "Worksheets"
       menu:
@@ -40,5 +39,7 @@ format:
     css: styles.css
     toc: true
 
+execute: 
+  freeze: auto