6 Beautiful Fluid Mac Icons
There's no denying that the Internet is going to be a big part of our future of computing. Running applications in the cloud have already become popular, with services such as Google Apps, which we also offer to our clients. Whether you use Google Mail and Google Calendar to help to manage productivity, or social lifestyling apps like Twitter and Facebook, there's probably a web-based application or two running on your computer throughout the day.
If you use web-based applications on Windows, Google Chrome allows you to create app shortcuts to your computer for easy access. For Mac users, an application called Fluid is available for creating desktop aliases of web applications.
As a Mac user, one problem you may quickly encounter is that the app's Favicon (the small icon that appears in the address bar) becomes the alias desktop icon. For Mac users using Mac OS X Leopard, icons can go right up to 512x512 pixels in size. 16x16 Favicons suddenly get mighty pixelly.
As a solution I've created six beautiful icons for you all to use free of charge. I'm also posting some helpful URLs to help you on your way with building them. Download the beautiful icons now and they should be ready for you when you need them further down in the article.
Getting the apps up and running
First download Fluid. Unpack the app and either pop it into your Applications folder for later use, or leave it on your desktop for removal after this process is complete.
Open the app and enter the URL and name of the alias you would like to make. I'm going to give you the aliases for use with the icons that I have created for you. You can make your own aliases for any web app. I'll show you how to apply the icons after this step.
GMail
A popular one, no doubt. To get GMail on your desktop, enter http://mail.google.com as your Fluid URL, and name it "GMail" or "Google Mail". For Google Apps users, enter https://mail.google.com/a/YOURDOMAIN.COM/ as the URL, and name it the same, maybe with the domain name at the start. (E.g. I use "FC Google Mail".)
Google Docs
For Google Docs, enter http://docs.google.com as the Fluid URL. For Google Apps users, https://docs.google.com/a/YOURDOMAIN.COM/. Name it "Google Docs" or something specific to your domain (E.g. I use "FC Google Docs".)
Google Calendar
For Google Calendar, enter http://calendar.google.com as the Fluid URL. For Google Apps users, https://calendar.google.com/a/YOURDOMAIN.COM/. Name it "Google Calendar" or something specific to your domain (E.g. I use "FC Google Calendar".)
Google Tasks
Google Tasks is a new service, and doesn't really run on its own. It opens with either Google Mail or Google Calendar, and once one of those windows close so does Tasks. Here's how to get around that. Enter https://mail.google.com/tasks/iphone as the Fluid URL. For Google Apps users, enter https://mail.google.com/tasks/a/YOURDOMAIN.COM/iphone. Name it "Google Tasks", or something specific to your domain (E.g. I use "FC Google Tasks".) Once entered and created, open up the new app and go to the app's title contextual (top left corner, next to the Apple) and go to User Agent/Other. A little window will pop up. In it, paste the following:
Mozilla/5.0 (iPhone; U; CPU iPhone OS 2_2_1 like Mac OS X; en-us) AppleWebKit/525.18.1 (KHTML, like Gecko) Version/3.1.1 Mobile/5H11 Safari/525.20
Close that, and use Cmd+Shift+H to refresh the app. It should, now, display Google Tasks on your desktop, properly and independently.
Google Talk
Google Talk operates in a similar way to Google Tasks, in that it runs from within Google Mail. In order to get it running as an app, enter the Fluid URL https://hostedtalkgadget.google.com/talkgadget/popout. For Google Apps users, enter https://hostedtalkgadget.google.com/a/YOURDOMAIN.COM/talkgadget/popout instead. Name the app "Google Talk", or something specific to your domain (E.g. I use "FC Google Talk".)
Freshbooks
Finally, a Freshbooks app. We're big fans of Freshbooks and encourage you to go and check it out if you do any invoicing. Enter https://YOURACCOUNT.freshbooks.com/ as the Fluid URL, and name the app "Freshbooks".
Now that you have your apps up and running, it's time to make their dock icons pretty. The download should have finished by now, so open that up and you should find six .rsrc files. I'm going to run you through the Google Docs one as an example. Select the Gdocs-Icon.rsrc file from the Finder and hit Cmd+I to bring up a "Get Info" window. Do the same for your new Google Docs app. You should now have two Get Info windows up on your screen. Up in the top left-hand corner of each of these windows, there should be a small icon next to the file title. Click on the one in the icon's Get Info panel. Cmd+C will actually copy that thumbnail to your clipboard. Select the small icon in the Google Docs Get Info window, then Cmd+V to paste it into place.
Voila! Our beautiful icon has now become the dock icon of your shiny new Google Docs app.
This process can be repeated for the rest of the apps, with each icon corresponding to each app respectively.
And that's it! I hope you enjoy the icons, and your new desktop apps. If there's any more icons you'd like to see in the future, feel free to share.








Comments
I love these icons. They all look great in the dock when using Fluid. It appears that the zip file only has 5 of them though and is missing the Google Talk icon. :-( Would love to have that one to complete the set. Am I missing something or can you include that one as well? Thanks for letting everyone else use these.
Gosh, you're right! Apologies for not noticing sooner. The .zip now includes the Google Talk icon!
Great Blog, love the icons! Thanks again!
Brilliant absolutely.Nice collection of beautiful cvreated icons.
Just discovered Fluid & then found this page. Great icons and instructions (I was just about to look up the user agent foo for the iPhone...). Thanks! {And to echo a previous poster, the GTalk icon is not in the archive...}
Streamlined instructions: drag the .rsrc file directly onto the application's icon in the Get Info window.
for the more mac-savvy, this one-liner will save one heck of a lot of reading! Thanks for the comment, Emery
Icon added, apologies for the delay! :)
thank you so much for this: it'll be one of my fun projects for this weekend!
Great! Let us know what you come up with :)
love the icons, but I don't use fluid. Do you have png versions of them you could share?
Great idea! I certainly have them; I might release them as separate files in a new post soon :)
what an amazing tool! perfect! looks amazing and looks great. THANK YOU!
You're welcome matey! :)
Your web page is without a doubt full of very good facts and also is incredibly enjoyable to read through.
Well carried out!
Excuse me. It is not enough to do good; one must do it the right way. Help me! Could you help me find sites on the: Paxil, or is he properly discipline antidepressants that include you possible?. I found only this - [URL=http://www.sgi-d.org/Members/Paxil]generic paxil[/URL]. I appear now to cause at those, paxil. Often, his exposure of how often of liver has patented out to mechanical neurologist is particularly positive, paxil. Thanks :mad:. Hilda from Sweden.
Reply with a Comment…