Timeline 3D Help

Contacting Support
Download Timeline 3D
Create a timeline
Present a timeline
Export a timeline
Timeline Settings
Date Parsing
Auto-layout
Automation and Workflow (Mac)
What’s New in v5 (Mac)

1. Contacting Support

We have addressed the most common questions about Timeline 3D in this document. If need further help with your particular situation, please contact us at support@beedocs.com.

2. Download Timeline 3D

Timeline 3D is available for Mac OS X and for iOS. It can be downloaded and installed through Apple’s App Stores.

Timeline 3D for Mac requires macOS 10.10 (Yosemite) or above.

3. Create a timeline

Creating a timeline with Timeline 3D is a matter of choosing and entering the events, dates, and multimedia that you would like to include in your timeline. Before you begin, think about who your audience is and what story you would like to present to them. An effective timeline shows cause and effect relationships between events as well as the importance of time in your story.

The key challenge of creating a timeline is often deciding what -not- to include in your timeline. If you have more than a few dozen events in your timeline, it can be hard for the audience to follow the story. If you have a very complex story with many events, consider using multiple timelines that focus on different aspects of the story. For example, you may want an overview timeline and several detail timelines.

Step 1 — Create a New Timeline

To begin a new timeline on the Mac, choose the File > New Timeline menu item. Click the pencil icon in the toolbar or choose the View > Event Editor menu item to enter the editing mode.

To begin a new timeline on iOS, go all the way back to the timeline choose page (the first screen you see when you launch the app) and touch the plus button in the lower left. Choose “Create Timeline” and give a name to your new timeline document.

Step 2 — Adding New Events

Add new events by pressing the plus button that is located near the event list.

Step 3 — Enter Events with Titles and Dates

Every event should have at least a title and a start date. All other information is optional. The title should be a single line of text.

The start date can be any common date format in your locale. By typing the date, you are setting both the time that the event takes place within your timeline as well as the format that the date is displayed. For more details on entering dates, please see the Date Parsing section.

Timeline 3D needs a specific date in order to know where to position your event. However, you may not want to display a specific date. In this case, you can use a “Custom Date Label” to change the display of the event date. Note that Timeline 3D will still be using the start date for position information. This allows you to display a date label with arbitrary text such as “later that afternoon.”

Step 4 — Adding Multimedia and Links

Each event can have an image, movie or a PDF embedded into it. On the Mac version, drag-and-drop your media into the Media well. On the iOS version, touch the “Add Media” button or touch the existing media.

Media is automatically resized based on the presentation medium (printing, 3D display, etc…). Therefor, it is best to add high quality and high resolution media to your timeline. If your media is too large, Timeline 3D will automatically scale it down to an appropriate size in order to facilitate efficient cloud syncing and display.

Sometimes you will want to have more information connected to your event than is appropriate for a timeline display. For example, you may want to have a slideshow or detailed supporting documents. In this case, keep your timeline compact by hosting this extra information at an external location and use the Website Link field to connect your event to the URL.

Step 5 — Categorize events with color codes and tags

Often, interesting stories are about the intersection of two or more categories of events. For example, a legal case may involve the activities of two different parties. You may want to assign all of the events from one party to the first color category and all of the events from the other party to the second color category.

These categories are displayed in your timeline with two different colors. The specific colors that are displayed depend on the theme that you select. For example, you may choose to print your timeline with bold primary colors while a more subtle color scheme when presenting on screen. Categories will retain their groupings even when the theme changes.

Please note that if you are coming from an older version of Timeline 3D, the software will do it’s best to understand the intent of your previous timeline and convert it to color categories. For example, you may have used custom colors or event rows in your older timelines. These will be converted to color categories. If you used custom colors, we will even create a custom theme for you so that the end result looks very similar to the timeline that you originally created.

Step 6 — Adding Notes

Notes are handy when you would like to display additional text with your events. Keep in mind that very long text is probably best presented alongside your timeline, perhaps connected to your timeline with an event link. Notes work best within the context of a timeline when they contain about one paragraph of text. If you have longer notes, they may be truncated based on the output medium in order to preserve readability of the text. This feature can be disabled in the timeline settings.

4. Present a timeline

