Following our previously outlined roadmap, the OTW is proud to be hosting a number of new resources for fan video makers. These new Fan Video and Multimedia pages include:

• Options for Hosting Streaming Video
• A Quick and Dirty Guide to Embedding Video on the Archive of Our Own
• Instructions for How to Stream Video from Your Own Site
• How to Dispute a YouTube Takedown or File a DMCA Counternotice (offsite link)
• How to Add Subtitles and Translations to Your Videos

There are also resources for scholars interested in fan video, including a Bibliography of Fan Video and a Fan Works Style Guide which will tell you how to cite fan vids (and other fan works) in academic contexts. You can also find our extant Vidding Projects - the Oral History Project, the Test Suite of Fair Use Vids, and Vidding (2008), a documentary produced by the OTW for MIT's New Media Literacy project - linked from this page.

We'd like to give particular shout-outs to TWC editor Karen Hellekson, Vidding volunteers Laura Shapiro, Tisha Turk, Nele Noppe, and Margie, and International Outreach team member Natacha Guyot for work above and beyond the call of duty on these pages. Thank you!

Technology - and the culture surrounding it - moves very fast. If you can help us improve or update these resource pages, or want to suggest and work on new ones - please contact us.

Critical Commons is a non-profit advocacy coalition that supports the use of media for a variety of scholarly, educational, and creative purposes. It describes itself as "a showcase for innovative forms of electronic scholarship and creative production that are transformative, culturally enriching and both legally and ethically defensible," and its founders say their showcase explicitly includes transformative works like vids and other forms of fan video. In fact, the site specifically invites the work of remixers of all kinds.

While getting and using an account at Critical Commons is a little more complicated than using YouTube or most other commercial services, the site's nonprofit status and explicit commitment to fair use may make it an attractive option for some fans. It is also worth noting that in addition to allowing users to stream and embed video, the site also allows users to download videos in their original resolution and quality.

