What programs do you use to make animated buttons?

Talk about your website ideas, web design, coding, software and hardware.
Post Reply
User avatar
OneMillionFurries
Newbie
Reactions:
Posts: 20
Joined: Tue Jan 10, 2023 4:07 am
Pronouns: he/him
Website: https://onemillionfurries.com/

What programs do you use to make animated buttons?

Post by OneMillionFurries »

I still need to make a button for my site but I really do not know how to even start on it. I really like the animated ones but I'm unsure of what programs people tend to use to make them. I also don't know if people do everything frame-by-frame or if any gif program where things feel more like a video editor? if that makes literally any sense???

Yeah i feel like it's pretty obvious that I really don't know what I'm talking about lmao. Any help at all would be greatly appreciated!
Image
vivi
Netizen
Reactions:
Posts: 30
Joined: Wed Jan 11, 2023 10:48 pm
Pronouns: she|they
Website: https://mincerafter42.github.io

Re: What programs do you use to make animated buttons?

Post by vivi »

I use the Gnu Image Manipulation Program to make animated GIFs. Each layer is a frame and you can individually control how long each frame is shown via editing the layer's name. Does not currently support animated PNGs as far as I know. (also doesn't support some of the deep intricacies of the GIF format, but i may be the only one here who cares about the deep intricacies of the GIF format)
User avatar
Starfighter
Webmaster
Reactions:
Posts: 153
Joined: Tue Jan 10, 2023 9:36 am
Website: https://starfighter.neocities.org/

Re: What programs do you use to make animated buttons?

Post by Starfighter »

Oh, I had no idea GIMP was able to do animated gifs. Neat! That's a program well worth learning if one doesn't want to pay up for Affinity Photo (which is, in my mind, the only reasonable alternative to Photoshop).

Aseprite is outstanding, especially for pixel art gifs! It's not free though, and I have no real insight on the free alternatives as I went with Aseprite years ago. :D

If you have lil' video clips that you want to convert into gifs there's plenty of sites (Ezgif, Convertico, CloudConvert etc) that does exactly that.
Image
User avatar
Gr33nIMP57uckInC0MP
Newbie
Reactions:
Posts: 9
Joined: Mon Jan 09, 2023 11:46 pm
Pronouns: she/her
Website: https://queenofarms.neocities.org

Re: What programs do you use to make animated buttons?

Post by Gr33nIMP57uckInC0MP »