Present your timeline by using the “3D” toolbar button on the Mac, or the play button in the toolbar on iOS. Timeline 3D will calculate an optimal layout for your timeline and screen resolution. Then it will create the graphic resources based on that layout. After that process is complete (usually about a second per event) your timeline will be displayed with fluid animations.

There are many ways to animate and move within your timeline. Try out these features:

Feature	Mac	iOS
Toggle 2D / 3D	Space bar	Pinch gestures
Zoom into a specific event	Click an event	Touch an event
Move to the next event	Right arrow	Swipe from right to left
Move to the previous event	Left arrow	Swipe from left to right
Zoom into media / play movie	“M” key on keyboard	Pinch to zoom
Follow an event link	“L” key on keyboard	Tap the screen, then touch the link button
Exit the presentation	Click “3D” toolbar button	Tap the screen, then touch “Done”
Filter events	Search, then arrow keys	Search, then swipe events (AirPlay only)

A Note about AirPlay

3D presentations were designed to present to an audience using a projector or large screen monitor. You can do this with a cable or using AirPlay to an AppleTV. On the Mac, you will be mirroring your display. On iOS, a timeline is presented on the external display while the event list is displayed on the device. Try it out, it is awesome!

IMPORTANT: On iOS, be sure to turn on “Mirroring” when you connect to your display.

5. Export a timeline

Exporting your timeline makes it easy to share your timeline and integrate it with other content and workflows. You can upgrade the software with in-app purchases to render and export your timelines.

2D Exports

One option is to share a 2D layout of your timeline by printing or exporting a PDF. When you print, your timeline will be automatically formatted to fit on a single page using the paper size and orientation you select.

3D Renders

Movies, slideshows, and image sequences will render your timeline in 3D and format the output to the destination you choose. For example, you can create a Keynote or PowerPoint presentation of your timeline. This is particularly useful when you want to integrate other content with your timeline or play it back on other platforms such as Windows PCs.

Enhancing Timelines with 3rd Party Software

We recommend that you think of your exported timeline as an element to your story telling. You can enhance it by adding other content and multimedia.

For example, you could add a soundtrack and narration to your movie using iMovie, Final Cut Pro, or Adobe Premier. You could add additional slides with text and multimedia using Keynote or PowerPoint. You could place a PDF of your timeline into a report using Pages or Adobe InDesign.

Interactive WebGL

Timeline 3D can integrate your animated timeline into your website, giving your audience the interactive experience of traveling through your story. We use an advanced browser technology used WebGL to accomplish this. WebGL does not require plug-ins and is included in many popular browsers including Safari for iOS 8.

If your audience has an older browser that does not support WebGL, then your timeline will appear with the same 3D presentation and navigation but it will fallback to pre-rendered images instead of using animations rendered by their GPU.

To publish a WebGL timeline, you will first export it from Timeline 3D. This will generate all the necessary HTML, CSS, Javascript files as well as rendering the WebGL texture graphics and fallback images. These files will all be saved together in a directory. On iOS the directory will be saved into a ZIP archive so that you can use Transmit, Dropbox, or another app to transfer the files to your web server.

You will need access to a web server to host your timeline files. The files are served as static files (not using PHP, ASP, etc) so that any web server can be used. For example, we are hosting timelines on Amazon’s S3 / CloudFront service.

Upload the entire directory that you exported to your web server. If the directory is zipped (as will be the case on iOS), then unzip the files. Remember to set your permissions to make the directories contents viewable to the public.

Your timeline will then be viewable at the location you uploaded your file. For example, if I upload the folder called “ZooBabies” to the root directory of my BEEDOCS website, then it will be available at www.beedocs.com/ZooBabies. The timeline will fill the entire browser window and can be navigated with the mouse, keyboard, and using swipe gestures.

You can also embed your timeline into another webpage or another website using an iframe of any size. Here is some example code from our website:

<iframe
  id="embeddedTimeline"
  src=“//d3ruueektcyu1d.cloudfront.net/web_v5/ZooBabies/index.html”
  width="100%"
  height="365"
  frameborder="0"
  scrolling=“no">
</iframe>
<p style="margin-top:0;"> <!-- optional link to full screen -->
  <a href="//d3ruueektcyu1d.cloudfront.net/web_v5/ZooBabies/index.html">
    View Full Size
  </a>
