Confirmed users
895
edits
Webmakers/Projects/Make-a-MadLib: Difference between revisions
no edit summary
(Created page with "Add vintage titles, robots speaking, comic style speech bubbles and your own special brand of silly to make a mad lib for your viewers to fill out. Step 1: Open mozillapopcorn...") |
No edit summary |
||
| Line 1: | Line 1: | ||
<div style="display:block;-moz-border-radius:10px;background-color:#cccccc;padding:20px;margin-top:20px;height:650px;"> | |||
<h1>Make a MadLib</h1> {{anchor|Intro}} | |||
<div style="display:block;background-color:#ffffff;-moz-column-gap:20px;padding:20px;margin-top:20px;-moz-border-radius:10px;height:81%;"> | |||
<div style="display:block;float:right;"> | |||
[[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> | |||
<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> | |||
[[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> | |||
[[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 style="width:80%;display:block;"> | |||
Add vintage titles, robots speaking, comic style speech bubbles and your own special brand of silly to make a mad lib for your viewers to fill out. | Add vintage titles, robots speaking, comic style speech bubbles and your own special brand of silly to make a mad lib for your viewers to fill out. | ||
Step 1: Open mozillapopcorn.org:8888 in your browser | '''Step 1:''' Open http://mozillapopcorn.org:8888 in your browser | ||
Step 2: Click "Get Started" and choose the Mad Lib template | '''Step 2: Click "Get Started" and choose the Mad Lib template | ||
Step | '''Step 3:''' Start by using the Robots Invade Everywhere video that is preloaded into the template or click the Edit Source button in the upper lefthand corner of the video and change the URL to the URL of the video you want to work with. | ||
Step | '''Step 4:''' Drag the "Filmgrain" event from the right panel into the beginning of the timeline. You can click and drag the right side of the event to make an event longer. | ||
Step | '''Step 5:''' Drag the Title-Top event onto a new track in the timeline. If you need a new track, click the Track+ button on the lower left-hand side of the interface. Double Click the Title-Top event and change the title. Make sure the "Target" is "Video Overlay". Click done. You can also add and edit the Title-Mid event and change the wording there. Don't forget to a the Title-Bottom for your name! | ||
Step | '''Step 6:''' After you've clicked done on each of the title events, place a Zoink event somewhere on the timeline. Double Click the "Zoink" event and change the text. You can also change the bubble style (speech or thought bubble). Try out different classes and use the "Top" and "Left" properties to position your bubble. Play around with the options so that your Zoink bubble is positioned the way you like. | ||
Step 7: Drag a Speak event to the Timeline. Double click to change what the robot voice says and play around with those options. | '''Step 7:''' Drag a Speak event to the Timeline. Double click to change what the robot voice says and play around with those options. | ||
Step 8: Add a map to second :19 extend the event to cover up the spot in the | '''Step 8:''' Add a map to second :19 extend the event to cover up the spot in the film where it says "the users map". Double Click to set it's location and click done. | ||
Step | '''Step 9:''' Drag an image event to the Timeline around :22. You can use any image from the web to cover the note "users facebook picture", but pay attention to the voice over in the video. The robots are targeting a specific person. | ||
Step | '''Step 10:''' Continue adding and editing events until your video is what you want it to be. 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 11: Share with the world. Share your video link widely. Tweet your video link with the tag #AllHailRobots | '''Step 11:''' Share with the world. Share your video link widely. Tweet your video link with the tag [https://twitter.com/#!/search/realtime/%23AllHailRobots #AllHailRobots] | ||
Step 12: While waiting for the invasion, iterate your project based on feedback you receive. | '''Step 12:''' While waiting for the invasion, iterate your project based on feedback you receive. | ||
</div> | |||
</div> | |||
</div> | |||