SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 32
  1. #1
    SitePoint Evangelist
    Join Date
    Jun 2007
    Posts
    496
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    GIF Animated Banner Creation ?

    How is Gif animated banners created ?
    Is it with flash ?

    But when I try to export flash as gif movie its clarity is very much decreased ?

    Any other tool or methods ?

  2. #2
    Night Elf silver trophybronze trophy Varelse's Avatar
    Join Date
    Mar 2005
    Location
    eu
    Posts
    5,967
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    GIF banners have some limitations in comparison to Flash ones - for example they cannot contain more than 256 colors, which is the main reason of the lowered quality. They have to be designed with these restrictions in mind, otherwise the results may be disappointing.
    FreelanceDaddy - freelancer's personal advisor
    █ Guide and advice for freelancers starting their career
    █ Over 1000 projects posted on freelance markets every day
    █ One-stop resource for online freelancing

  3. #3
    SitePoint Member khdesigns's Avatar
    Join Date
    Jun 2008
    Location
    SD
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can also create animated gif banners in photoshop. They do have limitation with colors and clickability, but if you know the limitations and work with them, they work just fine.

  4. #4
    SitePoint Evangelist
    Join Date
    Jun 2007
    Posts
    496
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by khdesigns View Post
    You can also create animated gif banners in photoshop. They do have limitation with colors and clickability, but if you know the limitations and work with them, they work just fine.
    but we can't create animation in photoshop.


    256 colors only ?
    But I have seen many beautiful banners in gif ?

  5. #5
    Night Elf silver trophybronze trophy Varelse's Avatar
    Join Date
    Mar 2005
    Location
    eu
    Posts
    5,967
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by priyakochin View Post
    256 colors only ?
    But I have seen many beautiful banners in gif ?
    256 colors does NOT mean ugly design. There are plenty examples of good banner design and the still are 256 color or less.
    Last edited by Varelse; Jul 3, 2008 at 11:17.
    FreelanceDaddy - freelancer's personal advisor
    █ Guide and advice for freelancers starting their career
    █ Over 1000 projects posted on freelance markets every day
    █ One-stop resource for online freelancing

  6. #6
    SitePoint Member khdesigns's Avatar
    Join Date
    Jun 2008
    Location
    SD
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by priyakochin View Post
    but we can't create animation in photoshop.


    256 colors only ?
    But I have seen many beautiful banners in gif ?

    Yes you can create animation in photoshop via the animation pane. Like the previous post mentions, 256 color does not mean it has to look like crap. If you want an animated gif, there are limitations that come with it but if you know what they are, you can still have a very nice looking banner.

  7. #7
    SitePoint Enthusiast Xavier_3D's Avatar
    Join Date
    Sep 2007
    Location
    Karachi, Pakistan
    Posts
    66
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's my 256 Banner that I made in flash. It was highly commended. So that means you can actually create things very easily, you just need to know to play with your colours.

    To improve quality, try to render most images in JPG high quality.

    Hamza Shams
    CEO Xyber 3D Studios

  8. #8
    SitePoint Evangelist
    Join Date
    Jun 2007
    Posts
    496
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What all are the colors supported by gif ?

  9. #9
    Night Elf silver trophybronze trophy Varelse's Avatar
    Join Date
    Mar 2005
    Location
    eu
    Posts
    5,967
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by priyakochin View Post
    What all are the colors supported by gif ?
    Any color you wish, just the total number cannot exceed 256.
    FreelanceDaddy - freelancer's personal advisor
    █ Guide and advice for freelancers starting their career
    █ Over 1000 projects posted on freelance markets every day
    █ One-stop resource for online freelancing

  10. #10
    SitePoint Enthusiast Xavier_3D's Avatar
    Join Date
    Sep 2007
    Location
    Karachi, Pakistan
    Posts
    66
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    http://www.lightsphere.com/colors/

    Here's the List. They are just 216 Colours. So that makes them to comply to even older browsers. The new Preference is 256 though.

    I'm Waiting for APNG's though.
    Hamza Shams
    CEO Xyber 3D Studios

  11. #11
    Keep Moving Forward gold trophysilver trophybronze trophy
    Shaun(OfTheDead)'s Avatar
    Join Date
    Nov 2005
    Location
    Trinidad
    Posts
    3,746
    Mentioned
    45 Post(s)
    Tagged
    0 Thread(s)
    Varelse is right, Priya.




    Trying to fill the unforgiving minute
    with sixty seconds' worth of distance run.

    Update on Sitepoint's Migration to Discourse

  12. #12
    Night Elf silver trophybronze trophy Varelse's Avatar
    Join Date
    Mar 2005
    Location
    eu
    Posts
    5,967
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Xavier_3D View Post
    http://www.lightsphere.com/colors/

    Here's the List. They are just 216 Colours. So that makes them to comply to even older browsers. The new Preference is 256 though.

    I'm Waiting for APNG's though.
    Do people really use web-safe colours now?

    APNG looks good, but with its massive file weight it will take some time before it becomes popular. The spinning Firefox logo is almost 600kb large
    FreelanceDaddy - freelancer's personal advisor
    █ Guide and advice for freelancers starting their career
    █ Over 1000 projects posted on freelance markets every day
    █ One-stop resource for online freelancing

  13. #13
    SitePoint Enthusiast Xavier_3D's Avatar
    Join Date
    Sep 2007
    Location
    Karachi, Pakistan
    Posts
    66
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Varelse View Post
    Do people really use web-safe colours now?

    APNG looks good, but with its massive file weight it will take some time before it becomes popular. The spinning Firefox logo is almost 600kb large

    I do when I am designing animations. It helps. Ya I know APNG is heavy. But still if it preserves quality, I'd rather like to get with it. Still waiting for it to become popular though. No use, if only I can see it.
    Hamza Shams
    CEO Xyber 3D Studios

  14. #14
    SitePoint Evangelist
    Join Date
    Jun 2007
    Posts
    496
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    can any swf to gif converter give good quality ?

  15. #15
    SitePoint Enthusiast ck88's Avatar
    Join Date
    Jul 2008
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think it's best to use dedicated applications for the job in hand. i.e. create your graphics with a bitmap editor application such as PS and your animation with GIF animator such as GIF Movie Gear.
    ck
    Creative Kitten | Free Web Graphics, Icons and Photos

  16. #16
    SitePoint Member
    Join Date
    Jul 2008
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I design the graphics using Photoshop layered psd, then take it in image ready and animate it. I don't know more about other tools for gif animations but Image ready works very well for me, its very easy to learn and animate with it.

  17. #17
    SitePoint Member
    Join Date
    Jul 2008
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I simply do it from movies by using GeoVid.com VidGif.
    Try it...

  18. #18
    SitePoint Zealot Rexibit's Avatar
    Join Date
    Jul 2008
    Location
    United States
    Posts
    178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Photoshop has a very nice animation tool if you are designing animated banners that just move or fade in and out. It is a little quirky if you are wanting it to do some advanced stuff that Flash is known for.
    Rexibit Web Services
    Don't just build it - CSS it

  19. #19
    Community Advisor silver trophy

    Join Date
    Nov 2006
    Location
    UK
    Posts
    2,559
    Mentioned
    40 Post(s)
    Tagged
    1 Thread(s)
    I design banners in flash and then export as an image sequence. Then I open the image sequence in photoshop cs3 and save for web as a .gif.

    This way, you get the broader animation capabilities of flash with tweening, timelines etc
    but get the superior colour palette reduction and dithering capabilities of photoshop that make for better visual quality in the outputted gif.

  20. #20
    SitePoint Member
    Join Date
    Jul 2008
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To create a banner launch Bannershop GIF Animator and choose "Blank Document". Choose "Frame" > "Frame Size" to select banner size. You can use custom banner width and height or use one of the standard banner dimensions:

    Full Banner (486x60)
    Half Banner (234x60)
    Vertical Banner (120x240)
    Skyscraper (120x600)
    Wide Skyscraper (160x600)
    Button 1 (120x90)
    Button 2 (120x60)
    Square Button (125x125)
    Micro Button (88x13)
    Leaderboard Banner (728x90)
    Medium Rectangle Banner (300x250)
    Large Rectangle Banner(336x280)
    Square Banner (250x250)

  21. #21
    Floridiot joebert's Avatar
    Join Date
    Mar 2004
    Location
    Kenneth City, FL
    Posts
    823
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Varelse View Post
    Do people really use web-safe colours now?
    I think even most mobiles are advanced past websafe colors these days.

  22. #22
    SitePoint Zealot XandroZ's Avatar
    Join Date
    May 2006
    Posts
    147
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I make the animation in flash then export as multiple gif, then import in Image Ready like a folder with images and then apply create animation.

    The animation in 99 % is identical with the flash.

    The flash export gif animation option alter the quality of the image.

  23. #23
    SitePoint Member
    Join Date
    Jul 2008
    Location
    Oklahoma
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I use fireworks to make animated banners then wrap them up in JASC Animation Shop 3. Heres how I do it.
    "Bouncing Ball"
    1.) Start a standard banner (blank) 468x70with a white canvas in Fireworks?
    2.) Google a white ball and find an image you like then save it.
    3.) Import the ball into fireworks.
    4.) Place it somewhere within the banner and save that as jpg image 1 in a folder on your desktop called images.
    5.) Move the ball just a tad which ever way you want then save that as image 2 in the images folder and keep going on and on.
    6.) When you think you have enough content simply import the jpeg files into JASC Animation Shop 3 and save as animated movie. The quality is decent and its actually a ton of fun..IE: Replace ball with whatever for other projects...Katrina...

  24. #24
    SitePoint Enthusiast Rblakney's Avatar
    Join Date
    Jul 2008
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just to sound off, I do most of my gif animation in Photoshop and have no complaints.

  25. #25
    SitePoint Wizard rguy84's Avatar
    Join Date
    Sep 2005
    Location
    Durham, NC
    Posts
    1,659
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    I am not sure why all of you say use photoshop. Technically speaking PS is not meant to work this way, but whatever floats your boat. Fireworks has the ability to create animated gif.
    Ryan B | My Blog | Twitter


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •