## Temporary file sharing with Moat, Lightweight Animation with Shimmy, Advanced Markdown with HackMD, Games at the Library
#### Dethe Elza, Digital Services Technician ![Richmond Public Library logo](https://i.imgur.com/FHgzTaQ.jpg =180x58)
----
* Four lightning talks in one!
* Some are even related
* Let's talk about the loosely related ones first
----
### Advanced Markdown with HackMD
* HackMD is a useful online tool for writing, sharing, and collaborating on markdown documents
* This presentation written in it
* Can link docs together like a wiki
* I use it to collaborate with myself, i.e., access docs from whatever computer I happen to be on, anywhere
* That's not the advanced part
----
### The Advanced Part
#### Mathjax
$$
x = {-b \pm \sqrt{b^2-4ac} \over 2a}.
$$
$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$
----
#### Sequence
```sequence
Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!
Note left of Alice: Alice responds
Alice->Bob: Where have you been?
```
----
#### Flow
```flow
st=>start: Start|past:>http://www.google.com[blank]
e=>end: End|future:>http://www.google.com
op1=>operation: My Operation|past
op2=>operation: Stuff|current
sub1=>subroutine: My Subroutine|invalid
cond=>condition: Yes
or No?|approved:>http://www.google.com
c2=>condition: Good idea|rejected
io=>inputoutput: catch something...|future
st->op1(right)->cond
cond(yes, right)->c2
cond(no)->sub1(left)->op1
c2(yes)->io->e
c2(no)->op2->e
```
----
#### Graphviz
```graphviz
digraph hierarchy {
nodesep=1.0 // increases the separation between nodes
node [color=Red,fontname=Courier,shape=box] //All nodes will this shape and colour
edge [color=Blue, style=dashed] //All the lines look like this
Headteacher->{Deputy1 Deputy2 BusinessManager}
Deputy1->{Teacher1 Teacher2}
BusinessManager->ITManager
{rank=same;ITManager Teacher1 Teacher2} // Put them on the same level
}
```
----
#### Mermaid
```mermaid
gantt
title A Gantt Diagram
section Section
A task :a1, 2014-01-01, 30d
Another task :after a1 , 20d
section Another
Task in sec :2014-01-12 , 12d
anther task : 24d
```
----
#### ABC
```abc
X:1
T:Speed the Plough
M:4/4
C:Trad.
K:G
|:GABc dedB|dedB dedB|c2ec B2dB|c2A2 A2BA|
GABc dedB|dedB dedB|c2ec B2dB|A2F2 G4:|
|:g2gf gdBd|g2f2 e2d2|c2ec B2dB|c2A2 A2df|
g2gf g2Bd|g2f2 e2d2|c2ec B2dB|A2F2 G4:|
```
----
#### PlantUML
```plantuml
start
if (condition A) then (yes)
:Text 1;
elseif (condition B) then (yes)
:Text 2;
stop
elseif (condition C) then (yes)
:Text 3;
elseif (condition D) then (yes)
:Text 4;
else (nothing)
:Text else;
endif
stop
```
----
#### Vega Lite
```vega
{
"$schema": "https://vega.github.io/schema/vega-lite/v4.json",
"data": {"url": "https://vega.github.io/editor/data/barley.json"},
"mark": "bar",
"encoding": {
"x": {"aggregate": "sum", "field": "yield", "type": "quantitative"},
"y": {"field": "variety", "type": "nominal"},
"color": {"field": "site", "type": "nominal"}
}
}
```
----
#### Fretboard
```fretboard {title="horizontal, 5 frets", type="h6 noNut"}
-oO-*-
--o-o-
-o-oo-
-o-oO-
-oo-o-
-*O-o-
```
----
#### Also...
* Slide Mode (these slides are in HackMD)
* Book Mode
* Embedding
* Table of Contents
* Automatically saved and versioned
* Much more, check it out: https://hackmd.io/
* Look at the source of these slides :smile:
----
### Games at the Library
* https://yourlibrary.ca/rplgames
* Text adventures and escape rooms
* Created by staff and members
* Tie in to writing and game-making workshops
* Will eventually tie in to the other tools (foreshadowing!)
----
### Temporary file sharing with Moat
* We had a problem in the Before Times, a lot of our content creation workshops were done on iPads
* Hard to give members access to the work they created
* Mostly, it got thrown away
----
### Moat to the rescue
* https://glitch.com/edit/#!/sd-moat
* Moat allows creation of a temporary file share
* Only applicable for a specific program at a specific time
* Gives member a link (URL, code, or QR code) to their work
* Link expires after 2 weeks or 3 downloads
* Can be integrated into apps or used standalone
* Open source!
----
### Lightweight Animation with Shimmy
* https://launchpad.yourlibrary.ca/shimmy/
* Simple web-based tool for sketch-based flipbook style animation
* Intentionally limited
* Big buttons, so can be used with fingers on mobile devices or mouse on desktop
* Integrates with Moat, of course
* Open source!
----
### Shimmy tutorials
Playlist: https://youtube.com/playlist?list=PLjgCLYVYeo2zEJh_JMlXumvWkfZbugZkV
![](https://i.imgur.com/GjKbaqs.gif =300x)
----
### But wait, there's more
* **Shimmy** is the first of the content creation tools we want to build as part of a suite of tools and libraries under the umbrella project of Sketchdance
* All web-based, free, open source
* **Veil**: Greenscreen effects
* **Jitter**: Stop-motion animation
* **Gammaray**: Special FX
* **Xastle**: Social network for content tools
----
### Back to games for a moment
* **Garden**, a tool for collaborative text-based games is in early stages
* Kind of like a modern MUD for the web
* Multiple simultaneous authors
* Multiple simultaneous players
* Room-based chat
* Looking to integrate with Twine
----
### And the triumphant return of **Waterbear**
* Block-based visual programming for the web
* Inspired by Scratch, but with the training wheels taken off
* Ideally you should be able to code anything you could with JavaScript
* Will include tools for bridging the gap between visual and text-based programming
----
![Waterbear as library image](http://waterbearlang.com/images/mascot/mascot-librarian.jpg =400x)
----
# Community is key
* Tools belong to the community
* Current bus factor: 1
* Working on
* Coding standards
* Design guidelines
* Community Participation Guidelines
* Communication channels
* Governance structure
Making it open source was the easy part!
----
# Thank You!
If any of this struck a chord, please let me know!
* dethe.elza@yourlibrary.ca
* https://twitter.com/dethe
* https://github.com/dethe
* https://glitch.com/@dethe
* https://hackmd.io/@dethe
* https://codepen.io/dethe
You get the picture...
----
# Questions?
{"metaMigratedAt":"2023-06-15T19:55:13.970Z","metaMigratedFrom":"YAML","title":"Sketchdance @ Code4LibBC","breaks":"true","slideOptions":"{\"parallaxBackgroundImage\":\"https://i.imgur.com/6VC8AQ3.png\"}","contributors":"[{\"id\":\"ba976eb2-a74e-4fcb-ac97-933f7d5588d7\",\"add\":7135,\"del\":544}]"}