Part 2 of Flutterby Cupcakes

This second part is the continuation from previous project where I was assigned to create a poster and a short Video while exploring the tools in Adobe Photoshop CS2 & Adobe Premiere Pro. Only this time, the course focuses more on interactivity within a website (hence the name Interactive Multimedia). With the use of Macromedia Dreamweaver and Flash, I'm assigned to create a Website which consist of Text, Graphics as well as Animation (most important aspect).

I'll be using the same product & service which is 'Flutterby Cupcakes'. I chose the same product so that I can focus more on the software's tools & discover more things instead of wasting time to find a new product. This way, I can see the growth of my idea and skills through using more multimedia elements.

At the end of this trimester, I hope to have the experience of being a 'Webmaster' and learn to categorize content accordingly.

Cheers!

I showed my video to Dr. Ken and he said there are certain things i can improve:

1. The video towards the end with the jumping people, was a little too long (40 secs)
2. Need more Cupcakes images at the end of the video


Since I managed to complete my project slightly earlier, I had the advantage to edit it before the final submission. So here's my Video Finale:

Flutterby Cupcakes Finale

I think Dr. Ken has a point about the finishing of the video. After adding more cupcake images towards the end of the video, I think I'm satisfied with my work ;)

What Have I Learned? (Part II)

|Review of the Video|

1. T.I.M.E is precious
It took me almost a week to complete my video editing. I know I can go on and on since it's really fun, but Ms. May Chan (a lecturer from MMU) gave me a very good quotation when she talked about designing. She said 'The thing about designing is knowing when to stop"...

For me, that was the best thing to do. So I did my final editing and finally... I STOPPED! I know I'll never be satisfied with the outcome till the final day of the submission.

2. Recycle!
Most of the images used in the video was edited in Photoshop. I changed the brightness and the contrast to make the pictures look clearer and nicer. The first assignment has helped me a lot! Most of the pictures I edited in Photoshop for the Poster, was used again for the Video. Well, that was my approach to save loads of time ;)


|Problems|
There are some difficulties i faced while editing the video. And it took some time to actually find a way to solve it. In some cases, I cant solve it at all. Let's take a look at some of it in details :

1. The entire video file went offline

When the files are offline, the screen goes red. The first approach i took was to replace each clip one by one. It took a lot of time and by the time i managed to replaced all of it, It was time for me to leave for class. So I switched it on after I got back and guess what? It went offline again!!!

I had no other choice but to open a new Sequence and paste everything from the previous one. That sort of solved the Offline problem.


2. Program Shut-Down

There was something wrong with my video and I was unable to encode the file. Everytime i save it, the whole program shuts down. So again, I had to copy the whole finished video, opened it in a new project and export it as a movie.

Exporting it as a movie result to a larger file size. The file was 105,052 KB (too large for the web). But after exported, it's no longer a .propj (Adobe Premiere Pro). It's now an .avi file (I named it 'Sequence 01').

Then I opened a new project and dragged the 'Sequence 01' to the Timeline. Only then I was able to Encode it to a smaller .avi file. The size was almost similar, but the encoded file was only 4,158 KB. See the difference?

In my understanding, there might be something wrong with my software or one of my files was corrupted.

Flutterby's Video

Flutterby Cupcakes

Finallyyyyyyyyy, I'm done! Hoorayyyyyyy! The only thing I dislike is the black frame beside the image (gap). During the Encoding/Rendering process, I cropped the image to nicely fit the frame without having any gaps on top or on both sides of the video. However, after uploading the video, the gap appeared. If I have the time, I'll find a way to fix that.

This is so far my final outcome of the video. There might be changes though, since the presentation is next week. But hopefully, I can stick with this one ;)

Creating The Video

|Step 1|
The first step is to save the project. I saved my file as Cupcake Video.

|Step 2|
Next I started editing by opening all the images and the Sound files I need and dragged them to the Timeline.

|Step 3|
Then I created a text file by going to Title>New Title>Default Still. I chose default still because I didn't want the text to move.

|Step 4|
Since Flutterby represents Butterfly, I decided to put an animated butterfly to make the video more interesting. I animated the butterfly using Flash. The butterfly Image used is copied from flutterby's logo, then animated.

This is my first attempt to use Flash and the best and quickest way is definitely to Google for Flash Tutorial. I had no idea how to use Flash, so this time I had to follow the step by step tutorial (unlike the Adobe Tutorial where I only followed halfway and got the result I wanted before actually finishing the tutorial).

Animating the Butterfly using Flash

The Outcome

For the Flash Tutorial, click here

|Step 5|
I think my first try using Flash went allright, so I just proceeded to the next stage. I added the animated butterfly on the text and set it to Overlay (to make the text visible while the butterfly animates).

|Step6|
Next I added Video Transitions and changed the Speed/Duration for each Image and text.

Video Transitions

I also Increased the volume for the drumbeat to make certain part of the video more catchy.

Volume Adjustment

|Step7|
I played the video a couple of times to make sure that It's fine. Then I Exported the video. To do this, I go to File>Export>Adobe Media Encoder. I chose this option because I need to compress the video to a smaller size (to fit the web). And again, I managed to get an Adobe Video Tutorial from the internet, which thought me the trick to compress videos while maintaining the pixels. This guide is so simple to follow coz it's a video & audio tutorial.

For the guide, go to http://www.adobe.com/designcenter/premierepro/articles/prp2am_exportmovie/popup.html

Check out my final Video on my next post!

Captions for the Video

Before I begin editing the video, I need to create a storyline to make the video more interesting. This way, I'll know which picture to put. Here are the captions:

|First Phase|
It’s really not difficult to make people smile
Crack a joke
Bake some cookies
Or even by simply smiling at them

|Second Phase|
Want to know a better way?
Give them a cupcake!

|Third Phase|
Make your love ones HAPPY
Make your guests smile
Make your occasions worth remembering

|Fourth Phase|
Flutterby Cupcakes
The perfect gift for all occasion..

|Fifth Phase|
We can make your guests jump with joy!

|Sixth Phase|
Log on to www.flutterbycupcakes.blogspot.com
Or contact Ms. Kayla at 016-3020644

Now that the captions are done, I can start editing the video and suite the caption with the Audio.

Wish me Luck!

Materials for Video

Before creating the video, I need to gather materials to be inserted in the video. Since this project's requirements is to only use still images, I managed to get some interesting pictures that's related to the video.

Instead of putting only cupcake images, I decided to put Happy Faces to suite the happy theme. Here are some of the pictures: