Linking Text to Movie Clips Using Dreamweaver
Note - these directions are specific to the system used at the Urban School, they are included as a model to be adopted by others interested in creating similar projects.
Prerequisite: You have already transcribed text, divided this into manageable "paragraphs" that are generally less than 90 seconds in length, and created the Quicktime movie clips associated with each text section.
Summary: You will now link the interview "paragraphs" to the Quicktime movie files. This will allow the viewer to click on text to launch the associated movie file. This is a tricky set of steps – go slow at first until you get accustomed to the procedures.
Set-up File Structure
Up to now you have been working solely off your laptop, but now it's time to begin sharing files as we move into a more collaborative review and publish phase. You will continue to work primarily from your laptop, however all your publishable files will be uploaded to the fileserver – both for back-up and for sharing.
Understanding the File Structure
Let's take a look at one example since understanding this will help you as you begin to add movie and transcript files. For now, ignore everything other than the actual interviewee's folder – in this case we look at Karl Lyon.
Move in Your Movie Files
From now on you will work off of files on your laptop – but you will UPLOAD NEW WORK to the server. This will both serve as a BACKUP as well as allow others to review your work.
Dreamweaver works best when you work within it's own unique file structure – called a "site." You will now create your own site.
As you continue to work with movie and text – do this within Dreamweaver's site window. Always go to "Site > Site Files" to open your site rather than navigating via Apple's file structure (the "Finder").
Copy and Paste Transcripts into Dreamweaver
You now need to convert the transcript sections from Listen & Type to Dreamweaver.
Example: "trans1b_25-62.html" means "transcript from tape 1, from the 25 to 62 minute points. "b" just signifies SECOND interview.
Creating the Linked HTML Files
Eventually you are going to make text clickable – when the user clicks any answer, the corresponding movie will play in the top-right "movie frame." You first have to make a small html file (hypertext markup language), one that ends with ".html" for every movie file. This can be tedious so we've created a simple tool to do this for you.
Note to other project adopters: The "mov_to_html" is a small Applescript that automatically generates a new html file based on the name of the movie file. We can send you a copy - just let us know. firstname.lastname@example.org
Fixing the Format of Transcripts in Dreamweaver
ONE last step to prepare for linking text to movie files. You will notice that the Dreamweaver-based transcripts look different. The following is the procedure for fixing this prior to making the movie links.
Magically all the questions and paragraphs will separate out. Don't worry about the extra space between paragraphs – we will fix this later.
Linking cut movies
At this point you should have created a Dreamweaver "site" that lives on your laptop, you have moved all your movie files into the correct folders, you've copied and pasted all your transcript text into the correct Dreamweaver files, and you've created the "Linked HTML" files so that every movie file has a paired html file. Confused? Ask for help – this is complicated! Now for the actual link-up of text to movie.
This step should be performed several times throughout this process until all your work is complete. Recall, you should be completing all your work (new files, changes, link creation) on YOUR laptop with the "WebsiteInProgress" folder on your desktop (or wherever else you moved it to). You then need to UPLOAD any NEW or CHANGED files to the server version ("upload" means to push files from your computer to another, i.e., the server – "download" is the reverse – means to pull files into your computer).
Yes, this can be a bit of an organizational challenge. The trick it to close or minimize ALL but the 2 windows – the DESTINATION window (the server version) and the SOURCE window (the laptop version). Hold the APPLE key and click on the title of an open window to see it's path, like these two:
Remember – only those files stored on the server are SAFE unless you have burned back-up CD's. Do this often.
Previewing Movie Clips in the Browser
In order to verify that the movies will properly load when the user clicks a transcript link – you need to follow these directions.
You should now be able to navigate through your transcript page. Check that all your movies correctly work and that they load in the top-right "movie" frame. Report those that are not working.