Green screen set photos

Module 15 wrap-up

The tips and tricks to publishing a quality .mov file from Flash:

1. Change your fps to 12. This means you will have to bring the final .mov into a video editing program and speed it back up to 200%. Video editing programs, such as iMovie, Final Cut Pro, Premiere, are the best way to add sound as well, so I recommend deleting any audio tracks from Flash and laying them down again in the editing program.

2. Make sure you have enough frames out in Scene 1-- if you only have one frame, the .mov will only record a split second.

3. Under the export settings, enter the length of your video, instead of stopping "when last frame is reached"

4. Consider buying an affordable video screen recorder, such as Screenium, for $30.

Great job this semester everyone, I hope you are proud of everything you accomplished and learned! Stay tuned for a link to our final Girl Talk interactive music video.

Module 14 wrap-up

Your animations are off to a great start everyone, I hope you enjoy editing to music even more now that you have these trimmed clips :)

I would really love to see everyone animate the colors and motions of their spotlights if they haven't already; it's optional, of course, but i think it would look really great.

If you would like to use your estimated audio clip of Oh No, I have trimmed and named them for you here:

http://www.mediafire.com/?x7cu5jdp64jdchc

Tonight we went over importing .flv videos into a movie clip, and also advanced motion tweening with the Motion Editor.

A written tutorial on Motion Editor in CS5

A video tutorial on Motion Editor in CS4 (pretty much the same)

Module 13 wrap-up

The link to the Final Rubric can be found here



The group music video animation file can be downloaded here:
http://www.mediafire.com/?vdjz7se4088l6bf

For now, leave out the video of SF while you animate, for it slows down the program and I don't want your file to crash!

I did preview it and it looks awesome with the video inside, great job so far class :)

Module 12 wrap-up

Tonight we covered keying out green screen in After Effects and exporting the footage as an FLV with transparency.

This is a refresher tutorial of how to do this:
http://www.gotoandlearn.com/play.php?id=93

Note that there are working files to download if you would like to see them, in the upper right corner of the site.

Additionally, Tim recorded this rendering/exporting process as a reminder of how to generate FLV files with transparency:


And finally, here is a link to the .fla reminder of where you should be animating the scene on your iPhone:
http://www.mediafire.com/?c226v2wh5386soz

For Monday, please make sure everyone has the:
1. Party Bus
2. Bus driver
3. SF video

So that Welson can animate the Properties of the bus and so that we can begin animating in class Monday.

Hyper-focus on creating your app demo video in Flash this weekend, minus the video-hand component.

Module 11 wrap-up

We will be meeting in the 3rd floor lounge at 4pm this Wednesday, I
will be joining you guys in the green screen room to animate your hand
gestures for your SmartPhone app demo video.

For Thursday, please animate the first 15-seconds of your app demo video.

For your music video by Thursday:
Sarah will be supplying the Party Bus interior
Gaby will be supplying the animated Bus Driver
Welson will be supplying the Disco Ball
Tomas will be supplying the 6 minute video


Tonight everyone drew for their estimated portion of the music video song:

Intro: 10-20 seconds
1st character to enter bus: Tomas' Raincloud Robot starting roughly
0:15, with the bus driver to keep him company
2nd character to enter bus: Welson's British Monkey starting around
1:15, with the bus driver and the robot to keep company
3rd character to enter bus: Sarah's Marvin Martian starting around
2:15, with the monkey, robot, and bus driver to keep vcompany
4th character to enter bus: Gaby's Pink Bear starting around 3:15,
with all 4 characters to keep company

Start thinking about how you will pass the time! Think of it like Soul
Train, or American Bandstand.


Think about silent films, miming, and OH YEA interactivity!



The 1 minute of your animation should have drag-and-drop ability or a
modified mouse follow of some kind, so perhaps treat your 1 minute
like an interactive game, it may very well be the quickest way to pass
the time.

Module 10 wrap-up

Link to Girl Talk music video song for download

The link to our class character demonstration from tonight

Module 9 wrap-up

Tonight we went over several Flash tutorial resources, including:

http://www.flashandmath.com

http://www.kirupa.com

http://www.miraztutorials.com/50-awesome-flash-cs4-tutorials-from-youtube/

Tonight we also fleshed out ideas for our music video;
It will be a party bus of various creatures driving through San Francisco.




For Thursday, Tomas will be taking a GoPro video of a bike ride through SF and everyone will be illustrating a character and writing a 1-page background of this character, complete with video and/or still imagery MOOD BOARD.

Additionally, you will be answering three fantasy questions that I handed out and mocking up an iPhone app homepage for your favorite one. Please bring in the paper, as I want you to share all 3 ideas.

We are NOT going to be using the green screen room this week, we have decided that the green screen footage will be used for our app demo videos, similar to this footage, and the Lily Allen music video footage (in previous post):

Module 8 Wrap-up

