Project description:

On occasion of the 50th anniversary of the first moon landing, the article takes readers on a trip around the moon and aims to convey part of the fascination that has drawn researchers to the earth’s satellite. Datasets from scientific and government sources were compiled and worked into an interactive storytelling format. The project was published in German and is split into the following parts:

(for the purpose of an overview in English, this is continued in the next section “Impact”)

Impact reached:

(cont. from “Short Description”)

• Part one revolves around the various surface features of the moon and their evocative naming conventions. The section uses elevation data recorded by the LRO satellite mission.
• The second part addresses the moon’s geology and formation history using imagery of the moon’s gravitational field that hints at the origin of some of the largest observable features on the moon such as the maria on its earth-facing side.
• The final part is about the human presence on the moon, starting with the first impacts of Soviet probes and manned US-missions and leading up to the most recent exploration efforts involving Indian, Chinese and Israeli landers. 

---

What was the impact of the project?

The article was published as part of our coverage of the anniversary of the first moon landing and was received very positively by our community of online readers. As one of the team’s most technically ambitious projects to this date, it expanded our confidence in approaching such ideas and the editorial staff’s flexibility in conceptualizing our online storytelling. 

Techniques/technologies used:

The visualization was realized using different web technologies, with the JavaScript-library three.js and its 3D rendering capabilities being especially important. The moon globe was set up as a 3D sphere which, in combination with a color and a bump map is rendered as an adequately detailed model of the moon which can be interacted with by the user at every moment.

The data used was either directly acquired or collaboratively compiled in Google Spreadsheets and subsequently cleaned and formatted for use using short scripts in the Node.js-environment using d3.

What was the hardest part of this project?

One of the greatest challenges was synthesizing the available data and displaying it on the moon’s surface accurately. This meant considering the coordinate system used on the moon, cross-checking with different, visual sources and even adjusting the focal length of the virtual camera and its distance from the globe to approximate a natural-looking perspective on the moon’s features.

An additional challenge was delivering high-fidelity 3D-visuals in the browser – especially on mobile devices – without relying on big network payloads and large amounts of processing power. This was especially difficult considering the multiple layers of imagery used on the moon globe. There a color map and a bump map are employed to give the impression of a highly detailed model that can be dynamically lit in a 3D-scene. A lot of time went into image processing and deliberations concerning the tradeoff between fidelity and usability to arrive at a reasonable balance.

What can others learn from this project?

The article, as an explainer, aims to convey a large amount of information and employs a few techniques to make it more palatable and enjoyable to follow:

• the storytelling is anchored by a dominant visual that mirrors the information given in text (color-coded in both versions), so while scrolling multiple channels can be used to attract the viewer’s attention
• in order to still offer comprehensive information, lots of content is hidden behind interaction with the globe for individual discovery
• changes in the nature of information conveyed is always accompanied by a distinct visual change 

Project links:

derstandard.at/interaktiv/stories/2019-07-rundreise-zum-mond/