• Creating a Website Presentation
     
      http://magazine.magix.com/en/creating-a-website-presentation-06594/
  • Camera MX – A Kaleidoscope of Possibilities
     
      http://magazine.magix.com/en/camera-mx-a-kaleidoscope-of-possibilities-06556/
  • Video of the Month: Gene Lythgow and finding inspiration in the beauty of the world
     
      http://magazine.magix.com/en/video-of-the-month-gene-lythgow-and-finding-inspiration-in-the-beauty-of-the-world-06529/
Digital

every electronic device under the sun

MAGIX

our products, users and coworkers, questions and answers

Tutorials

make handling photos, videos, music, your PC and the Internet as easy as it gets

Home » Tutorials

banner 1 1024x403 Making animations with Photo & Graphic Designer

We have already talked about working with Photo & Graphic Designer in other articles, teaching you how to edit photo’s, design websites, flyers and more. But there’s one nifty option that we haven’t discussed yet, designing an animated gif. A gif is a series of consecutive images that portray a movement. A banner is a nice way of catching attention on your website. How about animating that? You can also use a banner in your e-mail correspondence.

You can choose to make a banner yourself, but Photo & Graphic designer already comes with a few templates, that you only need to edit. In this example we’ve used a template. On the left hand side in the design gallery, click ‘animated banners’. You choose a design by double clicking it, it will then load. After that you can choose to animate separate frames of your liking from which the banner is made of, and change its color.

A gif animation is nothing more than a series of consecutive images that are being looped constantly. You will need the frame gallery to design this. Frames are named with ‘frame-1’, ‘frame-2’, etc. If you click it, you will see that the banner changes. It shows every frame separately and that’s what we are going to work with! If you click on several locations in the banner you will see that it is built up out of separate items, all of which you can edit. Delete, move, add, change color etc., it’s all possible.

banner 2 Making animations with Photo & Graphic Designer

In this example we will edit color and text. Editing text is relatively easy. You just click on the text and start typing. It will replace the current text. By selecting the text you can also easily edit font and size. You will need the last frame later on, so make sure to copy that. Do that by selecting the last frame in the frame gallery and clicking ‘copy’. The banner will constantly loop. To avoid it being too busy, we add in the copied frame at the end. As an effect, the last image will remain on the screen for a little while.

If you finally have the banner the way you want it to be, it’s time to export it. You can do that with the options in the top of the screen. You can choose for a .gif animation or a flash animation. This depends entirely on your wishes. Note that not all devices support Flash, especially mobile ones! Of course you can also use the banner as a hyperlink, for example if you use it in e-mail correspondence.