davidbgk
/
larlet-fr-david-cache

<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang="fr">
<!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset="utf-8">
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- Required to make a valid HTML5 document. -->
<title>Incredible time-lapse shows a single cell transforming into a salamander (archive) — David Larlet</title>
<meta name="description" content="Publication mise en cache pour en conserver une trace.">
<!-- That good ol' feed, subscribe :). -->
<link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
<link rel="manifest" href="/static/david/icons2/site.webmanifest">
<link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
<meta name="msapplication-TileColor" content="#f7f7f7">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<script>
    function toggleTheme(themeName) {
        document.documentElement.classList.toggle(
            'forced-dark',
            themeName === 'dark'
        )
        document.documentElement.classList.toggle(
            'forced-light',
            themeName === 'light'
        )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
        toggleTheme(selectedTheme)
    }
</script>

  <meta name="robots" content="noindex, nofollow">
  <meta content="origin-when-cross-origin" name="referrer">
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://www.nationalgeographic.com/animals/article/time-lapse-film-shows-salamander-development">

<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">


<article>
  <header>
    <h1>Incredible time-lapse shows a single cell transforming into a salamander</h1>
  </header>
  <nav>
    <p class="center">
      <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
      </svg> Accueil</a> •
      <a href="https://www.nationalgeographic.com/animals/article/time-lapse-film-shows-salamander-development" title="Lien vers le contenu original">Source originale</a>
    </p>
  </nav>
  <hr>
  <p>You, me, the lemurs in the trees, the snakes in the desert, and the squid in the deep sea—all of us began as a single cell. From the largest creature that’s ever existed—the <a href="https://www.nationalgeographic.com/animals/mammals/facts/blue-whale">blue whale</a>—to the inch-long bumblebee bat, each of us can rewind our existence to the same humble foundation.</p>
<p>Amazingly, photographer and filmmaker <a href="https://www.janvanijken.com/">Jan van IJken</a> has captured these first fleeting moments. Using a combination of time-lapse photography and video recording, he molded them into a powerful new film called “Becoming.”</p>
<p>“My idea was to film the origin of life, the actual beginning of life,” says van IJken. “So I started to do research and I found out that frog and salamander eggs are fully transparent.”</p>
<p>From there, van IJken teamed up with an amphibian breeder who kept an extra-close watch on a captive population of alpine newts, which are a type of salamander. When a female laid a clutch of eggs and a male fertilized it, the breeder would call van IJken, who would then race over and begin filming through a microscope.</p>
<p>“It was quite complicated, because I wanted to capture the first cleavage,” he says, referring to the split second when the original, single cell of an organism divides for the first time. (<a href="https://news.nationalgeographic.com/2018/05/animals-beetles-insects-larvae/">Watch a sausage-size larva transform into a beetle</a>.)</p>
<p>Often, van IJken arrived just moments too late. Or a multi-day timelapse shot would be ruined because the developments he’d been hoping to catch were happening on the opposite side of the embryo, out of view. Or he’d catch them, but the lighting would be off, or the shot out of focus.</p>
<p>After more than six months of filming and countless tweaks, van IJken was able to shrink what would take around four weeks in nature down to just six minutes of otherworldly beauty.</p>
<p>“It was very, very difficult,” says van IJken. “But very rewarding.”</p>
<h2><b>The science of “Becoming”</b></h2>
<p>“I was almost in tears watching that video,” says <a href="https://www.colby.edu/directory/profile/carol.hurney/">Carol Hurney</a>, a biologist who has spent around 15 years studying salamander embryonic development.</p>
<p>“What’s also amazing to me is that it’s not terribly different from what happens with human embryos,” says Hurney, who is currently the director for the Center for Teaching and Learning at Colby College in Maine. (<a href="https://news.nationalgeographic.com/2017/06/butterfly-wing-metamorphosis-caterpillar-spd/">See a caterpillar transform into a butterfly</a>.)</p>
<p>For instance, after about three days of development (and around the one-minute mark in the video), the salamander embryo begins to pucker and tuck into itself. This is what’s known as the formation of the blastopore.</p>
<p>“This is a process that’s essential for vertebrates, called gastrulation. This is where your gut tube is going to start to form,” says Hurney. “So what we’re looking at here is the prospective anus of this salamander.”</p>
<p>Another 45 seconds into the film, and you can see the neural plate rising off of the embryo. In short order, this rapidly forming ridge will enclose the beginnings of the nervous system.</p>
<p>“I think it’s at this point that you can start to imagine that this is actually going to be a living creature,” says Hurney.</p>
<p>Starting at around two minutes and 20 seconds into the time-lapse video, or around five days of development, Hurney points to the passage of individual cells migrating across the salamander’s surface. Each is taking cues from the genetic blueprints within it as well as signals from surrounding cells to determine what sort of tissue it will become.</p>
<p>By minute four, a beating heart and flowing blood cells come into mesmerizing focus.</p>
<h2><b>Fragility of life</b></h2>
<p>While the film appears to show the development of a single salamander, Van IJken says he actually had to watch many, many different individuals to create the final product. Partly, this had to do with timing and luck—getting the shot at the proper moment—but also, not every amphibian makes it from egg to larvae.</p>
<p>It’s the same way in the wild, says Hurney. And even under otherwise perfect laboratory conditions, sometimes the embryos just stop developing. “Which is why they have so many,” she says.</p>
<p>“I think the fragility of life also really shines through in this video,” says Hurney, “because this embryo is just exposed to the world and all of the things we do to the world.”</p>
<p>It’s a reminder to humans that from the chemicals we emit into the air and discharge into streams to the rock salt we use to de-ice our sidewalks in winter, we have an impact on countless little lives around us, though we may never notice them.</p>
<p>“Hopefully this creates an emotional response in people that’s more than just awe, but also one where we want to try to protect these creatures,” says Hurney. </p>
</article>