Starfighter wrote: Sat Jan 21, 2023 10:06 am Aseprite is outstanding, especially for pixel art gifs! It's not free though, and I have no real insight on the free alternatives as I went with Aseprite years ago. :D
Also if you don't have the money for Aseprite you can always go for:
  • Libresprite (A free opensource alternative to yes, Aseprite.)
  • GraphicsGale (A pixel animation software that's been freeware since 2017! Warning the learning curve is pretty rough.)
  • FireAlpaca (Is a free art program that while is specifically for illustration and comics, has aliasing options and a basic animation feature.)
  • Krita (Another free art program that has an animation feature. Though I haven't used the animation feature in a long time so idk if it's still any good.)
Edit: I forgot to mention but for me so far I used Aseprite.
Last edited by Gr33nIMP57uckInC0MP on Tue Jan 24, 2023 1:42 am, edited 1 time in total.
Oh look it's some turtles with my butto- HEY WAIT GET BACK HERE!

🐢🐢 Image 🐢🐢
User avatar
rina
Websurfer
Reactions:
Posts: 59
Joined: Sun Jan 22, 2023 9:25 pm
Pronouns: she/her
Website: https://doll.im/

Re: What programs do you use to make animated buttons?

Post by rina »

i use photopea, u make a file 10x larger 880x310. every layer is a frame. you need to name them as _a_001, _a_002, _a_003, and so on.. on export you just save it as a gif and when it ask you which size then you put 88x31. its very hard to do anything on image that small natively, so donwscaling makes it easier
User avatar
juette
Webmaster
Reactions:
Posts: 141
Joined: Tue May 10, 2022 3:30 pm
Pronouns: it/he/they
Website: https://mothcore.neocities.org/

Re: What programs do you use to make animated buttons?

Post by juette »

i use my usual art program (paint tool sai 2) and just make each frame then put it in ezgif. it's enough for what i'm making
Image
User avatar
Mosh
Newbie
Reactions:
Posts: 2
Joined: Sat Jan 28, 2023 12:55 am
Website: https://holeintheweb.neocities.org

Re: What programs do you use to make animated buttons?

Post by Mosh »

I personally use GIMP, but I will be the first to admit that it is not fun. GIMP is not a very good tool for creating gifs. You have to create each frame manually, and then put them into one gimp file and export them as a gif.
Image
User avatar
DaGrandDragonn
Websurfer
Reactions:
Posts: 66
Joined: Wed May 11, 2022 12:18 pm
Pronouns: Who, Me?
Website: https://dagranddragonn.neocities.org/

Re: What programs do you use to make animated buttons?

Post by DaGrandDragonn »

Unlike the rest of the replies on this thread, which I am pretty sure all require a computer of some sort, I personally use an Apple iPad for all my gif making needs.
I’ve made plenty, and if you’d like a explanation or tutorial for parts of the process I’d be happy to help you.



I use a program smoothie of

Procreate
Ibis Paint X
Rough Animator
Toon Squid
MediBang Paint
And the website named EZgif.




I really only use Procreate for the express purpose of gif creation now, though. Using it’s “animation assist” you can make animation frame by frame, or tween by hand if you’re a sucker, and export as GIF. It’s way of operation is confusing at first, but after a while you’ll wrap your head around the layers and such (groups are your friend!)

My newest program, ToonSquid, has a gif option and is like a mini adobe flash. Better if you’re tweening large parts of your gif. Previously I used RoughAnimator for tweening but it’s really not worth it for that purpose. It’s definitely overshadowed now.

Both of these are paid and cost about $30AUD for both, but is well worth the money, imo.

If you cannot afford or for some reason you cannot get these programs, you can do the poor man’s way of using either IbisPaint X or Medibang Paint, pick your poison, and stitch your frames together manually with EZgif. I have done this, and I do not recommend it. Maybe if you just want one gif, but if you want to make a selection, please just pay for some decent tools, lol. If you could only choose one, just get Procreate.

Procreate doesn’t come with a pixel brush, so if you’re making gifs with that I can send some over :J



So, as a recap: For iOS, Procreate good. ToonSquid also good.



Attached are some examples (most are really poor, though. I really haven’t been making many gifs lately, huh. I have more “old-school” looking gifs and blinkies, can’t find em. Sorry mate)

Ummmmm I forgor how to attach one sec
I think the uploads are disabled but here comes discord embeds to the rescue!
ImageImageImageImageImageImageImageImage
Image
User avatar
GaryStu
Websurfer
Reactions:
Posts: 94
Joined: Sat Sep 24, 2022 8:13 am
Pronouns: he/him
Website: https://garystu.art

Re: What programs do you use to make animated buttons?

Post by GaryStu »

Photoshop is really good for animations. Add the timeline to your workspace, and then off you go! It's really an all-in-one. You can import your images, arrange them, do any photomanipulation, preview them, and export the finished GIF all in one program. Like, getting the live previews is really useful. You also get a lot of options for exporting, the "save for web" interface is so customizable. It's also probably got the most tutorials of any program out there.

Of course I suggest you 🏴‍☠️🏴‍☠️🏴‍☠️ photoshop. You can get one thats like a decade old even and it'll be the same in terms of animation features, you don't need a new version.

It feels weird to enthusiastically recommend photoshop, but I sadly haven't seen an equal in terms of making graphics and GIFs. And as I said in the last paragraph, these features are old, its really sad there's yet no equal.

I would second Aesprite and EZGif.
All my social links are on the home page of my website, just above the webrings.

Image Image

Image
User avatar
BeeMilk
Newbie
Reactions:
Posts: 9
Joined: Fri Jan 13, 2023 2:53 pm
Pronouns: They/them
Website: https://bucket-of-bee-milk.neocities.org/

Re: What programs do you use to make animated buttons?

Post by BeeMilk »

vivi wrote: Fri Jan 20, 2023 11:55 pm I use the Gnu Image Manipulation Program to make animated GIFs. Each layer is a frame and you can individually control how long each frame is shown via editing the layer's name. Does not currently support animated PNGs as far as I know. (also doesn't support some of the deep intricacies of the GIF format, but i may be the only one here who cares about the deep intricacies of the GIF format)
I just recently got into digital art and am using gimp. How do you use it to make GIFs?
Image
vivi
Netizen
Reactions:
Posts: 30
Joined: Wed Jan 11, 2023 10:48 pm
Pronouns: she|they
Website: https://mincerafter42.github.io