Tonight we learned how to:
Drag and Drop movie clips
Have a movie clip follow a mouse
Hide a movie clip on click

Please explain how you will use these three concepts in your interactive music video.

Some inspiration shown tonight:



Monday's assignment is very similar to what was due tonight.
Invent a SmartPhone application that incorporates both random nouns you were given tonight, and then design a homepage for it, complete with at least one screenshot of how the app looks on the phone.
Also, another 1-page writeup, incorporating the 3 lessons we learned tonight, in addition to addressing more clearly our ideas of how interactivity and green screening will be VITAL to the PLOT of our music video.

Module 7 Wrap-up PART TWO

A fantastic user-editable animated breakdown of the songs sampled in GirlTalk's Oh No is available here:
http://readyrickshaw.com/toob/node/63#0
Perhaps our interactive concept could involve something educational involving the timing of the samples? Just an idea.

Play the song Oh No by GirlTalk here:


Make sure to type out one page (THREE PARAGRAPH MINIMUM) on your Big Idea for the five-minute group music video for GirlTalk's Oh No

Ask yourself these questions to come up with some great storylines:
What movies have I wanted to end differently?
What visuals come to mind when you listen to the song?
What would make a good plot twist?
What is the history of some of these song bites?
Who are the artists in the song and what are the lyrics?
What childhood stories or fables did I love to read growing up?
What funny stories have my friends told me lately that would make a great animation?
What weird dreams have I had recently that would make for a crazy story?
What video tutorial would I like to try?
What flash interactive tutorial would I like to try?



And then ask yourself these questions when narrowing down your decision:
Do I want my story to make someone laugh or cry?
Does my idea make the audience confused or think really hard?
Does my idea really need green screen or interactivity?
Does the song go well with my idea?


Some inspiration shared by your classmates:

Module 7 Wrap-up PART ONE

For Thursday you are designing an iPhone app, and it's homepage, for your classmate.
They should be the inspiration of your app, as a gift for them.
This app should not already be in existence, so PLEASE RESEARCH AND AUDIT existing iPhone app ideas!
I will be doing the same.

Some funny iPhone apps from the past:


Two homepage examples given in class:



If you aren't sure where to begin, check out the categories of apps on Apple's site www.apple.com/iphone Or for the Android https://market.android.com/ Or search YouTube or Google for Best / Funniest / amazing / helpful / ugly / educational / weirdest / useless iPhone apps and see what kind of lists you get!

Module 6 wrap-up

Tonight we went over our Group Animation assignment.
Here are a few examples we played in class, for visual inspiration:




Please read over the class rubric here carefully to make sure you've hit all the important marks for the midterm project.


For interactive inspiration, please consult this award-winning website by Arcade Fire for their song Neon Bible


