One of the more common feature requests for Google Earth Projects, and one I have posted on before (link to post), is adding narration or sound. While adding audio can add value to any story, there are some other hacks creators can add to enhance an Earth project. The two hacks I often use in creating Google Earth Stories include “camera” movements along with showing and hiding features, before, during, and after the narration. In addition, many Google Earth Projects I create have some sort of Toggle option for viewers to click. Who does not like clicking buttons?
Here are how these engagement techniques work, stop by stop, in a story about the Suez Canal.
TL;DR: Link to The Suez Canal – A Google Earth Narrated Tour
Panel #1 – “Google Earth Narrated Tour – Suez Canal”
Every story starts with a full screen slide. However, this slide is doing more than introducing the story. The JavaScript associated with the slide is setting up all the assets. The assets include points, lines, folders, overlays, etc. The script itself is hiding all the assets that will be used in the story and making sure all the folders are set to be visible. This function is for every panel; making sure the scene is set for each stop in the story.
Panel #2 – “Suez Canal”
In this scene, the audio is facilitating a lot more than just playing a narration. I often use on time functions, events that are triggered at certain times in the media, to show/hide features or move the camera. For example, in this scene an orange path for the Suez Canal is set to be visible at the 2.5 second mark of the audio. Because the path is set to visible during the narration, the toggle switch in the panel is also toggled on. At 6.5 seconds the camera pans out, so the user can observe the connection between the Mediterranean and Red Seas.
In addition, to create more viewer engagement, there is an “Explore” section in the panel that gives viewers the opportunity to observe the physical and human characteristics along the path of the Suez Canal.
Panel #3 – “Suez Canal – Time and Distance Savings”
There are a couple of, in my opinion, cool features in this stop of the story. First, there are two camera changes that allow the user to visualize both paths: one through the Suez Canal and the other around Africa’s Cape of Good Hope. Like the stop before, these movements are timed to the audio. The first movement around the 5 second mark and the other around the 13 second mark.
Second, and probably cooler, is the utilization of Google’s Maps API with Google Earth. Google Earth’s sphere shape, while more accurate to reality, limits the viewer from seeing both paths in one viewport; hence the two camera movements in the scene. Cooler yet, is that toggle switches for both paths hide and show the lines on both Google Earth and Google Maps.
Lastly, viewers have an explore section within the story that allows the student to think about the similarities between both routes.
Panel #4 – “Suez Canal – Value”
In addition to the timed camera movement, this stop utilizes map tiled overlays (x,y,z overlays) for both Google Earth and Google Maps API. Since Google Earth for Web uses the same tile overlay structure as most web mapping platforms, the source of the actual tile images are the same; both hosted on Google Cloud Platform (GCP) storage. Once again, the toggle switches work for both Google Earth and Maps. Like other stops, this panel has a question for viewers to explore.
Panel #5 – “Ever Given – 3/23/2021”
Stop 5 has the same features as stop 4, just at a different scale. This overlay is a Maxar Satellite image of the Ever Given blocking the Suez Canal. The alignment is not perfect, but overlaying satellite images on top of each other rarely is. The toggle switch hides the overlay. This allows viewers to see changes that have taken place since the Ever Given incident.
Panel #6 – “Suez Canal – The Aftermath”
In typical fashion, the last panel ends the viewer’s journey, but also allows the view to play with all the layer features presented in the story. This allows viewers, mostly teachers and students, the opportunity to explore and discuss the featured layers outside the structure of a story.
Bonus – Where to start?
1. I always start with some sort of script. The format is a little different on this story, but normally I have the text, the visualization/feature to be used Earth, and the media to be used within the panel. Link to Suez Canal story script
2. Second, I set up the folder structure within Google Earth Projects. The first stop is always a full screen introduction page followed by folders for each stop. Folders are easier for me to keep track of a story. The last folder of a story has all the features and movements nested within it.
3. Once I have all the features and movements figured out I export the project as a kml to get their feature ids.
4. With the feature ids, I can control the camera and visibility of features using simple JavaScript.
Would you like more?
Let me know via Twitter or Facebook if interested in how to create Custom HTML to control camera movement and the visibility of Google Earth Features. Maybe if enough people are interested, maybe I can create a how-to tutorial.
For more Google Earth examples, check out this post “Best Google Earth Projects of 2022 – by geteach.com” (Link)