Hiya! Its the start of the new semester! Since its the first week back at school I decided to play around with Timeline JS to get a little refresher. I’d never really worked with Timeline before but I got the hang of it really quickly! Over the break I watched the flim The Imitation Game and I loved it The movie works through Allan Turing’s involvement in breaking the Enigma code that the Germans developed during the second world war. Turing’s work was really pivotal in the world of computer science. After watching the movie I couldn’t believe that I hadn’t heard of him before! I just kept thinking that without him we probably wouldn’t have the technology in the computers that we use today! We might still have computers that take up the entire room. (Now that might be a slight exaggeration but still.) But the whole movie was really interesting and it was a great portrayal of Turing’s life and his contributions to computer science.
So when I was looking for ideas for my Timeline I immediately thought Turing’s life would be a great topic. I wanted to look into more of what Turing did and I couldn’t think of a better way to do it. Once I had my topic I was set to go! Here is the process I used to create the timeline and some tips I have for making it way easier to complete!
Timeline JS utilizes google spreadsheets to streamline the information into the timeline itself. I started off going to the Timeline JS website to download the template for Google Spreadsheet.
There are eight sections to the spreadsheet itself: start date, end date, headline, text, media, media credit, media caption, and media thumbnail. Start date and end date correspond to the particular point on the timeline that your information will lie. So an earlier date will fall before a later date, so it doesn’t matter where you put your date in the spreadsheet, all of the points will fall chronologically. But for organization processes it might make sense to put the information into the spreadsheet chronologically as well. When inputing the dates, the start date is the only one that is required. The end date is helpful if there was an important period that you want to touch on. Headline is the title for the specific point on the timeline. This is also useful for organization because you can reference the headline when editing the timeline rather than reading the content of the point. Text is where you put the information surrounding the event. So for example in my timeline, for the first point, I wanted to make a “title slide” which would give a little background on what I would talk about in the timeline itself. I also tried not to add a lot of text to this portion. For aesthetic purposes I wanted to be concise with the description, which would be great if I was making a presentation with the timeline. Media is where you would add a photo or a video to the point, relevant to the information you wanted to convey. I found the easiest way to add images was to download the photo itself then upload it to Flickr. Then once it was in Flickr I copied the link and pasted it to the category. Adding a video was definitely much easier, all I had to do was grab the link from YouTube. Media credit is where you give the credit to where ever you got the image. I added a link to the page that I grabbed the image from. Media caption is where you would add some more information pertaining to the media itself. I didn’t use the media thumbnail. Here is what the spreadsheet looked like while I was editing the entire thing.
This is what the template would look like.
Once you are finished with the spreadsheet what you want to do is go to file and click publish to web:
Once that’s done a new will window will pop up. You will want to make sure that “Automatically republish when changes are made” is checked. Then click “Start Publishing.”
Once you click “Start Publishing” is clicked a link will appear. Copy the link. MAKE SURE THE WHOLE LINK IS COPIED!!!! The link might be longer than the box and you may have to scroll to get the entire link (this was the case for me).
Once the link is copied, on the Timeline homepage, scroll down the 3rd step “Copy/paste spreadsheet URL into the generator box below.” and paste the link into the box. The text in the 4th space should change to match your timeline.
Copy the iframe in number 4 and paste it into the text editor of your post. If it worked it should look like the following:
Some quick tips while creating the timeline:
- Publish the timeline first: When I work on projects like this, I like to check my work as I go along. So I published the timeline and embedded it into my post before I even start inputting the information. This way I could perfect each point on the timeline before moving to the next point.
- Check your work: This kind of goes along with the first point, you can check it all at the end or you check it point by point.
- Do all the research before you start working: I made the mistake of finding the information while I was working. This took way to long for me and I got bored really quickly. So I suggest you plan before you sit down to make the timeline, that way it will go quickly.
I hope this helps! I really enjoyed making the timeline and I think this is a great way to make a otherwise simple presentation into a really interesting one without taking too much time!
Note: When creating the timeline, I didn’t finish it fully, I just added points so that you could see how the flow works. When doing research I used the websites: Allan Turing-Wikipedia and Alan Turing: The Enigma