I love gmail, but it can be a bit of a pain at times since it is trapped inside of a browser tab, especially if you are using multiple gmail accounts simultaneously. Google has worked hard to improve the experience (Chrome, Safari, and Firefox now support desktop notifications, and you can run different gmail accounts in different tabs), but it still fell short of what I wanted.

One problem with having gmail as a tab in a browser is that it is very challenging to switch back and forth between gmail and another app. I often need to jump back and forth a few times between what I was working on and gmail as I compose the message. I can use command-tab to do the switching, but when I go to Chrome, it takes me to whatever browser tab I was looking at most recently, not necessarily gmail.

Even worse, if the app I am switching back and forth between is Chrome itself, I’m stuck. Command-tab only switches between applications. I can use command-tilde to switch between browser windows, but if gmail is just a tab within the same window, it’s a real pain. I have to keep looking at what tab I’m on and what tab I need to get back to and think about where I need to click. It breaks my train of thought and prevents me from using muscle memory.

I could solve that by using two browsers (e.g. Safari for gmail and Chrome for my regular web browsing), but it still doesn’t take me all the way there. I want a badge icon that shows me how many unread messages gmail has so that I know I have a message that I need to respond to in case I miss the desktop notification.

I spent sometime looking at dedicated mail apps. My first stop was Apple’s built-in mail application. However, I quickly found that it didn’t work very well with gmail in Mavericks. It kept trying to synchronize drafts and sent mail folders as I was writing messages, incorrectly marking items as unread. I then looked at other apps like Postbox, but I just couldn’t reconcile myself with the interfaces. They handled marking messages read or unread a bit differently, or I found the UI for reading threads confusing.

Really what I wanted was gmail itself. Google already had a UI that I liked. I just wanted it in its own app. I have used a tool called CreateCgApp to give Chrome pages their own apps before, but it lacked a few key features. It had no ability to give a badge icon based on the number of unread messages (this was key for me), and ever since updating to Mavericks, it didn’t work quite right. OS X would sometimes get confused between the apps and Chrome itself, and upload file selection dialog was sometimes off screen.

Perhaps someone else had solved this problem? After searching around for a bit, I found the answer was yes! There is an app called Fluid that is built on the same principle as CreateCgApp, except it uses Safari as the base browser. It adds several key scripting features that allow it to perform special tricks like a badge icon. When browsing in Gmail, it looks inside the page for the unread message count and updates the badge icon accordingly. While the app defaults to using the website’s favicon, you can also provide your own.

Fluid finds the unread message count inside the gmail page and updates the dock badge accordingly.

There is a free version of Fluid that will give you the basic app, but paying $5 gives you a few key features. First, it activates the scripting module necessary for the badge icon to function. Second, it allows each Fluid app to have its own set of cookies, separate from Safari. This is important if you want to run multiple Fluid apps for different gmail accounts.

The last thing you need to do to tie it together is turn on desktop notifications in gmail’s settings. Once you do this, new message notifications will pop up in notification center.

New mail notifications pop up in the OS X notification center, using whatever icon you have selected for the app.

Since I use two gmail accounts simultaneously, I have created two versions of the Fluid app for gmail. To keep them straight, I gave my personal account the classic “Red” gmail icon, but I created a “Blue” version for my work related account. Notifications are smart enough to show the right icon for each version, so I can quickly see what account a new message is associated with. If you would like to use my icons, you can download them using these links: red and blue. The red one I downloaded straight off the web, and then I modified it in Gimp to create the blue one.

The system works great, but I did run into one strange issue. For some reason, my gmail app would get stuck into some bug that would cause them to keep logging out. It would log in fine, but then when I started a new message, it would take me back to the login screen. It seemed to be associated with creating another Fluid app, but I’m not sure why. I’ve found that deleting the app and recreating it makes this problem go away.