How to run Web Applications from your OS X desktop

Using the absolutely fantastic software Fluid, you can run any web application (Gmail, Facebook, Remember The Milk, Google Reader, Google Analytics – the list is endless) on its own – as its own application. The benefits of working this way are numerous – if one app crashes, it won’t bring them all down (ie. a regular browser). You can create shortcuts to the specific app/site in your Dock or Applications folder (or both). This brief tutorial, which could also be called “an introduction to Fluid” – will give you the rundown on using it, configuring and using its plugins and more.

  1. To get started, download and install Fluid. The installation is as simple as unzipping the file and dragging it to your Applications. Launch Fluid from there.
  2. fluid in the applications list
    click to enlarge

  3. From here you’ll be prompted to create your first Fluid app – which is almost painfully easy. Enter the URL of the site you want to create an app for. In this example I’ll use Gmail. So the address is https://mail.google.com/mail/

    The Name I’ve used is Gmail – but you can of course name it anything you want – Email, Mail, Google Mail etc. The Location refers to where you want the app to be created. The default, Applications is perfect.


  4. click to enlarge

  5. You can use the websites favicon as the Icon for your app, but before you do that, you may want to check out some of the fantastic work shared at http://www.flickr.com/groups/fluid_icons/pool/. In that Flickr pool you’ll find dozens of quality png files to use as icons. So I grabbed a Gmail icon from that pool, and that’s what I’ve opted to use. To change the default click the Icon pull-down menu and select Other…. Then navigate to the image you want to use and select it.

  6. click to enlarge

  7. Now that you’re done, click Create.

  8. click to enlarge

  9. A couple of seconds later you’ll be prompted with a Success! window. From here you can directly launch the app by clicking Launch Now or you can click Reveal in Finder.

  10. click to enlarge

  11. And there’s your new Fluid app – Gmail.app – in Finder. Double-click it to launch Gmail.

  12. click to enlarge

  13. There’s Gmail!

  14. click to enlarge

  15. If you right-click (ctrl-click for single button mouse folks) anywhere in the background, you’ll be presented with the a few options – Back being the one that comes in handy most often.
  16. right click in a fluid app

  17. With Gmail – you get an added extra bonus of having the icon display your new unread emails via the Dock icon.
  18. fluid gmail dock icon

  19. And as with all (almost all) OS X apps, you can right-click (ctrl-click) the Dock icon and select Keep in Dock if you’d like to have it handy all the time.
  20. keep gmail fluid app in the dock

  21. Fluid comes with a couple of plugins enabled by default. They are Clipboard and Thumbnail – both of which are incredibly handy.

    When you have a Fluid app up and running, select the Plugin menu bar item (it’s the one that looks like a piece of Lego – see the screenshot below).

    With Clipboard Plug-in selected a side window will appear. You can drag and drop pictures, URLs and selected text into this clipboard for re-use/temporary saving.

  22. fluid with the clipboard enabled and the plugins menu displayed

  23. If you select the Thumbnail Plug-in you’ll be presented with a very cool “Cover Flow” view of all the links on the page you’re currently viewing in your Fluid app.
  24. fluids cover flow view
    click to enlarge

  25. If you select the Thumbnail button from the bottom left corner, the view will switch from Cover Flow to Thumbnails.
  26. fluid iphoto thumbnail view
    click to enlarge

  27. Another outstanding feature of Fluid is that Greasekit is built in – so any of your favorite Greasemonkey scripts for Gmail etc should work just fine (my favorite, Folders4Gmail+Folders2Top works perfectly.
  28. access greasemonkey scripts in fluid

  29. For more info on Fluid, and to view some screencasts of it in action, check out the Fluid Community.