Improve presentation text

This commit is contained in:
Mattéo Delabre 2020-11-29 22:57:48 +01:00
bovenliggende bf2730f991
commit 1490ea6ad7
Getekend door: matteo
GPG sleutel-ID: AE3FBD02DC583ABB
3 gewijzigde bestanden met toevoegingen van 27 en 20 verwijderingen

Bestand weergeven

@ -1,15 +1,15 @@
# YouTube Maze
Some YouTube creators have made video-gamebooks during which viewers can make choices that influence the course of the narration.
Some YouTube creators have made video-gamebooks during which viewers are invited to make choices that influence the course of the narration.
This is generally implemented by breaking up the video into short interlinked segments.
This tool automatically generates a visual representation of networks underlying such games by automatically exploring the video maze starting from a root video.
This tool automatically generates visual representations of the networks underlying such games.
[See it live →](https://youtube-maze.delab.re)
## How Does it Work?
The [algorithm](lib/explore.mjs) starts at the first video and explores the links recursively using a breadth-first search approach, keeping track of the links as it goes.
The [Graphviz](http://www.graphviz.org/) library is used to automatically lay out the graph so that as few edges cross as possible.
The [exploration algorithm](lib/explore.mjs) automatically downloads metadata about each video from YouTube and then proceeds to a breadth-first search to generate a graph which is laid out using [Graphviz](http://www.graphviz.org).
Only the links in the end screens and in the in-video cards are considered for the exploration.
## Running Locally

Bestand weergeven

@ -9,29 +9,36 @@
<h1>YouTube Maze</h1>
<p>
Some YouTube creators have made video-gamebooks during which viewers can make choices that influence the course of the narration.
Some YouTube creators have made video-gamebooks during which viewers are invited to make choices that influence the course of the narration.
This is generally implemented by breaking up the video into short interlinked segments.
This tool automatically generates a visual representation of networks underlying such games by automatically exploring the video maze starting from a root video.
This tool automatically generates visual representations of the networks underlying such games.
</p>
<p>
<a href="https://forge.delab.re/matteo/youtube-maze">See the source code →</a>
</p>
<h2>Generate a graph</h2>
<form action="/mazes" method="POST">
<p>
<input type="text" name="url" placeholder="Enter the URL of a YouTube video to generate the graph…">
<input type="submit" value="Generate">
</p>
</form>
<h2>Some examples</h2>
<ul>
<li><a href="/mazes/EZGra6O8ClQ">e-penser — “1 avril 2017”</a></li>
<li><a href="/mazes/XM1ssJ8yxdg">Defakator — “Le YouTube Game”</a></li>
</ul>
<h2>Generate a graph</h2>
<form action="/mazes" method="POST">
<p>
<input type="text" name="url" placeholder="Enter the URL of any YouTube video to start from…">
<input type="submit" value="Generate">
</p>
</form>
<h2>More information</h2>
<p>
The exploration algorithm automatically downloads metadata about each video from YouTube and then proceeds to a breadth-first search to generate a graph which is laid out using <a href="http://www.graphviz.org">Graphviz</a>.
Only the links in the end screens and in the in-video cards are considered for the exploration.
</p>
<p>
<a href="https://forge.delab.re/matteo/youtube-maze">See the source code →</a>
</p>
</body>
</html>

Bestand weergeven

@ -62,7 +62,7 @@ body
line-height: var(--base-unit);
color: var(--text-color);
width: 15cm;
width: 16cm;
margin: calc(4 * var(--base-unit)) auto;
background: var(--background-color);