Prompt
Code in html, css, JavaScript a self-contained, complete and embeddable animated simulation showing the shifting tectonic plates from Pangaea to Gondwanaland and on to today’s current plate positions. Show the plate boundaries and plate names on a map of the Earth. Use the information from this source: https://oceanexplorer.noaa.gov/ocean-fact/plate-boundaries/ to label the plate interactions where they occur on the map. Add a Play button and a time label to show the general timeline of the plate motions. Use a colorful map, but have a general theme of navy blue, white, black, and gray.
Iteration 1
Change to this resource for the boundary information: https://pubs.usgs.gov/gip/dynamic/understanding.html It’s more thorough. Use this map as the basis of the animation: https://www.floridamuseum.ufl.edu/educators/resource/pangea-puzzle/. Resize the Plate Boundaries Key to be smaller so it doesn’t cover the map. Place the plate boundary labels over the regions where the interactions occur. Move the Play button to a more convenient location for users who have Chromebooks, iPads, or smaller screens.
Iteration 2
The continents are not shown in one contiguous body with all continents and plates in contact with one another. They should be shown as one landmass during Pangaea. Fix this. Make the plates more accurately shaped.
Iteration 3
I still can’t get to the play button. Make the animation play if the user taps or clicks the screen and pause if the user taps or clicks the screen.
Iteration 4
Resize the map to allow for all the continents to show during the animation.