As you'll see from the instructions below, all uploaded videos must have some commentary attached to them to fulfill the site's mission of "display[ing] media that is placed in a critical context that transforms and recontextualizes the media, adding value and significance to the original work." This can be your typical vidders notes section, or it can be something as simple as "This fan video is a transformative work." (See, for example, lamardeuse's Sherlock vid, Not Responsible.)

Create an Account for Vidding

1. On the Critical Commons homepage, click “register” in the top right of the menu bar. Or, go directly to the registration form. You must first create a Basic User account before you can be upgraded to Advanced User status, at which point you can upload vids.
2. “Full Name” is what name will appear on the site profile that viewers will see. This can be your vidding handle. “Username” is for your login purposes. “Institutional Email” can be your regular email address; this will appear visibly on your profile. (Remember, this site is geared toward academics, who often use more identifying information than vidders.)
3. Once your account is created, login and click Edit Profile. You need to add further information (upgrading your status) before you can upload vids. All fields are mandatory (except Location) to reach Advanced User status.
   
   1. “Title” can be something like “vidder.”
   2. If you have an "institutional" affiliation, enter it here. If you are an independent creator, fan, non-affiliated scholar, etc. you can indicate this here. Some vidders may want to affiliate themselves with the Organization for Transformative Works.
   3. If you don't have a URL where Critical Commons can verify your identity (even a blog or publicly viewable Facebook page will do), CC recommends creating an account at the Archive of Our Own.
4. Save your information at the bottom. If you have addressed all fields in your profile, you should now have a link on your profile that says “Apply for Advanced User Status." When clicked, this generates a message to the site administrator. Advanced user requests are processed manually after verifying your identity. This usually happens very quickly (within 10 minutes of when your request is received). Then, log back in and return to your profile to start uploading vids.

Upload a vid

Every vid you upload must have an attached commentary (either text or audio, even just brief notes are fine). Your vid will not be visible until the commentary is attached. You will upload your vid first, create your commentary, then link them.

1. On your profile page, select Upload a Clip. Enter the vid’s title and browse for your file. There is a 300MB limit. (You can upload multiple files, but this should be used if you are attaching the same commentary to all files, which as a vidder, you probably won’t be. Therefore, it is recommended to do one vid at a time.) The upload bar will appear, but you must click "Start File Upload" to initiate uploading. When completed, click "Next" to move to Step 2.
2. Enter a summary line for the vid (i.e. a one-line blurb) and rate its quality (probably “high”). If possible, select a thumbnail image to represent the clip; this could be a 100x100 icon used for a LJ/DW post. This image will appear on the embed screen before viewers press play.
3. Enter vid info: “Creator” is the vidder, “Distributor” can be left blank, “Name of the Film” is the source footage, and “Year Produced” can be either the date of the source or the date of the vid, as you wish.
4. You can add keyword tags (one per line) that help you and others to identify your vid in the database. Tags can be “vid” or “vidding” if you like, or more specific. Click Next to go to Step 3.
5. Every vid must have a commentary of some length. To add a new commentary, select "Create a text commentary for this clip" (for instructions on adding an audio commentary see separate section below). This takes you to the "Edit Text Commentary" page.
   
   1. “Commentary Title” can be the name of the vid, or something like Vid Notes.
   2. Enter any tags (this will add to the list from before)
   3. The “Commentary Summary” line can be left blank, or you can repeat your blurb. This will appear as part of the text you enter later.
   4. Select your mode of text before entering your commentary.
      • Plain Text will have no line breaks or formatting.
      • Structured Text can have line breaks but no formatting.
      • HTML can have tags for both line breaks and formatting (if you know html code.)
      • Do NOT select Microsoft Word.
   5. You can copy/paste a commentary from a vid release or type your notes. If your commentary is a text file, you can instead upload that.
   6. Leave the copyright license as “Site Default.”
6. Next, to attach the commentary to your vid, click inside the text box under “Clips” at the very bottom of the screen. You can type the name of your vid, but a list of files should appear automatically when you click in the box. The most recently uploaded file should appear at the top of the list. Click its name to select it.
7. Save and review your commentary on the next screen. You cannot make changes here. When finished, click your username on the top right of the menu bar to go back to your profile.

View/Edit your Published Vid

1. In your profile, the default view is to list “Your Clips,” which is a list of your vid files. You can click on any vid title to go to its viewing page. To edit the vid’s tech details, click “edit” on your profile next to the vid’s name. Note: If any vid is listed as “private” (i.e. not “published”), then it does not have a linked commentary and is therefore not visible to the public. See steps above for linking commentaries to vids.
2. To edit a text commentary, first use the drop-down menu to select “Your Commentaries.” This will pull up a list of your commentaries. Click “edit” next to the name to go to the edit screen. After editing, you will be able to see the updated commentary itself. To see it on the vid viewing page, click on the vid name at the bottom under “Related Clips,” or just go back to your profile and click on the vid’s name.

Audio Commentaries

Critical Commons also allows you to add audio commentaries. To do this, you have to record an audio commentary on your computer and upload it as an MP3 file then link it to a clip the same way you link text commentaries. This can also be done via the mobile site using the voice memo feature in most smart phones.

Viewers can then play the clip either with or without the audio commentary. Here is a sample clip that has both audio and text commentaries: Blade Runner 3D photo scene

This page was developed by Laura Shapiro.

There are a lot of reasons to add subtitles to a video:

• They make the video accessible to people who are deaf or hard of hearing
• They make it easier to track and understand the lyrics if it's a music video
• They offer an alternative to posting lyrics alongside the video of a music video
• They provide the opportunity to translate your video into any language

Fortunately, it's quite easy to subtitle a video. There are many different ways to do it, but perhaps the easiest is to use the handy tools at DotSub. One of the advantages of DotSub is that you can time each lyric to appear exactly when you want it to, so they can come in on the beat if you're making a music video and be fully integrated with the vid's aesthetics. And if you mark your video as "public", other DotSub users can add translations in any language, which is really pretty cool.

Creating the Subtitles

1. Register with DotSub and upload your video there.
2. Follow the tutorial to add timestamped subtitles to your video in any language. This is super-super easy and it only takes about 10 minutes to subtitle a 3-minute video.
3. Mark your translation/subtitles as complete. You can then test them on DotSub.
4. If you want to use DotSub as your video host, you're done. Link to the video there, or use DotSub's embed code to embed the video wherever you want.

If you want to add the subtitles to your videos on other streaming services or for download, read on.

Add Subtitles to Videos on Other Streaming Hosts

At the end of the subtitle creation process above, DotSub provides you with a SubRip subtitle file (.srt). This file can be used on a number of different streaming sites, including YouTube and Blip.tv. It can also be offered for download along with a video. The .srt file can also be used to create a subtitle track for a DVD.

Add subtitles to a video on Blip.tv:

1. Download the .srt file from DotSub.
2. Upload your video to Blip.tv. When configuring your upload, click "Add additional format/captioning", browse to select your .srt file, and select the language from the drop-down.
3. Upload the .srt file.
4. Done! You can now use Blip's embed code to have your subtitled video appear wherever you want — your journal, your website, etc. Clicking the "CC" icon in the Blip.tv player turns the subtitles on.

Add subtitles to a video on YouTube:

1. Download the .srt file from DotSub.
2. Upload your video to YouTube. When configuring your upload, click "Captions".
3. Click "Add a Caption Track" and browse to select your .srt file. Select the language from the drop-down, and make sure "Caption file" is selected, not "Transcript file".
4. Upload the .srt file.
5. Done! You can now use YouTube's embed code to have your subtitled video appear wherever you want — your journal, your website, etc. Clicking the "CC" icon in the YouTube player turns the subtitles on.

The process is similar for many other streaming sites.

Offer Subtitles for Downloaded Videos

VLC will play a video with subtitles as long as the video file and the subtitle file are in the same directory (folder).

1. Download the .srt file from DotSub.
2. Rename the .srt file so it has the exact same name as your video. For instance, "MyVideo.avi" and "MyVideo.srt".
3. Make a folder with both files in it.
4. Use Win-Zip or the Mac OS's "Make archive" feature to make a .zip archive of the folder.
5. Offer this .zip file for download, and you're done. You may want to provide instructions to viewers about keeping the two files together.

Alternatives to DotSub

Captioning is taking off and there are now several alternatives to DotSub. The best seems to be Universal Subtitles, which works the same way as DotSub but has a better interface. However, with Universal Subtitles one does not necessarily need to re-upload the video.

NOTE: These instructions will only work if you have your own website, and if your host allows streaming Flash; some hosts don't. If you can host the streaming vid on your own website, you can embed it other places, such as blogs or journals.

This tutorial will show you how to create a Flash video file and give you several options for streaming:

• create an embeddable streaming video
• create a streaming video that can't be embedded by other people
• stream a single video on your webpage
• stream multiple videos on your webpage

Parts of this tutorial were originally posted to rhoboat's Dreamwidth; many thanks to rhoboat for her kind permission to use it!

Step 1: Convert your file to Flash

First you need to convert your video files to Flash video (.flv) format. Some video editing programs/suites may have a converter built-in that you can use; if you're all set with doing the conversion, skip down to Step 2: Upload your video.

If your editing software doesn't already convert to Flash, you can use a third-party program. There are paid programs out there for reasonable prices, but there are also some free or shareware options.

We're listing one option each for Windows, Mac, and Linux to get you started, but there may be others you'll like better if you look around. All of the listed options handle a variety of file formats.

• free option for Windows
• shareware option for Mac
• free option for Linux

Windows users

Windows users can download SUPER to convert videos to FLV. (You need to click through several pages to get to the download link, but the pages all have information on them that you might find helpful.)

Once you've installed SUPER, you'll see something like this:

For a 16:9 streaming video file, try these settings:

• Output:
  • swf/flv (Flash)
  • Flash video codec
  • mp3 audio codec
• Video:
  • 640x360
  • 16:9
  • 25fps
  • 1056 kbps bitrate
  • Keep Hi Quality, Top Quality, and Stretch It checked
  • Uncheck 48K audio.
• Audio:
  • 22050 Sampling Freq
  • 2 Channels
  • 64 kbps bitrate

Jump to "playing with settings"

Mac users

Mac users can download ffmpegX; to use it, you'll need to download several compilers, all linked on that page.

• The mpeg2enc binary link has to be control-clicked to work.
• You do not need to download FLVTool2; the base version will do the conversion.
• This is shareware, not freeware, but you can use it free.

Once you've installed ffmpegX and launched the program, you'll see something like this:

For a 16:9 streaming video file, try these settings:

• Target format:
  • Ignore; these are presets, you want to customize instead
• Video tab:
  • 640x360
  • 16:9
  • NTSC 29.97fps
  • 1100 kbps bitrate
• Audio tab:
  • 22050 Sampling Freq
  • Stereo
  • 64 kbps bitrate
• Options tab:
  • High Quality

Jump to "playing with settings"

Linux users

Linux users can download WinFF to convert videos to FLV (works on Ubuntu, Debian, Redhat, Pascal/Lazarus; also works on Windows).

[screenshots and settings, coming soon!]

Playing with settings

The settings here help keep the file size down while still maintaining pretty good quality overall.

• Managing file size is a balancing act between overall quality and how much bandwidth you're willing to use/how playable you want it to be for people on older, slower systems.
• Play around with the settings until you're happy with the result.

Step 2: Upload your video

Once you're happy with your Flash settings and have your .flv file, upload that to your own personal webspace, such as in a "stream" folder. The direct link to your video will be something like this: http:// www.YOURWEBSITE.com/stream/video.flv

Step 3: Install a flash player on your website

Next, you need a Flash player. For this tutorial, we're using the JW FLV Player, which you can download for free at that link. The player options you choose will determine whether or not people can embed your vids.

• Allow people to embed your vids:
  • By default, the option for the "Viral" plugin is selected; "viral" here means "embeddable", and you should keep that selected if you want a player that will provide viewers with an embed code for your vid.
• Don't allow embedding:
  • If you'd rather people didn't embed your vid (e.g., to protect your bandwidth), deselect the "Viral" option to download the standard player.

Once you've downloaded the file, unzip it and upload all of those files into a folder (flvplayer) on your webspace. The direct link to the player should look something like this:

• http:// www.YOURWEBSITE.com/flvplayer/player-viral.swf  (embeddable player)
• http:// www.YOURWEBSITE.com/flvplayer/player.swf  (standard player)

Step 4: Embed your video

Lastly, you need the embedding code for posting your streaming video, on your website or elsewhere.

Generating the code for your website

For HTML codes for use on your own site you can use this setup wizard, which allows you to plug in your own parameters and preview the vid, so you can see how things look before you go live, and make any necessary adjustments. The wizard streams the vid from your site — you don't need to upload it again.

• "Select an Example Setup"
  • Go with the default "flvplayer with a single video"

• "Change your Flashvars"
  • This is where you set up the player itself.
  • There are only four necessary fields:
    • source (the player on your website)
    • height (this needs to be 20 pixels more than the height of your video, to make room for the control bar on the bottom of the player)
    • width
    • file (your streaming video on your website)
  • Click on "Embed parameters". For a 640x360 vid, set them up like this:
    • Source: http: //www.YOURWEBSITE.com/flvplayer/player.swf (or [...]/player-viral.swf, whichever you chose)
    • Height: 380 (Note: 360+20 pixels to make room for the control bar on the bottom)
    • Width: 640
  • Click on "File properties" and enter the location of your FLV file:
    • File: http: //www.YOURWEBSITE.com/stream/YOURFLV.flv
  • Click on "Update Preview & Code"to see how it looks
    • Your vid will appear under "Preview Your Player" and you'll be able to play it.
    • If there are problems, adjust your parameters until it looks right.

Embed the video on your website

Once it looks good, copy/paste the generated code into your webpage's HTML file where you want the vid to play. You'll need to make a few tweaks to make it work.

• First, at the top of the code, the setup wizard should generate a line of code like this:
  

  <script type="text/javascript"
  
  src="/embed/swfobject.js"></script>

• Change the /embed to the folder you put your player in (/flvplayer) to get src="/flvplayer/swfobject.js".
  • If it just says src="/swfobject.js", insert /flvplayer
  • If you upload your page and don't see a vid, you either forgot to change this or had a typo.
• If you want to have multiple vids on your page, you can either leave the line above each vid, or insert the correct line into your html head material and delete each instance in the individual vid codes, whichever you prefer.

• To embed a single video on a page:
  • Look for this line: <div id='player'>This text will be replaced</div> (This may say either div id='player' or div id='mediaspace'.)
  • Delete "This text will be replaced".
  • The full code for your embedded vid will look something like this:
    

    <script type='text/javascript' src='/flvplayer/swfobject.js'></script>
     
    <div id='player'></div>
    
     
    <script type='text/javascript'>
    var so = new SWFObject('http://YOURWEBSITE.com/flvplayer/player-viral.swf','mpl','640','380','9');
      so.addParam('allowfullscreen','true');
      so.addParam('allowscriptaccess','always');
      so.addParam('wmode','opaque');
      so.addVariable('file','http://YOURWEBSITE.com/stream/YOURVIDEO.flv');
      so.write('player');
    </script> 

• To embed multiple videos on the same page:
  • If you have more vids, or if you think you'll want to add vids at a later date, you need to change a couple more things.
  • Look for this line at the top of the code: <div id='player'>This text will be replaced</div> (This may say div id='mediaspace'.)
  • Look for this line at the bottom of the code: so.write('player') (This may say so.write('mediaspace') — it will match the div id from the beginning of the code.)
  • Delete "This text will be replaced".
  • Rename 'player' (or 'mediaspace') in both instances to something unique and specific to each individual vid.
    • So, if you have three vids, "Wind Beneath My Wings", "Holding Out For a Hero", and "My Immortal", and you want to stream all three, you could set up the codes like this:
      

      <div id='wind'></div>
      
      [rest of code for first vid]
      so.write('wind')
      
      <div id='hero'></div>
      [rest of code for second vid]
      so.write('hero')
      
      <div id='immortal'></div>
      [rest of code for third vid]
      so.write('immortal')

  • When you're done, the full code for an embedded vid will look something like this:
    

    <script type='text/javascript' src='/flvplayer/swfobject.js'></script>
     
    <div id='wind'></div>
    
     
    <script type='text/javascript'>
    var so = new SWFObject('http://YOURWEBSITE.com/flvplayer/player-viral.swf','mpl','640','380','9');
      so.addParam('allowfullscreen','true');
      so.addParam('allowscriptaccess','always');
      so.addParam('wmode','opaque');
      so.addVariable('file','http://YOURWEBSITE.com/stream/windwings.flv');
      so.write('wind');
    </script> 

Once you've finished tweaking the code, you can upload your page. Your vid should be embedded and playable.

Embedding elsewhere

• If you used the viral player:
  • To get an embed code to put somewhere else you can simply play and then pause your vid; the player will provide the embedding code.
• If you used the standalone player:
  • You can use sample code to start with, and adjust it to match your vid until it looks right.

Once you have your embed code, you can then insert on other sites as appropriate (e.g., on Blogger, simply paste the code into a post; on LiveJournal or its clones/forks, use the "Embed Media" option). Depending on the service you're using, you may need a plug-in to work with streaming files (e.g., on Wordpress you can use VodPod; on Joomla, you can use All Videos).

Default sample for a 16:9 video:

<embed width="448" allowfullscreen="true" allowscriptaccess="always" src="http://www.NAMEOFYOURSPACE.com/flvplayer/player.swf" flashvars="height=272&width=448&file=http://www.NAMEOFYOURSPACE.com/stream/video.flv&searchbar=false&showicons=false"height="272"></embed>

Default sample for a 4:3 video:

<embed height="360" width="448" flashvars="height=360&width=448&file=http://www.NAMEOFYOURSPACE.com/stream/video.flv&searchbar=false&showicons=false" allowfullscreen="true" allowscriptaccess="always" src="http://www.NAMEOFYOURSPACE.com/flvplayer/player.swf"></embed>

You can play with all the embedding code parameters for different colors and such, and you can even download pretty skins for your player — just upload them to the same folder as your JW FLV player, and insert that URL into the "skin" parameter.

You can also change the video frame size if you want.

• For example, if you want to fit your 640x360 video into a 500-pixel-wide blog post, you can simply set up a smaller player without having to re-export or re-convert your video.
• Test out different embedding heights and widths so that you don't have black bars with your video.