</p>

6. Timeline Settings

You can adjust your timeline settings on the Mac by clicking the gear icon in the toolbar, or on iOS by touching “Configure” at the top of the event list. Settings control how your timeline looks and behaves.

Visual Design

You can set themes for the colors and fonts that your timeline will use. One theme controls the look of your timeline when presented or rendered for display on a screen, the other controls the look of your timeline when printing. You can choose from the default themes, or with the Mac version, you can also create your own custom themes.

Format

You can also control the date formats used by your timeline by setting the language, region, and calendar used for date parsing. When you create a new timeline, these options will default to the settings used by your device. Note the list of example formats. Within each combination of format settings, there are dozens of specific date formats possible.

Layout

You can choose whether or not to “Allow Information Hiding.” This feature is recommended and will automatically hide information as needed to produce a readable layout.

For example, consider an extreme example where you are attempting to print a complex timeline on a small piece of paper, like a postcard. When information hiding is turned on, the software may choose to hide the event notes and media in order to make the text size more readable. If “Allow Information Hiding” is turned off, then all of the content will be included, even if it has to be printed at microscopic sizes in order to fit.

Information Hiding will always include at least the first line of every single event title. It will display as much information as possible while keeping the text readable (the specifics sizes depend on the output target).

7. Date Parsing

Timeline 3D contains a very complex date parsing engine, but it is remarkably easy to use. The goal is to allow you to work with dates in a way that is natural and intuitive for your project. You can also work with dates in many languages and regions around the world.

Timeline 3D does not include a calendar picker because it an inefficient way to select dates that may span thousands of years, can not specify date formats and granularity, and does not work well for non-Gregorian calendars. Instead Timeline 3D includes custom natural-language date parsing to interpret the dates that you type.

Date Granularity

When you type a date, you are setting both the offset at which to draw your event as well as the date format with which to display the event label. The dates you type are interpreted based on the location settings for your timeline. You can use the available date formats to display the granularity or your date. For example, you may only want to indicate the year, or you can indicate the month with the year, or perhaps you want to include the time of day. Here are some examples:

Example Date Formats
Year only in Japan	2015年
Month / Year combo in Germany	März 2015
Full date in Mexico	15 de marzo de 2015
Date and time in USA	Mar 15, 2015, 7:55 AM

You can see more examples for your specific location listed in the Timeline Settings.

BC Shortcut

In some locations and languages, a BC/BCE dates may be cumbersome to type. There is a shortcut available in all languages, where you can use the minus sign in front of the year to indicate that you want to display the date using a language appropriate usage of BCE.

For example, you could type:
-500

In France, this would be interpreted as:
500 av. J.-C.

In China, this would be interpreted as:
公元前500年

In the United Kingdom, this would be interpreted as:
500 BC

Date Ranges

Timeline 3D automatically displays date ranges in a typographically appropriate way. Consider an example where your event has a start date of “February 9, 2015” and an end date of “February 10, 2015”.

The best way to display this range in the USA is...
February 9–10, 2015

...instead of
February 9, 2015 — February 10, 2015

Timeline 3D will handle these formatting changes according to the style rules of the location and language that you have set for your timeline.

8. Auto-layout

Timeline Range

The date range of your timeline is automatic and calculated each time you display or export a timeline chart. It is set to the smallest range that includes all of your events and the range will extend past your events far enough to insure that no data overlaps the edge of the chart.

Event Positions and Stacking

Event positions and stacking are also calculated automatically. When two events would otherwise overlap, the earlier event will stack on top of the later event. If two events have exactly the same date, then they will use the alphabetical order of the event titles to break the tie.

Tick Marks

Tick marks, both their positions and their labels, are also calculated automatically. Timeline 3D will choose intervals that fall on common boundaries (years, quarters, months, bi-weekly, weekly, etc…). It will choose enough tick marks that there are at least several per page, but not so many that they overlap or crowd each other.

The date formats in the tick marks is influenced by the date formats that you use in the events. For example, if you usually use abbreviations for the months in your event dates (“Feb”) , then the tick marks will also use abbreviated months. If you use “B.C.E.” instead of “BC” in your events, the tick marks will follow your lead.

Font Sizes, Image Sizes, and Allow Information Hiding

