324 lines
12 KiB
HTML
324 lines
12 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
|
||
<title>Les Fractales - des maths dans mon chat ?</title>
|
||
<meta name="description" content="Les Fractales expliqué aux enfants.">
|
||
<meta name="author" content="Yann Esposito">
|
||
|
||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||
|
||
<link rel="stylesheet" href="css/reveal.min.css">
|
||
<link rel="stylesheet" href="css/theme/serif.css" id="theme">
|
||
<!-- For syntax highlighting -->
|
||
<link rel="stylesheet" href="lib/css/zenburn.css">
|
||
<!-- If the query includes 'print-pdf', use the PDF print sheet -->
|
||
<script>
|
||
document.write( '<link rel="stylesheet" href="css/print/' + ( window.location.search.match( /print-pdf/gi ) ? 'pdf' : 'paper' ) + '.css" type="text/css" media="print">' );
|
||
</script>
|
||
<!--[if lt IE 9]>
|
||
<script src="lib/js/html5shiv.js"></script>
|
||
<![endif]-->
|
||
<style>
|
||
.base03{color:#002b36}
|
||
.base02{color:#073642}
|
||
.base01{color:#586e75}
|
||
.base00{color:#657b83}
|
||
.base0{color:#839496}
|
||
.base1{color:#93a1a1}
|
||
.base2{color:#eee8d5}
|
||
.base3{color:#fdf6e3}
|
||
.yellow{color:#b58900}
|
||
.orange{color:#cb4b16}
|
||
.red{color:#dc322f}
|
||
.magenta{color:#d33682}
|
||
.violet{color:#6c71c4}
|
||
.blue{color:#268bd2}
|
||
.cyan{color:#2aa198}
|
||
.green{color:#859900}
|
||
.reveal code{font-size: 0.8em;}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="reveal">
|
||
<!-- Any section element inside of this container is displayed as a slide -->
|
||
<div class="slides">
|
||
|
||
<section>
|
||
<h1>Les Fractales</h1>
|
||
<h3>Les maths cachées dans ton chat</h3>
|
||
<img src="img/fractal-cat.jpg" alt="fractal cat"/>
|
||
<p><small>Par <a href="http://yannesposito.com">Yann Esposito</a></small></p>
|
||
</section>
|
||
|
||
<section>
|
||
<h2>Moi</h2>
|
||
<ul>
|
||
<li>Section Générale au Lycée</li>
|
||
<li>Bac S option Math</li>
|
||
<li>Licence Math/Informatique</li>
|
||
<li>Master Recherche Informatique</li>
|
||
<li>Doctorat Informatique (Intelligence Artificielle)</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<section>
|
||
<section>
|
||
<h2>Les fractales ça peut être très beau</h2>
|
||
<iframe src="http://player.vimeo.com/video/8601479"
|
||
width="800"
|
||
height="500"
|
||
frameborder="0"
|
||
webkitAllowFullScreen
|
||
mozallowfullscreen
|
||
allowFullScreen></iframe>
|
||
<p><a href="http://vimeo.com/8601479" target="_blank">lien →</a></p>
|
||
</section>
|
||
|
||
<section>
|
||
<h2>Les fractales ça peut être très étrange</h2>
|
||
<img src="img/fractal-gorilla.jpg" alt="gorilla fractal" width="70%"/>
|
||
</section>
|
||
|
||
<section>
|
||
<h2>Les fractales ça peut ressembler à la réalité</h2>
|
||
<img src="img/Shells.jpg" alt="Shells" width="70%"/>
|
||
<p><a class="small" href="http://www.deviantart.com/art/Rotbox-Beach-337639948">source</a></p>
|
||
</section>
|
||
</section>
|
||
|
||
<section>
|
||
<section>
|
||
<h2>Les fractales ça existe dans la vie</h2>
|
||
<img src="img/choux.jpg" alt="Choux"/>
|
||
</section>
|
||
<section>
|
||
<h2>Les broccolis</h2>
|
||
<img src="img/broccoli.jpg" alt="Broccolis"/>
|
||
</section>
|
||
<section>
|
||
<h2>Le choux romanesco</h2>
|
||
<img src="img/romanesco.jpg" alt="Choux Romanesco"/>
|
||
</section>
|
||
<section>
|
||
<h2>Coquille</h2>
|
||
<img src="img/shell.jpg" alt="Coquille"/>
|
||
</section>
|
||
<section>
|
||
<h2>Paons</h2>
|
||
<img src="img/paon.jpg" alt="Paon"/>
|
||
</section>
|
||
<section>
|
||
<h2>Rivières</h2>
|
||
<img src="img/fractal-river.jpg" alt="Rivière"/>
|
||
</section>
|
||
</section>
|
||
|
||
<section>
|
||
<section>
|
||
<h2>Les Math avant les fractales (Descartes)</h2>
|
||
<img src="img/cartesien.jpg" alt="Descartes"/>
|
||
</section>
|
||
<section>
|
||
<h2>Gaston Maurice Julia</h2>
|
||
<img src="img/gaston-julia.jpg" alt="Gaston Julia"/>
|
||
</section>
|
||
<section>
|
||
<h2>Benoît B. Mandelbrot</h2>
|
||
<img src="img/Benoit-Mandelbrot.jpg" alt="Benoit B. Mandelbrot" width="35%"/>
|
||
</section>
|
||
</section>
|
||
|
||
<section>
|
||
<section>
|
||
<h2>Quelle est la longueur des cotes de la Bretagne?</h2>
|
||
<img src="img/bretagne.jpg" alt="La bretagne" width="50%"/>
|
||
</section>
|
||
<section>
|
||
<h2>Quelle est la longueur des cotes de la Bretagne?</h2>
|
||
<img src="img/bretagne01.jpeg" alt="La bretagne" width="50%"/>
|
||
<p>1000km?</p>
|
||
</section>
|
||
<section>
|
||
<h2>Quelle est la longueur des cotes de la Bretagne?</h2>
|
||
<img src="img/bretagne02.jpeg" alt="La bretagne" width="50%"/>
|
||
<p>2000km?</p>
|
||
</section>
|
||
</section>
|
||
<section>
|
||
<section>
|
||
<h2>L-Systems</h2>
|
||
<img src="img/franklin.jpg" alt="Franklin"/>
|
||
</section>
|
||
<section>
|
||
<h2>L-Systems</h2>
|
||
<ul><li>Règles de réécritures
|
||
</li><li><span style="border:solid;border-color:#DC322F;">F → <span class="red">F+F-F</span></span>
|
||
</li><li>F → <span class="red">F</span>+<span class="blue">F</span>-<span class="green">F</span> → <span class="red">F+F-F</span> + <span class="blue">F+F-F</span> - <span class="green">F+F-F</span>
|
||
</li><li><span class="red">F+F-F</span> + <span class="blue">F+F-F</span> - <span class="green">F+F-F</span>
|
||
→ <br/>
|
||
<span class="red">F+F-F</span> + <span class="red">F+F-F</span> -<span class="red">F+F-F</span>
|
||
<br/> + <span class="blue">F+F-F</span> + <span class="blue">F+F-F</span> -<span class="blue">F+F-F</span>
|
||
<br/> - <span class="green">F+F-F</span> + <span class="green">F+F-F</span> -<span class="green">F+F-F</span>
|
||
|
||
</li><li> 1 → 3 → 9 → 27 → 81 → 243 ...
|
||
</li></ul>
|
||
</section>
|
||
<section>
|
||
<h2>L-Systems</h2>
|
||
<img src="img/franklin-letters.jpg" alt="Franklin letters"/>
|
||
<ul><li>Tortue avec un crayon
|
||
</li><li>F → Avance
|
||
</li><li>+ → Tourne à gauche
|
||
</li><li>- → Tourne à droite
|
||
</li></ul>
|
||
<p>Inventé par un biologiste (algues)</p>
|
||
<a href="http://www.kevs3d.co.uk/dev/lsystems/">TEST sur <code style="border:1px solid">http://goo.gl/N5fG2</code></a>
|
||
</section>
|
||
<section>
|
||
<h2>L-Systems</h2>
|
||
<img src="img/lsystemOnline.png" alt="L-System parameters"/>
|
||
</section>
|
||
<section>
|
||
<h2>L-Systems</h2>
|
||
<p>12 fois → 3<sup>12</sup> = 531441</p>
|
||
<img src="img/lsystem.png" alt="an L-System fractal"/>
|
||
</section>
|
||
</section>
|
||
<section>
|
||
<section>
|
||
<h2>Longueur ?</h2>
|
||
<p>Flocon: <code>F → F+F--F+F</code></p>
|
||
<img src="img/flocon1.png" alt="flocon 1"/>
|
||
</section>
|
||
<section>
|
||
<h2>Longueur ?</h2>
|
||
<p>Flocon: <code>F → F+F--F+F</code></p>
|
||
<img src="img/flocon-calculs.png" alt="flocon calcul"/>
|
||
<p>Longeur (1): <strong class="red">1.171</strong></p>
|
||
</section>
|
||
<section>
|
||
<h2>Longueur ?</h2>
|
||
<img src="img/flocon2.png" alt="flocon 2"/>
|
||
<p>Longeur (2): 1.171×1.171 ≃ 1.371</p>
|
||
</section>
|
||
<section>
|
||
<h2>Longueur ?</h2>
|
||
<img src="img/flocon3.png" alt="flocon 3"/>
|
||
<p>Longeur (3): 1.171×1.171×1.171 ≃ 1.605</p>
|
||
</section>
|
||
<section>
|
||
<h2>Longueur ?</h2>
|
||
<img src="img/flocon6.png" alt="flocon 6"/>
|
||
<p>Longeur (6) ≃ 2.578</p>
|
||
</section>
|
||
<section>
|
||
<h2>Longueur ?</h2>
|
||
<img src="img/flocon10.png" alt="flocon 10"/>
|
||
<p>Longeur (10) ≃ 4.84</p>
|
||
</section>
|
||
<section>
|
||
<h2>Quelle est la longueur des cotes de la Bretagne?</h2>
|
||
<img src="img/bretagne.jpg" alt="La bretagne" width="50%"/>
|
||
<p>Sans donner de précision, la longueur est sans borne</p>
|
||
<p>Elle pourrait être infinie !</p>
|
||
<p>En tout cas beaucoup plus que 2000km</p>
|
||
</section>
|
||
</section>
|
||
<section>
|
||
<section>
|
||
<h2>Ensemble de Mandelbrot</h2>
|
||
<iframe src="http://player.vimeo.com/video/12185093"
|
||
width="800"
|
||
height="500"
|
||
frameborder="0"
|
||
webkitAllowFullScreen
|
||
mozallowfullscreen
|
||
allowFullScreen></iframe>
|
||
</section>
|
||
|
||
<section>
|
||
<h2>Une idée de la taille ?</h2>
|
||
<p>Agrandir de 1 à 6×10<sup>228</sup> revient à faire grandir un proton pour être aussi grand que<br/> 7 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000 000<br/> de fois la taille de l'Univers visible</p>
|
||
</section>
|
||
<section>
|
||
<h2>Une infinité de détail</h2>
|
||
<p>Avec une tout petite formule: z=z<sup>2</sup>+c</p>
|
||
</section>
|
||
<section>
|
||
<h2>Exploration</h2>
|
||
<p><a href="http://people.canonical.com/~jamesh/fractal/mandelbrot.html"><code>http://goo.gl/Bfgil</code></a> </p>
|
||
</section>
|
||
</section>
|
||
|
||
<section>
|
||
<section>
|
||
<h2>Flame</h2>
|
||
<p>Une flamme et des mirroirs</p>
|
||
<p>On pose une chandelle allumé dans le noir.</p>
|
||
<p>Au milieu de quelques miroirs déformants (ou pas)</p>
|
||
<p>Et ça donne ça:</p>
|
||
<p>TEST sur <a href="http://rectangleworld.com/demos/ChaosGame2/chaos_game_2.html"><code>http://goo.gl/gkaKZ</code></a></p>
|
||
</section>
|
||
<section>
|
||
<h2>Video</h2>
|
||
<iframe src="http://player.vimeo.com/video/10159449"
|
||
width="800"
|
||
height="500"
|
||
frameborder="0"
|
||
webkitAllowFullScreen
|
||
mozallowfullscreen
|
||
allowFullScreen></iframe>
|
||
<p><a href="http://vimeo.com/10159449" target="_blank">lien →</a></p>
|
||
</section>
|
||
</section>
|
||
|
||
<section>
|
||
<h2>Questions ?</h2>
|
||
<h3>Des liens à noter</h3>
|
||
<ul><li><a href="http://yogsototh.github.com/fractal-presentation">Cette presentation <code>http://goo.gl/n282L</code> </a>
|
||
</li><li><a href="http://electricsheep.org/" target="_blank">Electric sheep <code>http://electricsheep.org</code></a>
|
||
</li><li><a href="http://www.apophysis.org/" target="_blank">Apophysis <code>http://apophysis.org</code> (Windows)</a>
|
||
</li></ul>
|
||
</section>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<script src="lib/js/head.min.js"></script>
|
||
<script src="js/reveal.min.js"></script>
|
||
|
||
<script>
|
||
|
||
// Full list of configuration options available here:
|
||
// https://github.com/hakimel/reveal.js#configuration
|
||
Reveal.initialize({
|
||
controls: true,
|
||
progress: true,
|
||
history: true,
|
||
center: true,
|
||
|
||
theme: Reveal.getQueryHash().theme, // available themes are in /css/theme
|
||
transition: Reveal.getQueryHash().transition || 'zoom', // default/cube/page/concave/zoom/linear/fade/none
|
||
|
||
// Optional libraries used to extend on reveal.js
|
||
dependencies: [
|
||
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
|
||
{ src: 'plugin/markdown/showdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
||
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
||
{ src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
|
||
{ src: 'plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
|
||
{ src: 'plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } }
|
||
// { src: 'plugin/remotes/remotes.js', async: true, condition: function() { return !!document.body.classList; } }
|
||
]
|
||
});
|
||
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|