Webmakers/Projects/Popcorn-DIY: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(8 intermediate revisions by 2 users not shown)
Line 1: Line 1:
<div style="display:block;-moz-border-radius:10px;background-color:#cccccc;padding:20px;margin-top:20px;">
<div style="display:block;-moz-border-radius:10px;height:650px;">
<h1>How to Hack a Commercial</h1> {{anchor|Intro}}
<div style="-moz-border-radius: 10px;width:25%;height:345px;background-color:#A2BFF4;float:left;display:block;margin:1.5%;border: 1px solid #C4C295;text-align:left;padding:2.5%;padding-top:0px"><h2>Hack a Commercial</h2>
<div style="display:block;background-color:#ffffff;-moz-column-gap:20px;padding:20px;margin-top:20px;-moz-border-radius:10px;">
[[Image:Title_commercial_small.png]]<br/>
<div style="display:block;float:right;">
Add your own voice to an old commercial by adding pop ups and commentary. You can change meanings, extend messages, and otherwise recontextualize the video.


[[Image:chooser.png|300px|right]]<br/><div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;">Choose the Popup Template</div>
[https://wiki.mozilla.org/Webmakers/Projects/Hack-a-Commercial Hack a Commercial]
</div>


<div style="padding-left:30px;">[[Image:videourl.png]]</div><div style="font-size:10px; color:#333333;font-style:italic;padding:0px 0px 0px 25px;">Switch out the URL</div>
<div style="-moz-border-radius: 10px;width:25%;height:345px;background-color:orange;float:left;display:block;margin:1.5%;border: 1px solid #C4C295;text-align:left;padding:2.5%;padding-top:0px"><h2>Make a Mad Lib</h2>
[[Image:Title_madlib_small.png]]<br/>
Add vintage titles, robots speaking, comic style speech bubbles and your own special brand of silly to make a mad lib.


[[Image:addevent.png|300px|right]]<br/><div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;">Add Popup events</div>
[https://wiki.mozilla.org/Webmakers/Projects/Make-a-MadLib Make a MadLib]
 
[[Image:popcorn_save_buttons.png|right]]<br/><div style="font-size:10px; color:#333333;font-style:italic;padding:15px 0px 10px 25px;">Save your work, export your code and share your commentary widely</div>
</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.


'''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.
<div style="-moz-border-radius: 10px;width:25%;height:345px;background-color:#C0C0C0;float:left;display:block;margin:1.5%;border: 1px solid #C4C295;text-align:left;padding:2.5%;padding-top:0px"><h2>Report the News</h2>
[[Image:title_newscast_small.png]]<br/>
Add lower thirds and extra video footage to create a newscast about any topic you choose.  


'''Step 2:''' Open [http://mozillapopcorn.org:8888 Popcorn Maker] in your browser
[https://wiki.mozilla.org/Webmakers/Projects/Report-the-News Report the News]
 
</div>
'''Step 3:''' Click "Get Started" and choose the Popup template
 
'''Step 4:''' Click on the Edit Source button in the upper lefthand corner of the video. 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.
</div>
</div>
</div>
</div>

Latest revision as of 11:45, 18 June 2012

Hack a Commercial

Title commercial small.png
Add your own voice to an old commercial by adding pop ups and commentary. You can change meanings, extend messages, and otherwise recontextualize the video.

Hack a Commercial

Make a Mad Lib

Title madlib small.png
Add vintage titles, robots speaking, comic style speech bubbles and your own special brand of silly to make a mad lib.

Make a MadLib

Report the News

Title newscast small.png
Add lower thirds and extra video footage to create a newscast about any topic you choose.

Report the News

Retrieved from "https://wiki.mozilla.org/index.php?title=Webmakers/Projects/Popcorn-DIY&oldid=442198"