Self Service: How to add animated icons

[davidhiggs]

Stumbled upon a way to use animated icons within the Self Service app - Simply use an animated PNG file (APNG format). Looks like support has been around since iOS 8 and OS X 10.10. Have not tested this in Self Service for iOS.

This seems pretty harmless and if you stick to the recommended 128x128 canvas size, you should be OK. Maybe JAMF can comment :D

Below is an example I put together, two frames looping. This will animate if you use Safari or Firefox but not Chrome.

[bpavlov]

How do you go about creating one easily?

[davidhiggs]

I used pixlr.com for my photoshop tool and http://littlesvr.ca/apng/assembler/assembler.php to create it the file.

Looks like the mac app store has a tool https://itunes.apple.com/us/app/png-animator/id899480442?mt=12

I shrunk one of the images slightly, then increased the canvas size back to 128 (using pixlir), then uploaded to that assembler site

[AVmcclint]

I've been able to add animated GIFs just fine.
That's a pic I've had in Self Service for Mac with no muss no fuss.

[scottb]

I use either PhotoShop or this app - 0.99¢ on the MAS. Not exactly a masterpiece, but it works.

GIF Animator

[cwaldrip]

HOLY CRAP! I never thought of this!

/must use this power judiciously and only for good...

[mm2270]

I wasn't going to comment on it originally, but part of me is concerned this is even a feature. While I can see some utility in being able to do this, hopefully most of us out there won't be bombarding our users with a bunch of flashing seizure inducing animated icons, and turning their Self Service into a 3-ring circus!

Then again its not really my business what anyone does with their Self Service. Carry on... : )

[cwaldrip]

I don't think it's a 'feature' as much as an unintended consequence. Self Service is basically an HTML application, so offering support for GIF and PNG also brings with it unintended support for animated GIFs and animated PNG.

[mm2270]

Good point on that.
Though it would be nice if Self Service.app actually supported all features of your average html application and not just some arbitrary subset. As much as it may be a "browser", many standard browser features don't work well with it.

[Emmert]

Does this work in the Slef Service iOS app?

[davidhiggs]

Personally i'd probably only use it for a single use, like my example and alerting the user to something. I agree @mm2270, we dont want Self Service looking like myspace :P

@Emmert haven't tested iOS, give it a go and report back!

[Emmert]

In iOS it just uses the first frame. Probably for the best.

[gskibum]

By random chance I grabbed an animated png from inside the Install OS X El Capitan.app. Didn't even know it until I saw it in Self Service.

I'd attach it here but it's so wild & spastic you'd all hate on me for attaching it. It's Coyote & Roadrunner spastic.

[johnnasset]

Funny, I tried to upload the regular png converted from the InstallAssistant.icns from the Installer app for El Cap and can only get the animated icon.

[gskibum]

It's a hateful icon for sure.

[gskibum]

For a couple of months now I've been unable to get any .png icons to NOT animate. Not sure what has changed.

GIF is working for me however.

If anyone hasn't already upvoted this, please do so if you agree with a Self Service icon management tool.
Manage Self Service/Policy Icons Feature Request

[mm2270]

@gskibum

For a couple of months now I've been unable to get any .png icons to NOT animate

.
I'm not sure I understand your comment. You can't get them to NOT animate? As in, they always animate? Huh?

[davidacland]

I had this on a recent jumpstart. For Self Service I'd always used the "copy the icon, create new from clipboard in preview, export as png", but last month, they were all coming out animated after the png export. Re-exporting the exported file worked ok.

I didn't spend much time worrying about it but I'm sure preview didn't used to do that.

[Brad_G]

@gskibum Actually one of my coworkers @PhilMaul ran across this. In short if I remember correctly, when you open the icon in preview, there is a pane on the left of multiple icon sizes (making the animated image you're seeing). Pull the 128x128 icon out and onto the desktop which creates a single sized .tiff file. Open that in Preview and export it as .png

[gskibum]

@Brad_G Thank you. That makes sense to pass it through as a TIFF first. Adds a bit of hassle though.

Wah-wah-wah.

[gskibum]

I missed @mm2270's and @davidacland's replies.

Yes like it nor not I've been getting nothing but animated icons in Self Service. When I open Self Service these animated icons draw me in and I stare at them like a deer in headlights. Takes me about 15 seconds to snap out of it and return to earth. :-)

So it looks like it's necessary to double-save to get this to stop.

[davidacland]

On my to do list is an Automator action that you can drop apps onto, and have it spit a self service png icon the other end. Unfortunately it's been on the to do list for around 4 years now :(

Anyone else already have something like that?

[mm2270]

There shouldn't be a need to copy it to the Desktop first. Just select the 128 version in Preview and press Command+A to select the entire image, copy, then choose New from clipboard and it creates a new file with just the one image in it. Save it and then upload it. Still extra work, but why clutter up your possibly already cluttered Desktop with more droppings.

I can see why now you were getting animated icons. If you pull the full png or icns file in its actually a list of multiple image sizes all stacked on top of one another, so it makes sense now that you'd be seeing it animate :)

[davidhiggs]

The behaviour changed with the Preview.app that shipped with El Capitan, so there is an extra step as @mm2270 mentions. This is how I made the discovery for this post!

[mm2270]

@davidacland Your post gave me a great idea about making an app or droplet like that. Since I tend not to do things in Automator too much though, I whipped something together in Platypus with a bash script. Its very basic right now (as in, if it runs into any errors, it just exits), but in testing it seems to work pretty well with almost any app I've thrown at it!

I posted it to my github page and called it "Self Service Icon Maker"

[AVmcclint]

@mm2270 you deserve an award for Self Service Icon Maker! That saves so much time!

[davidacland]

Thanks @mm2270 Just tried it, works great, real time saver :)

[roiegat]

I might be doing it different, but I never get animated PNG....here's my methodology.

1) Select app I want to have icon for and click "Get Info"
2) Click on the icon in the Get Info window and click copy
3) Open preview and it select new
4) Scroll down the left side and find the 128 x 128 version (usually number 6)
5) Right click on the icon in the sidepan and select "Export As"
6) For format change to PNG and then name it

Upload to Casper and your all good. This works for Yosemite and El Capitan. It gives you nice looking Self Service Icons.

[cwaldrip]

@roiegat That's exactly how I do it too. The only time I get animated PNGs is when I'm not paying attention and export the entire thing as a PNG.

I usually don't notice until i upload it. And since there's no icon management panel (feature request outstanding), then it's off to edit the database and pray. :-

@mm2270 You sir are awesome. But I think we all know that already. Any change on a 128 or 256 setting? The JSS will take any size, and 128 is the default. But I've heard suggestions to use 256 for future proofing.

[mm2270]

@cwaldrip You asked for it and you got it. I just uploaded a 1.1 version. Changes are detailed on the github page: https://github.com/mm2270/Self-Service-Icon-Maker

[mm2270]

FYI for anyone using the app I posted above, I just updated it to version 1.3. The main change in this version is that it can now accept multiple applications dropped on it at once, so you can in theory select and drag in every app in your Applications folder and create icons in 128 or 256, etc. png format for all of them in one operation!

[slundy]

Was the animated icon 'feature' removed from SS? Tried multiple APNG's and it doesn't seem to work anymore.

[diradmin]

@slundy Yes, the behavior of animated icons changed with the revamping of Self Service starting with Jamf Pro 10.x.

[slundy]

boo

[Ojok]

Interesting that one can animate app icons but cannot use an animated gif in the Self Service Banner image.