Webmakers/Projects/Popcorn-DIY: Difference between revisions
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
<div style="display:block;-moz-border-radius:10px;background-color:# | <div style="display:block;-moz-border-radius:10px;background-color:#cccccc;padding:20px;margin-top:20px;"> | ||
<h1>How to Hack a Commercial</h1> {{anchor|Intro}} | <h1>How to Hack a Commercial</h1> {{anchor|Intro}} | ||
<div style="display:block;background-color:# | <div style="display:block;background-color:#ffffff;-moz-column-gap:20px;padding:20px;margin-top:20px;-moz-border-radius:10px;"> | ||
<div style="width: | <div style="display:block;float:right;"> | ||
<div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;"> | |||
[[Image:chooser.png|300px|right]]Choose the Popup Template</div> | |||
<div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;"> | |||
[[Image:timelinemedia.png|right]]Switch out the URL</div> | |||
<div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;"> | |||
[[Image:addevent.png|300px|right]]Add Popup events</div> | |||
<div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;"> | |||
[[Image:popcorn_save_buttons.png|right]]Save your work, export your code and share your commentary widely</div> | |||
</div> | |||
<div style="width:80%;display:block;"> | |||
Add your own voice to an old commercial by adding popups and commentary. You can change meanings, extend messages, and otherwise recontextualize the video. | Add your own voice to an old commercial by adding popups and commentary. You can change meanings, extend messages, and otherwise recontextualize the video. | ||
Step 1: Find a commercial you would like to comment on at http://archive.org/details/prelinger_commercials Browse by collection or title. Once you've found a commercial to work with, choose a file type (we recommend the ogg file format) and click to open the commercial in your browser. | '''Step 1:''' Find a commercial you would like to comment on at http://archive.org/details/prelinger_commercials Browse by collection or title. Once you've found a commercial to work with, choose a file type (we recommend the ogg file format) and click to open the commercial in your browser. | ||
Step 2: Open mozillapopcorn.org:8888 in your browser | Step 2: Open mozillapopcorn.org:8888 in your browser | ||
Step 3: Click "Get Started" and choose the Popup template | Step 3: Click "Get Started" and choose the Popup template | ||
Step 4: There's a gray box in the upper lefthand corner of the video. Roll over this box and change the URL to the URL of the commercial you'll be commenting on. | Step 4: There's a gray box in the upper lefthand corner of the video. Roll over this box and change the URL to the URL of the commercial you'll be commenting on. | ||
Step 5: Drag a popup event to the place in the Timeline where you want the popup to appear. | Step 5: Drag a popup event to the place in the Timeline where you want the popup to appear. | ||
Step 6: Double Click on the event to adjust the text, position, and sticker for that popup event. | Step 6: Double Click on the event to adjust the text, position, and sticker for that popup event. | ||
| Line 19: | Line 29: | ||
Step 7: Keep adding popup events to the timeline. | Step 7: Keep adding popup events to the timeline. | ||
Step 8: When you're ready, click the "share" button and copy and paste your link to save it somewhere. Then, click the export button and save your code. | Step 8: When you're ready, click the "share" button and copy and paste your link to save it somewhere. Then, click the export button and save your code. | ||
Step 9: Share with the world. Share your video link widely. | Step 9: Share with the world. Share your video link widely. | ||
Revision as of 09:30, 1 May 2012
How to Hack a Commercial
Add your own voice to an old commercial by adding popups and commentary. You can change meanings, extend messages, and otherwise recontextualize the video.
Step 1: Find a commercial you would like to comment on at http://archive.org/details/prelinger_commercials Browse by collection or title. Once you've found a commercial to work with, choose a file type (we recommend the ogg file format) and click to open the commercial in your browser.
Step 2: Open mozillapopcorn.org:8888 in your browser
Step 3: Click "Get Started" and choose the Popup template
Step 4: There's a gray box in the upper lefthand corner of the video. Roll over this box and change the URL to the URL of the commercial you'll be commenting on.
Step 5: Drag a popup event to the place in the Timeline where you want the popup to appear.
Step 6: Double Click on the event to adjust the text, position, and sticker for that popup event.
Step 7: Keep adding popup events to the timeline.
Step 8: When you're ready, click the "share" button and copy and paste your link to save it somewhere. Then, click the export button and save your code.
Step 9: Share with the world. Share your video link widely.
Step 10: Iterate your project based on feedback you receive.