+ - 0:00:00
Notes for current slide
Notes for next slide

Presenting like a kunoichi kunoichi with βš”οΈaringan

Earo Wang

#> 
#>  -------------- 
#> Kia Ora! I'm Earo. 
#>  --------------
#>     \
#>       \
#>         \
#>         /\_/\         _
#>        /``   \       / )
#>        |n n   |__   ( (
#>       =(Y =.β€›`   `\  \ \
#>       {`"`        \  ) )
#>       {       /    |/ /
#>        \\   ,(     / /
#>         ) ) /-β€›\  ,_.β€›
#>   jgs  (,(,/ ((,,/
#>
#> 
#>  -------------- 
#> Kia Ora! I'm Earo. 
#>  --------------
#>     \
#>       \
#>         \
#>         /\_/\         _
#>        /``   \       / )
#>        |n n   |__   ( (
#>       =(Y =.β€›`   `\  \ \
#>       {`"`        \  ) )
#>       {       /    |/ /
#>        \\   ,(     / /
#>         ) ) /-β€›\  ,_.β€›
#>   jgs  (,(,/ ((,,/
#>




I'm a lecturer zoomer.

package developer

data["research

  • Kia ora koutou.
  • Most of us will feel nervous when start presenting, like this anxious cat. But will calm down
  • Joined as a lecturer, turned out a zoomer, lecturer in pyjamas
  • The only thing I managed to upskill is zoom in the past 6 months.
  • At Uni, I teach data science, do research on data str, data wrangling, data vis
  • I make my research methods available in the form of R packages, developed a bunch of R packages.

My PhD timeline

  • Completed my PhD at Monash U
  • This beeswarm plot: gh commits
  • As a PhD student, my academic activities are roughly grouped into 3 cat: writing, coding, and presenting
  • 3 chapters, 3 packages, presenting those packages for ts.
  • In the past 3 years, I've given 15 talks, formal or informal. Academic seminars, conferences, meetups, workshops.
  • I started trying out html5 slides when I started PhD in 2016. I finally settled with xaringan when it was first out in 2016 Dec.
  • Interestingly, the first public talk I gave using xaringan, at the wombat conference. Yihui was sitting there. He was invited for the keynote.


Opinionated kunoichi

Non-opinionated xaringan

  • divided into 2 parts
  • first: how to be a kunoichi presenter, which is quite opinionated
  • Bc I'm going to share what I've learnt while presenting. No hard rules about presenting
  • Grad schools deliver workshops on presentation tips,
  • We learn presenting by presenting
  • And the second part is not opinionated. It's about xaringan.

kunoichi



HTML

Creative

Unconventional

  • Kunoichi is a Japanese word for female ninja, an unconventional presenter
  • We can creatively use our tones, gestures, facial expressions, but mostly visuals on the slides to express our thoughts.
  • To design those visuals, we need to choose tools, and tools shouldn't be a constraint, when we want to be creative and expressive.
  • Using latex beamer, I can't embed youtube videos, interactive graphics.
  • But HTML5 slides leverages the whole web technology, and allow me to produce creative visuals when needed.

Creative formats

  • Lightning talk vs TikTok
  • 20 minutes talk vs Youtube
  • 1 hour talk vs Documentary

Onsite vs remote presentations

  • Laugh alone (no passive laugh)
  • Presentation vs conversation tone
  • Not sure when to pause

πŸ›  Crafting


  1. Opening slide
  2. Motivating slide
  3. Closing slide
  • No matter what type of talk we give, (lightning) we'll have these 3 slides:
  • We do want to craft them well. Bc they are on the screen much longer than the rest of the slides.
  • I'll use my own slides as case studies.


Designing title slide

  1. Bigger than big font size
  2. Background image
  3. Google fonts
  4. Handles
  5. URLs

  • Title slide stays longer on the screen, bc you set up the computer
  • In short talks, you introduce yourself in the beginning without an extra intro slide.
  • font: cliche
  • image: evocative. I don't do it, lazy, rearrange the text positions.
  • Occasionally, I chose evocative fonts. Another good thing about H5 slides is we can use google fonts on the fly. 991
  • FA icon, but now have no idea why I chose a Halloween colour theme for a conference held in Jan.
  • wondering if I presented tidy ts, or spooky ts
  • handles: live tweeting
  • URLs (I don't share my slides url upfront anymore, to focus on my talk atm)
  • But venue is big, screen is small, URLs first

Motivating ???? beta

πŸ€¦β€β™€

  • A critical lesson I learnt from my past talks is motivation matters.
  • Motivating well will help set the tone for a successful talk. Bc motivation slides come after the title.
  • To accumulate audience's interest and grab their attention, the first 5 minutes is the key.
  • I'll give you a facepalming version of how I motivated the tsibble package

  • I gave my first tsibble talk for an internal department talk. This is the motivation page of tsibble in the early stage.
  • The targeted audience is my PhD committee, a small group of faculties and PhD students.
  • I thought I was telling my committee. Look I'm not talking about software, I'm talking about matrix. I'm doing serious research.
  • The problem is I repeated this slide at useR! and NYC R meetups. Diverse backgrounds
  • This slide is made for insiders who know ts in R well, and a narrow focus.
  • As you could imagine, half of my audience would lost the interests after this slide.

Motivating well v1.0.0

πŸ’ƒ

  • Redesign
  • Helped me to position the tsibble and write the tsibble paper



time series verse



WAT!😱

Include audience who are not just insiders, but also data scientists in general.





tidyverts

  • The focus of the tsibble is a workflow facilitator, not a matrix vs a data frame.
  • A big picture
  • Attract users who don't play with time series data.
  • A mixed group, go for breath over depth.

Thank you!

Thank you!

Questions?

Thank you!

Questions?

Fin

Thank you!

Questions?

Fin

  • One slide is wasted.
  • This slide is the background when you answering questions.
  • But almost zero information.

πŸ“Έ Closing slide with πŸ”—πŸ”—πŸ”—


slides.earo.me/rladiesakl20


πŸ“ Carpe Talk by Jenny Bryan and Mara Averick

πŸ“ Guidelines I follow when giving talks by Amelia McNamara
πŸ“ How to Present Good by Rebecca Barter
  • Ending talks with resources, I'll say "Thank you"
  • If useful and helpful, they take out their phones and fire up the cameras. They will do their homeworks
  • 3 blog posts and 4 great presenters in the R community.
  • Bc slides are in html, you probably would like a short URL to link to the slides.

Presenting is fun

βš”οΈaringan is creative fun

Presenting is fun

βš”οΈaringan is creative fun

1. Jot down in

2. Prettify with

3. Interact with

  • Presenting is fun, and xaringan adds more creative fun on top it.
  • I hope I accumulate your interests for xaringan, time to talk about it.
  • You might think, xaringan is cool, fancy, and dynamic
  • The most appealing reason to use xaringan for me is it naturally fits into presentation workflow.
  1. pour down all your thoughts and ideas in markdown
  2. style them with css
  3. for more engaging slides, add js

Unlike other h5 slides or latex beamer, e.g slidyfy, it's highly customisable and easy to customise.

Learn? Unbox and use!

install.packages("xaringan")

---
title: "Presentation Ninja"
subtitle: "βš”<br/>with xaringan"
author: "Yihui Xie"
institute: "RStudio, PBC"
date: "2016/12/12 (updated: 2020-06-15)"
output:
  xaringan::moon_reader:
    lib_dir: libs
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---
  • We don't learn markdown. Similarly, we don't learn xaringan.
  • install
  • in rstudio, create rmarkdown
  • It generates an example document for you
  • Like other RMarkdown documents, yaml, go through yaml
  • Click "knit" button, you'll get this slide

πŸ‘‡ (nested) slides

<iframe> to embed slides.yihui.org/xaringan within the current document

  • This's not a static image. It's official xaringan slides nested within my slides.
  • p3: pronouciation
  • It documents detailed usage, check it out after this talk.

Chap.

I'll continue with my cookbook. The first chapter: mark your thoughts down in Rmd

- markdown

---
background-image: url(img/kunoichi.svg)
background-position: 50% 50%
background-size: cover
class: inverse middle
## Presenting like a kunoichi with βš”οΈaringan
1. Jot down in Markdown
2. Prettify with CSS
3. Interact with JS
```{r eval = FALSE}
install.packages("xaringan") #<<
```
.footnote[image credit: Emi Tanaka]
---

Presenting like a kunoichi with βš”οΈaringan

  1. Jot down in Markdown
  2. Prettify with CSS
  3. Interact with JS
install.packages("xaringan")

image credit: Emi Tanaka

Chap.

Next chapter is styling your slides with css. Like all stuff on the web, css controls the style.

- markdown

- prettify

built-in themes

 [1] "chocolate-fonts"  "chocolate"        "default-fonts"    "default"         
 [5] "duke-blue"        "fc-fonts"         "fc"               "hygge-duke"      
 [9] "hygge"            "ki-fonts"         "ki"               "kunoichi"        
[13] "lucy-fonts"       "lucy"             "metropolis-fonts" "metropolis"      
[17] "middlebury-fonts" "middlebury"       "ninjutsu"         "rladies-fonts"   
[21] "rladies"          "robot-fonts"      "robot"            "rutgers-fonts"   
[25] "rutgers"          "shinobi"          "tamu-fonts"       "tamu"            
[29] "uo-fonts"         "uo"               "uol-fonts"        "uol"
output:
  xaringan::moon_reader:
    css: [default, rladies, rladies-fonts]
  • Don't have time to write your own CSS?
  • The default theme is not bad, but get boring quickly when you see the same style everywhere.
  • That's Yihui's motivation to make xaringan, he got bored with default beamer slides.
  • It bundles many user-contributed themes.

- markdown

- prettify

🎨 xaringanthemer

output:
  xaringan::moon_reader:
    css: xaringan-themer.css

Not a cup of tea?

- markdown

- prettify

emitanaka/ninja-theme

  • The kunoichi theme made by a cool kunoichi Emi
  • It inspired this talk's title
  • Layouts, colours, and animations bundled into one theme
  • It's a repo rather than a package

- markdown

- prettify

Ultimate custom.css

@import url('https://fonts.googleapis.com/css2?family=Libre+Barcode+128+Text&display=swap');
.encoding {
  font-family: 'Libre Barcode 128 Text', cursive;
}
---
output:
  xaringan::moon_reader:
    css: [default, custom.css]
---
.encoding[
This message is encoded.
]
<div class="encoding">
  <p>This message is encoded.</p>
</div>

This message is encoded.

  • Believe it or not, the ultimate theme is creating your own one.
  • As you progress towards kunoichi, no theme will express yourself properly until your theme comes out.

Chap.

  • Impress your audience with stylish slides
  • Engage with them by adding JS
  • Interactive graphics always look impressive
  • An excellent tool for teaching, particularly if you teach with R

- markdown

- prettify

- interact

⏱ countdown

```{r}
# remotes::install_github("gadenbuie/countdown")
countdown::countdown(minutes = 0, seconds = 42)
```
00:42

Keep Calm

and

Countdown

πŸ‘‡

  • Another package from Garrick
  • Your turn / small exercises in class and workshops
  • I'll give you 42 seconds to try out with this package, start now!
  • Works in RMarkdown documents and RStudio viewers
  • Anna, is this in your trying-out list now?

- markdown

- prettify

- interact

🀯 xaringanExtra

```{r echo = FALSE}
# remotes::install_github("gadenbuie/xaringanExtra")
xaringanExtra::use_panelset()
```
.panelset[
  .panel[.panel-name[Code]
  <!-- Code -->
  ]
  .panel[.panel-name[Plot]
  <!-- Plot -->
  ]
]
  • Yet another package from Garrick
  • Many enhanced and useful features, great additions to xaringan
  • One of my favourites is creating panels in a slide

- markdown

- prettify

- interact

πŸ“‘

Code
Plot
library(ggplot2)
ggplot(mpg, aes(displ, hwy, colour = class)) +
  geom_point()

  • code and then plot
  • or the other way around

- markdown

- prettify

- interact

Use custom.js


output:
  xaringan::moon_reader:
    includes:
      after_body: "custom.js"

data["research

Typing is powered by typed.js.

Use audio input js to control, so speak "Next page" for next page

xaringan in class

  • Give 2 eg how xaringan used in class
  • WCD at Monash Uni and Data vis at Georgia state

βž•

  • Use H5 slides with R, sky is not the limit.
  • htmlwidgets for making plotly, leaflet
  • use gganimate to embed incredible animations
  • gt (grammar of tables) for amazing tables, talk/tutorials/workshops on gt?

portable || dynamic

slides.earo.me/rladiesakl20

earowang/rladiesakl20

remark.js

Presentation ninja

Making slides in R Markdown

xaringan wiki

Infinite moon reader

#> 
#>  -------------- 
#> Kia Ora! I'm Earo. 
#>  --------------
#>     \
#>       \
#>         \
#>         /\_/\         _
#>        /``   \       / )
#>        |n n   |__   ( (
#>       =(Y =.β€›`   `\  \ \
#>       {`"`        \  ) )
#>       {       /    |/ /
#>        \\   ,(     / /
#>         ) ) /-β€›\  ,_.β€›
#>   jgs  (,(,/ ((,,/
#>
Paused

Help

Keyboard shortcuts

↑, ←, Pg Up, k Go to previous slide
↓, β†’, Pg Dn, Space, j Go to next slide
Home Go to first slide
End Go to last slide
Number + Return Go to specific slide
b / m / f Toggle blackout / mirrored / fullscreen mode
c Clone slideshow
p Toggle presenter mode
t Restart the presentation timer
?, h Toggle this help
Esc Back to slideshow