Site walk through: National Geographic – Into the amazon

Website URL:

https://www.nationalgeographic.com/into-the-amazon

A Journey Through Digital Innovation

Today I had the pleasure of exploring National Geographic’s new web experience dedicated to the Amazon – a masterclass in interactive storytelling that combines cutting-edge web development with breathtaking visuals.

First Impressions

As soon as you land on the page, you’re greeted with a few areas of text before diving into a stunning reveal effect that introduces the Amazon. The impact is immediate and captivating – exactly what you’d expect from National Geographic. These rich animations set the tone for what becomes an immersive digital journey.

Descending the Mountain

The experience begins at the top of a snowy mountain, with a view that gradually unfolds as you scroll. The transition through the clouds is seamless, creating a genuine sense of descent. What’s remarkable is the simplicity of the interaction – all you need to do is scroll down to continue the story, making it accessible to anyone.

As we descend the mountain, the page shifts to a horizontal timeline view that presents data in a visually striking yet digestible way. In the background, snow falls gently from the top of the screen – a subtle touch that adds depth without overwhelming the user.

Performance and Design

Despite the rich visuals and animations, the site maintains impressive performance. Even while recording my screen (which typically impacts frame rates), the experience remains smooth and responsive.

The gallery sections are particularly noteworthy, featuring side-scrolling capabilities with gorgeous pictures and videos documenting the project. The navigation is intuitive – returning to previous sections happens with ease, maintaining your sense of place within the larger narrative.

Immersive Landscapes

What truly sets this site apart is how it incorporates vast landscapes into the design. Each section is methodically built to showcase the Amazon’s grandeur while guiding you through specific information points.

At one point, the experience transforms into a three-dimensional rendering of a landscape, allowing you to zoom into a particular valley with highlighted locations. This represents advanced development work that elevates the user experience to something resembling a digital expedition or virtual tour.

As you progress through the valley, information about different Amazon animals appears. The attention to detail is impressive – as you descend through the clouds, the snow animation transitions to rain, mirroring the actual climate changes you’d experience traveling down from a mountain into the rainforest.

Artistic Elements and Typography

The “Past and Present” section introduces a watercolor painting effect on the landscapes, adding a tactile, almost physical quality to the digital experience.

Typography throughout the site deserves special mention – the font choices are highly readable while remaining consistent with National Geographic’s brand identity and color palette.

Custom Illustrations and Visual Variety

Each animal and plant featured has custom illustrations, further enhancing that tactile feel. Sections featuring jaguars, caimans, and capybaras include annotated notes that provide educational context without interrupting the visual flow.

What’s remarkable is how each section maintains its unique identity while the navigation remains consistent – you simply keep scrolling to discover new content. At various points, environmental effects like water droplets appear in the background, contextualizing the content.

Technical Innovation

One of the most impressive sections features a three-dimensional dot animation representing LiDAR scans of the rainforest. This gives the impression of flying through the trees like a mapping drone, with text appearing strategically on either side. The colors adapt dynamically throughout this section, reinforcing the changing environments.

As you approach the end of the experience (indicated by a helpful sidebar), you realize you’ve descended the entire mountain, eventually reaching water level. The journey concludes with final story points appearing line by line, followed by credits for the development and illustration teams.

Behind the Scenes

For those interested in the technical aspects, a quick inspection of the code reveals the site uses JavaScript modules and 3.js, a popular internet-based 3D animation library that’s perfectly suited for creating immersive experiences like this one.

Final Thoughts

National Geographic’s Amazon web experience represents digital storytelling at its finest – combining education, visual impact, and technical innovation to create something truly memorable. By transforming a standard webpage into a virtual expedition, they’ve found a way to make the wonders of the Amazon accessible to anyone with an internet connection.

The brilliance lies in how the complex development work serves the storytelling rather than overshadowing it. This is digital content that doesn’t just inform – it transports.