As your timeline is prepared for a specific output type, Timeline 3D automatically adjusts the event positions, font sizes, image sizes, and text wrapping in order to optimize the layout. The priority for the auto-layout system is to keep the text at a readable size.

If the layout engine can not fit everything on a page at a readable size, it has two options (controlled by the “Allow Information Hiding” setting). The first option is to continue reducing the size of the elements in your timeline until they all fit. This may make the text size too small to read, but all of the data from your events will be included in the chart.

The second option is to allow information hiding. With this choice, Timeline 3D will display all of your events, but some of the information in those events may be hidden in order to preserve a readable font size.

The priority of the information to display with “allow information hiding” enabled is as follows:

The first line of the event title (always displayed)
Event title
Event date range
Event media
Event notes (trimmed)
Event notes (complete)
Increasing font size to preferred size
Increasing event image size

Note that on the Mac, this setting is also available in the Print Preview panel so that you can preview the results of this setting. Furthermore, an optional report can be printed with your timeline that includes details about what was hidden and what was included.

9. Automation and workflow (Mac)

Timeline 3D for Mac includes capabilities that allow it to be integrated into a workflow and / or automated with scripts or other applications. There are two main ways to do this (which can be combined). The data in a timeline can be represented in a tab-delimited text file. Also, AppleScript can be used to automate both the timeline data and the features of Timeline 3D.

Tab-Delimited Import / Export

Timeline 3D can import and export timelines as tab-delimited text files. This makes it easy to move your data between Timeline 3D and other systems such as spreadsheets. You could also write a script that dynamically generates a tab-delimited file with timeline data. The tab-delimited file can be converted to a timeline by opening from Timeline 3D or dragging it onto the application icon.

The best way to see how the tab-delimited file works is to create a timeline and then export the data by choosing File > Export as Text. Examine this file. It can be modified and then reopened in Timeline 3D.

The order of tab-delimited columns is as follows:

Title
Start
End
Custom
Link
Notes
Image
Media
Tags
ColorCode

Notes on Timeline 3D tab-delimited files:

Image and Media are paths to a location on disk
ColorCode is a number between 0 and 5
Line returns in notes or titles are indicated by a “/n”
Tab-delimited files can be opened in applications such as Number and Excel.
Tab-delimited files can also be exported from those applications.
Try using copy / paste to move events from Timeline 3D to a spreadsheet and back again!

AppleScript

Timelines and themes can be manipulated and automated via AppleScript. For more information, open the Timeline 3D Script Dictionary using Script Editor on the Mac.

What’s New in v5 (Mac)

Timeline 3D v5 for Mac is a completely new version of Timeline 3D, redesigned from scratch for the new generation of Apple devices. Here are some of the new features:

Optimized interface and timeline presentations for retina displays.
Added auto-save and versioning.
New document format optimized for iCloud syncing.
Smarter date parsing, especially for Asian languages.
Manual control of font and image sizes replaced by auto-layout.
Auto-layout will automatically format your timeline for a single page.
“Allow Information Hiding” can intelligently trim your notes and media to keep the text readable on complex timelines.
Date range formatting is smarter for international dates.
Ability to have a timeline localization different from your system localization.
Handles time zone changes automatically without changing date display.
Separate themes for screen display and printing.
Printing uses font weights instead of alpha shading for crisp text.
Movie, slideshow, and image sequence export sizes up to 4k.
3D timelines can be displayed within a window (or full screen).
Better lighting and animations in 3D mode.
Images, PDFs, and movies can be zoomed to full screen during a presentation.
Click an event in a 2D presentation to zoom into it with a 3D twist.
Search / filter events during a 3D presentation to control which events are highlighted when you press the arrow keys.
Replaced event rows with color coding.
New “Yosemite style” application icon.
Migrated to Apple’s latest frameworks.
Mac App Store compatible.

What’s New in v5 (iOS)

Timeline 3D v5 for iOS is a completely new version of Timeline 3D, redesigned from scratch for the new generation of Apple devices. Here are some of the new features:

Document format now compatible with Timeline 3D for Mac
User interface optimized for larger iPhones
Movie export allows on-device rendering of HD video
Import documents and media from iCloud Drive and other sources
Event categories allow color-coding of events
Separate themes for screen presentations and printing