Here is an interactive music video by the Cold War Kids:
(We won't be incorporating the audio interactivity but the visual we can do)


Additionally, here are two videos on continuing work with the Bone Tool

Module 5 wrap-up

Tonight we covered making a button Play within your timeline navigation.
Here is a refresher tutorial on that:

We learned as far as minute THREE so feel free to stop at 3:00, however he goes on to show you how to make a "Stop" button as well if you would like to see how easy that can be, watch on!

Please remember, you will still need your 15-second banner ad to also go to "sfoutsidelands.com" so think about placement for those two buttons, knowing they canNOT overlap.

For Thursday's class, please bring an illustrated vector pack for your 15-second ad and be prepared to talk about your 15-second story. I highly encourage you to begin animating, as this will save you time for the final Monday deadline.

Module 4 Wrap-Up

Tonight we covered making buttons and programming "Click to Go To Webpage"

Here is a refresher tutorial on creating buttons:


And this tutorial goes over linking a button to a website, such as sfoutsidelands.com:


We also learned how to use Masks and Motion Tweens together to create a magnifying effect.
Here is a link to download the Masking Tweens file:

http://www.mediafire.com/?73qmr0xujbm9w5n

There is no class next Monday and so we will be having a make-up class on Wednesday from 7-10. The room may change and so I will email you the room number and reminder on Wednesday.

I expect to see your 10-second banner completed on Wednesday and a vector pack for your 15-second animation for Thursday. Keep in mind your midterm banner campaign is due a week from Monday and so consider beginning to program your 15-second ad as well. Also, bring music suggestions from Outside Lands bands that don't already have a music video. Otherwise, we will be animating a portion of HP Lovecraft's "The Outsider" as a group project.

Module 3 Wrap-up

For Thursday's class, please bring a new vector pack and storyboard for your 10-second banner ad.

Also, finish up programming your 5-second banner ad, complete with Mask layer, so that we can program a button inside of it during Thursday's class.

Here is a great piece Outside Lands Flash inspiration that Welson shared with us in class:



In class, we went over learning how to Mask and also learned a trick on using Split Motion. Here are two tutorials reviewing these lessons:

Masking a banner ad:


360 degree spin and Split Motion:
This is an intermediate visual tutorial on making a 3D box spin.
The Split Motion we talked about is covered after Step 16.
However, be sure to check out the tutorial anyways and click on the 3D box! You will be able to make this on your own before you know it, and here is how.

As another tip, here is a list of additional ways you can manipulate a Motion Tween to your fullest advantage:
http://www.adobe.com/devnet/flash/learning_guide/animation/part06.html#splitting
It's also a good resource if you have forgotten how to select or move a specific Keyframe, or any other Keyframe tips we covered in class.

Module 2 Wrap-up

For next Monday, please make a vector pack of all of the assets of your first 5-second banner ad. Use Flash or Illustrator to draw.


There are free vector pack .eps files out there for you to use and download, however I encourage you to modify them a lot to ensure you have a strong look-and-feel to your ad; each artist creating vector packs has their own style that don't always mesh well together. Here are some to look at for inspiration.

Vector packs can end up being a great way to have your portfolio discovered online. Several artists such as Johnny Doomsday have been discovered by simply offering up their vector work for free as a sort of "virtual business card" and hired to work on other projects.

Then, storyboard five or six animation cels (in Illustrator or Flash) using your vector pack characters.


Please remember, each cel represents one second of time passing, and lots can happen in one second! Look how much happens in 5 seconds of these flash animations. Ross Phillips has over 10 character changes in these 5 seconds.

5 Second Project - Reverse from Ross Phillips on Vimeo.

5 Second Project - Fail from Ross Phillips on Vimeo.

And finally, here is a refresher tutorial on Motion Tweening. Skip the first 1 minute, he starts out a little slow.

Overview of Monday 6/20

If you would like a refresher on tonights class, please watch the short (1-2) minute Adobe videos listed as 02 through 07 below this video link found here:
http://tv.adobe.com/watch/learn-flash-professional-cs4/getting-started-02-understanding-flash-file-types/



Refresher tutorials should NEVER be used as a substitute for participating in class, as class participation and weekly assignments are worth 30% of your final grade (that's 2% of your grade accomplished during every class!)

Web Mood Boards

Once done, by hand, as cut-and-paste wall collages, a virtual mood board is a smart way to start a campaign for several reasons.
Here are some great ones, from 404 Creative:

What are the benefits?
Faster mockup production
Some clients will argue that they don’t want to pay for mood boards and would rather go straight to mockups, but a few short hours spent up front can save countless hours down the line. With a visual guide created and a clear vision of where you’re headed it’s much easier to jump right in to the visual prototyping process. There is no blank-canvas syndrome to deal with, and no gnawing feeling that you are wasting your time on a concept they might not like. Best of all, there are no big surprises. Since using mood boards I have yet to run into a project that was a complete do-over.

Smoother client buy-in
Additionally, early client participation makes them a bigger part of the project. When clients feel involved they are more likely to trust you. Mood boards make it clear that you are listening to them and considering their input. They also gain insight into the thinking behind your decisions, dispelling the all-too-common notion that designers choose everything on a whim. Knowing why you picked something will often keep personal preferences (ie/ the client’s favorite color is purple so she would like to see that as a background) from creeping in as change requests.

Less frustration, more fun
Mood boards are so much fun, they hardly feel like work. Designing loosely lets you brainstorm, explore and play with different styles without all the limitations a layout (and coding realities) will later impose. They also keep revision cycles to a minimum, something every designer can appreciate.

Examples

Hello and Welcome

We're going to get a lot of fun thing accomplished this summer, so let's get started!

First, please make your ZooTool account and post your URL and user name as a reply to this blog post. Please consult this link for 10 tips on how to maximize your ZooTool account, as well as these twelve tips right from the makers of ZooTool.


Next, please visit http://www.bannerblog.com.au/ and also post here two banner ads that you wish you knew how to make, along with a third banner ad from the Webby Award winners and nominees
http://www.webbyawards.com/webbys/current.php



For Thursday's class, create a mood board for Outside Lands 2011. Also, bring to class five campaign ideas for your midterm Outside Lands 2011 banner campaign. Each of the 5 ideas will include a pencil sketch of all three ad sizes below. This means you will be showing in class 15 total sketches (five each of the three sizes.)


Most banner ads come in standard sizes. Canned Banners currently offers the most common ad sizes (width x height in pixels):

728×90 “leaderboards”
300×250 “medium rectangles”
160×600 “skyscrapers”



There are a lot more banner ad sizes than just the three sizes above. You can find more details at the Interactive Advertising Bureau (IAB).

I will remind you:
For the midterm campaign,
-One of the three ads must be a minimum of 5 seconds long
-One of the three ads must be a minimum of 10 seconds long
-One of the three ads must be a minimum of 15 seconds long in total AND ALSO have a stop/play "click to play more" type of interaction with the audience, much like this award-winning Pringles banner ad:
http://www.bannerblog.com.au/2009/06/pringles.php