Re: What programs do you use to make animated buttons?

Post by vivi »

BeeMilk wrote: Sat Feb 04, 2023 6:51 pm I just recently got into digital art and am using gimp. How do you use it to make GIFs?
Each layer is a frame. The bottom layer is the first frame and the top layer is the last frame. At the simplest level, when you choose to export your image in the GIF format, you can select "as animation" in the export settings dialog which opens, and choose the length of time every frame lasts, whether the animation loops, whether the frames are overlaid on the previous ones. At a more advanced level, you can control the length and disposal method of individual frames, by putting a time (like "(1000ms)") or a disposal method "(combine)" or "(replace)" in the name of the layer.

(edit) OH ALSO: when you have your layers set up in the right order, running Filters→Animation→Optimize (for GIF) will try to optimize your layers such that the exported GIF will have a smaller file size.
Last edited by vivi on Wed Feb 08, 2023 7:39 pm, edited 1 time in total.
User avatar
BeeMilk
Newbie
Reactions:
Posts: 9
Joined: Fri Jan 13, 2023 2:53 pm
Pronouns: They/them
Website: https://bucket-of-bee-milk.neocities.org/

Re: What programs do you use to make animated buttons?

Post by BeeMilk »

vivi wrote: Mon Feb 06, 2023 3:33 am
BeeMilk wrote: Sat Feb 04, 2023 6:51 pm I just recently got into digital art and am using gimp. How do you use it to make GIFs?
Each layer is a frame. The bottom layer is the first frame and the top layer is the last frame. At the simplest level, when you choose to export your image in the GIF format, you can select "as animation" in the export settings dialog which opens, and choose the length of time every frame lasts, whether the animation loops, whether the frames are overlaid on the previous ones. At a more advanced level, you can control the length and disposal method of individual frames, by putting a time (like "(1000ms)") or a disposal method "(combine)" or "(replace)" in the name of the layer.
Thank you! I kept looking at tutorials and getting lost but that made it click for me. Just made my first Blinkie

Image
Image
User avatar
Starfighter
Webmaster
Reactions:
Posts: 153
Joined: Tue Jan 10, 2023 9:36 am
Website: https://starfighter.neocities.org/

Re: What programs do you use to make animated buttons?

Post by Starfighter »

Gr33nIMP57uckInC0MP wrote: Sat Jan 21, 2023 7:23 pm Also if you don't have the money for Aseprite you can always go for:
  • Libresprite (A free opensource alternative to yes, Aseprite.)
This is such a valuable suggestion! I didn't know about the whole Aseprite/Libresprite thing before now and I think I would've gone the Libre route if I knew about this back then but oh well, I've paid for Aseprite in the past and that's that. :) Anyway, learning Aseprite/Libresprite is absolutely the best thing I've done on the topic of pixel art. I know there's a million ways to go about it, even in-browser solutions, but getting familiar with Aseprite has been incredibly rewarding for me and my creative work. If you're looking for a piece of software to be your main tool, your right hand, your go to solution for all things pixel based creativity, I personally believe Ase/Libresprite is as good as it gets. (If it's missing some vital functions then please point them out to me as I'm not blindly set in my ways. :))
Image
User avatar
Arevakhach
Netizen
Reactions:
Posts: 30
Joined: Tue Jan 24, 2023 4:27 pm
Website: https://foreverliketh.is/

Re: What programs do you use to make animated buttons?

Post by Arevakhach »

Starfighter wrote: Sat Jan 21, 2023 10:06 am Aseprite is outstanding, especially for pixel art gifs! It's not free though, and I have no real insight on the free alternatives as I went with Aseprite years ago. :D
Thanks to your recommendation, I managed to make these:

Image

Image

For the 88x31: I also used free pixel art provided here: https://admurin.itch.io/

For the 240x60: I also used a free png from here: https://www.pngwing.com/
Image
User avatar
Starfighter
Webmaster
Reactions:
Posts: 153
Joined: Tue Jan 10, 2023 9:36 am
Website: https://starfighter.neocities.org/

Re: What programs do you use to make animated buttons?

Post by Starfighter »

Arevakhach wrote: Fri Feb 17, 2023 5:50 amThanks to your recommendation, I managed to make these
Nice! Welcome to the Aseprite gang! :)
Image
Post Reply