Time Machine Editor

Introduction

Time Machine is a technology for creating and viewing zoomable and pannable timelapses over space and time with billions of pixels of resolution. The tour and presentation editor allows users to tell and share interesting stories by creating custom guided tours and presentations, travelling through space and time.


Creating a tour

This section demonstrates how to create a tour.

Search a location

Use the search box to find interesting locations.


Pan and Zoom
The editor contains a pannable and zoomable viewer. Scroll the mouse wheel for zooming. Drag the viewer for panning.


Add keyframes
To create a tour, click on the "Add" button to add keyframes containing the information of current location and date.


Keyframe
A keyframe contains the information of the location on the video panorama and the source time. The thumbnail shows the location. The text above the thumbnail indicates the source time.


Adding captions to a keyframe
Click on the button on the bottom right of the keyframe to add and edit a caption.


Play your tour
Click on the "Play" button to play the tour.


Share a tour
Click the "Share" button and copy the link. Then share it via e-mail or social media.


Embed a tour
Embed the tour in iframe code generated in the pop up window for share button on a social media.


Delete all keyframes
Click the "Clear" button to delete all keyframes.


Load a tour
To load a tour you've previously edited, you'll need either the share link or embed snippet for that tour. Click the "Load" button, then paste the share link or embed snippet to load the tour.


Creating a presentation slider

This section demonstrates how to create a presentation slider.

Toggle to presentation editor
Click on the editor mode button to open up the dropdown menu and select "Presentation Editor".

Add locations
Click on the "Add" button to add a location to the slider.

Add a title and description for the location
Click on the button on the bottom right of the keyframe to add a title and description.

Embed a presentation
Click the "Share" button and copy the link. Then embed the iframe code into a webpage.

What you can do with the embed code
You can use the embed presentation slider to create an interactive story.


Keyframes and Transitions

More details on manipulating keyframes


Select a keyframe
Click on a keyframe to select it.


Add / insert keyframes
Click "Add" to insert a new keyframe after the selected one. If no keyframe is selected, a new one is added at the end.


Rearrange keyframes
Drag and move the keyframes to rearrange.


Duplicate a keyframe
Click "Duplicate" to insert a duplicated keyframe.


Update keyframe location and time
Click "Update" to update the keyframe to the current map location and time.


Loop and speed transition
If you'd like years to play forward in a "looping" style (back to 1984 after the end), select the "Loops"-type transition. Set the playback speed and number of times to loop through time between two keyframes. The duration of the transition depends on both the number of loops and the playback speed.


Duration transition
If instead you'd like to pause time, or perhaps go backwards in time, select the "Duration"-type transition. This lets you set the number of seconds between keyframes. The date displayed will transition smoothly between the dates of the keyframes before and after. If you'd like to pause time during the transition, make sure the keyframes before and after have the same date. If you'd like to move backwards in time, make your following keyframe have a time earlier than the preceding one. Duration of 0 is instant, jumping immediately to the next keyframe without transition.


Move map to keyframe time/date
Click the thumbnail on the keyframe to move the map to the keyframe's time and date.


Delete a keyframe
Click "Del" to delete the selected keyframe.



Time and Motion Control

This section demonstrates how to control camera motions.

Zoom
Create a keyframe at the first location. Then zoom the viewer to the second location and create another keyframe.


Pan
Create a keyframe at the first location. Then pan the viewer to the second location and create another keyframe.


Pause Motion Only
Duplicate a keyframe. Then update the duplicated one to the desired time and set the speed to a value that is greater than zero.


Pause Time Only
Create 2 keyframes. Then disable looping, set the speed to zero, and set the duration.


Pause Motion and Time
Duplicate a keyframe. Then disable looping, set the speed to zero, and set the duration.


Publication

Yen-Chia Hsu, Paul Dille, Randy Sargent, Christopher Bartley, Illah Nourbakhsh. A Web-based Large-scale Timelapse Editor for Creating and Sharing Guided Video Tours and Interactive Slideshows. IEEE Information Visualization Posters, 2015.

Comments