<hr>

<footer>
  <p>
    <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
      </svg> Accueil</a> •
    <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
      </svg> Suivre</a> •
    <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
      </svg> Pro</a> •
    <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
      </svg> Email</a> •
    <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
      </svg> Légal</abbr>
  </p>
  <template id="theme-selector">
      <form>
          <fieldset>
              <legend><svg class="icon icon-brightness-contrast">
                <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
              </svg> Thème</legend>
              <label>
                  <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
              </label>
              <label>
                  <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
              </label>
              <label>
                  <input type="radio" value="light" name="chosen-color-scheme"> Clair
              </label>
          </fieldset>
      </form>
  </template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
<script>
    function loadThemeForm(templateName) {
        const themeSelectorTemplate = document.querySelector(templateName)
        const form = themeSelectorTemplate.content.firstElementChild
        themeSelectorTemplate.replaceWith(form)

        form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
        })

        const selectedTheme = localStorage.getItem('theme')
        if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
        }
    }

    const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
    window.addEventListener('load', () => {
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
            let mediaRules = []
            for (const cssRule of styleSheet.cssRules) {
                if (cssRule.type !== CSSRule.MEDIA_RULE) {
                    continue
                }
                // WARNING: Safari does not have/supports `conditionText`.
                if (cssRule.conditionText) {
                    if (cssRule.conditionText !== prefersColorSchemeDark) {
                        continue
                    }
                } else {
                    if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                        continue
                    }
                }
                mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }

            // WARNING: do not try to insert a Rule to a styleSheet you are
            // currently iterating on, otherwise the browser will be stuck
            // in a infinite loop…
            for (const mediaRule of mediaRules) {
                styleSheet.insertRule(mediaRule.cssText)
                hasDarkRules = true
            }
        }
        if (hasDarkRules) {
            loadThemeForm('#theme-selector')
        }
    })
</script>
</body>
</html>