top of page

Flash Banner and 3D example

  • Writer: cernigliafederica
    cernigliafederica
  • Mar 29, 2017
  • 2 min read

Before working on my final Flash Banner I practiced using three different pictures.

I used Adobe Animate to create my flash banner.

All the process was quite difficult because if I misspelled a word or I missed a step, then I had to start all over again.

First of all I had to resize the canvas to 600x150 as a banner size. I had to align the first image to my canvas and then add key frames to it, starting with 24 an 30.

Then I had to a color effect to the image, so I clicked on frame 24 and then on the image. On the right side of Animate, a window appeared. I had to change the color effect by adding "Alpha" e change it to 100% and 0% for frame 30.

Just after that I had to add a transition by right clicking between frame 24 and 30 and adding Classic Tween.

Then I locked layer 1 and created a new layer for the second image. There I started again, but putting a key frame of 54 and 60. For the last image, the layer had a key frame of 84 and 90.

After that I created three buttons, which later on I can click on it and change image. I created a new layer called "buttons" and then I made a rectangle by using rectangle tool and designed it as I wanted. After changing it into a symbol and button, I double clicked on the rectangle to insert the key frames.

I duplicated the buttons other 2 times for a total of 3 and positioned them where I wanted on my images. I saved and then I added the actions. I found this really hard because for many attempts I had to write them down again and again as there was always something wrong.

The only problem is that I couldn't save it as a gif, so that's something I need to know and improve.

I also learned how to create 3D titles. I used After Effects to create it and it wasn't that hard. As first I created a composition which I changed then in a 3D mode by clicking on the little 3D box and changing the renderer in Ray-traced 3D.

Then I added the camera to it and using the camera tool I could rotate my text, 3D, to a 360 degrees.

I changed then the geometry of the text and moved the position arrows at the middle of the text so it could rotate on the centre.

To let it rotate then I changed the Y-rotation and X-rotation to have a full rotation toward right and up and down.

(I changed my text to "Spring" because I wanted to change it into a floral background, using one of my images.)

I added the background and then an alpha filter to the text.

I'm really happy with the results, even if I probably preferred to have the background moving too with the text to be more realistic.


Comentarios


Recent Posts
Archive
bottom of page