Day 10: Mac Web Designer Apps June 10, 2010

These days I’m using a Mac Pro for all my work, and I returned the borrowed MacBook Pro to my friends at MARS media. Since the owner will now be switching from a PC to a Mac, I thought I’d make a mega-review and explain what software I recommend and use daily.

This is blog post 10/30 for #30daysofcreativity.

Scrivener

First of all, I don’t like using the word “web design” but it does generalize what we do pretty well. I would actually say I do web production or web development, as I rarely do any actual “design”. Anyway, this is my list of web-industry-related software.

Since choice is good, I will also mention alternatives to what I’m personally using, including free open-source software.

Web browsers

You already know this. I use Google Chrome for everyday things—it’s simply superior when it comes to convenience and speed. The dev version is pretty stable right now so that’s what I use. For web development, I mostly use Firefox since it has in my opinion better versions of the Firebug and Web Developer Toolbar plugins, but you can’t compare the speed with Chrome.

Graphic Design

Adobe CS5 is something that most of us use every day. Contrary to what some people think, while it may be considered the industry standard, it’s definitely not a must have. I wouldn’t personally replace it but there are a few alternatives for those who want to.

Gimp is a well-known free alternative to Photoshop, Inkscape is a free vector graphics tool like Illustrator, and Xara Xtreme is available for Linux but is planned for Mac as well. Pixelmator is a cheap alternative to Fireworks/Photoshop which is pretty cool. RapidWeaver is available as a free download.

Of course, you can also have a look at the online version of Photoshop.

Mock-up

There’s quite a lot of applications for mocking up your websites. If you want to use Adobe products, you can have a look at either Illustrator or Fireworks; the latter is specifically designed for prototyping.

OmniGroup is one of my favorite companies since they do excellent software—their OmniGraffle is affordable, simple to use and very nice for prototyping and wire-framing. And it’s even available for iPad. Balsamiq is another popular one, and so is Axure.

However, I’ve personally lately moved towards using online tools for wire-framing. Mockingbird is one of my favorite web apps, it’s free and built on the Cappuccino Javascript application framework, no Flash. MockFlow has a lot of features but you’ll have to pay if you want to have more than one mock-up with four pages.

If you can live with less interactivity, you can also create a wire-frame in a Google Docs Drawing.

More:
Speckyboy.com

RSS readers

When it comes to RSS readers, there’s a lot of cool alternatives to choose from. I’m using the good old NetNewsWire since it synchronizes with Google Reader and there’s a free iPhone application as well, which means I can access my feeds from anywhere. You can of course use the Google Reader web interface but I like this native app better.

Examples of a bit cooler looking applications are NewsFire (free), Times ($30), NewsLife ($10) and Vienna (free), however they don’t sync with Google Reader. Fluid can be used to add Google Reader to your dock if you like the web interface.

Gruml is another one using Google Reader. If you want an all-in-one application that both synchronizes with Google Reader and gives you access to Twitter, Facebook, Flickr and Digg, then Socialite is for you. If you don’t want to download a new app, take a look at Apple Mail—it can do RSS.

As mentioned, my choice is NetNewsWire. I just want to be able to read and sync feeds with my iPhone, that’s all.

More:
Smokingapples.com
About.com

BitTorrent

There are two major BitTorrent clients I’ve used. The first one is Transmission which has a nice and simple interface but it started to take a lot of CPU power. So I switched to uTorrent and haven’t looked back since.

uTorrent is lightweight, also has a nice interface, and does the job well. An important feature is that you can select which individual files you want to download and give them different priorities.

Organizing

Everything that has a fixed time and date goes into iCal which in turn gets synced immediately to my iPhone via MobileMe. It’s all incredibly convenient though somewhat pricey. You can try out a 2-month trial for free when signing up and see if you agree.

For the rest of the todo items, I use another OmniGroup application, the GTD software OmniFocus. Again, it syncs with MobileMe to my iPhone where I have the same app installed. This one costs some money but it’s definitely worth it if you want an efficient GTD system for your tasks.

Other popular alternatives include the GTP apps Things (€49.95), SimpleTask (free) and The Hit List (€49.95 pre-order), TaskPaper ($24.99) and Codo (free) among others. There are nice online apps as well, such as TeuxDeux, and TadaList from 37signals.

More:
Appstorm.net

Code editing

For me, there’s only one code editing software worth using and that’s TextMate. I’ve been using it for years now and it’s “the one”. It’s got loads of bundles such as HTML, PHP and CSS, which makes coding a lot faster. I use it for all code editing I do, with the dark Blackboard theme, disabled anti-aliasing, and the font Monaco in 12pt. Very nice.

But let’s pretend TextMate doesn’t exist. If that was the case and you’d like a more visual app, you could use Coda by Panic or Espresso by MacRabbi. As for free apps, Aptana Studio 2 is a feature-filled development environment, and Komodo Edit. If you want a more lightweight solution, there’s TextWrangler. Or why not Emacs?

REXML could not parse this XML/HTML: 
<p><strong>More:</strong><br />
<a href="http://webdesign.about.com/od/macintoshhtmleditors/tp/free-macintosh-editors.htm">About.com<br />
<a href="http://www.smashingmagazine.com/2008/05/07/35-useful-source-code-editors-reviewed/">SmashingMagazine.com</a></p>

Blogging

What am I writing this blog post in? It’s certainly not WordPress. To stay clear on distractions while typing, I’m doing it in Scrivener which has a beautiful and customizable full-screen mode that I highly recommend. I’m using a slightly transparent dark background, a suitable document width, and a nice sans-serif font called Sabon.

A popular and slightly cheaper application that isn’t as beautiful but still has a nice full-screen mode is WriteRoom.

Documents

For documents in general I tend to use Google Docs since it makes sharing very simple, and the documents can be accessed from anywhere. Google Docs is highly capable both for documents, spreadsheets, forms and other kind of documents, not to mention collaborative writing.

If I want to perfect a more visually appealing document, I’d use Apple Pages since it’s so much more enjoyable than Microsoft Word. If I’m really picky, I’ll go with Adobe InDesign.

But Google Docs does 95% of what I need so there’s rarely a need to fire up a native application for document writing.

Screenshots & screen recording

Skitch is another app that I use daily and can’t imagine being without. It’s hugely convenient to be able to either take a full-screen snapshot, snapshot of a window, or drag my own area.

What’s really valuable however is the quick and simple editor where I can use my Wacom Intous tablet to sketch and write on my screenshots. Once it’s done, I just click on “Webpost” and it’s uploaded to Skitch.com and I’m given a URL for sharing. It’s fantastically simple.

Another app that is very simple is ScreenFlow for screen recording. I’ve used it to make many screencasts for my clients and it works great every time. Editing is a bliss.

Instant Messaging

I’ve gone from using the Live Messenger network to almost exclusively using Skype these days. Voice and video calling works better and there’s an official app for both Mac and iPhone. Nowadays you can even call Skype-to-Skype calls using your iPhone—it actually works quite nicely.

For those occasions when I do use Live Messenger, I would never use Microsoft’s application. It just doesn’t look right. Instead, I’m using Adium with a nice minimalistic theme and that’s what I recommend to anyone who needs MSN/Live Messenger on a Mac.

Take a look at the Adium Extras website and you’ll find loads of skins for both the message window and contact list.

Twitter

We mustn’t forget Twitter. A while back, I was using Tweetie for Mac which is an excellent application. However, I’ve found another one that’s even better and it’s called Nambu. It’s a native application, it’s very fast and the interface is awesome.

What I like most about it is how it can resolve short URLs and display the real domain in the tweets, and how it quickly and automatically generates short URLs for your own pasted links. It’s got two great view modes. Nothing beats Nambu.

If you want to try something else then TweetDeck is quite popular. It’s feature-filled and has a multi-column layout which you might appreciate if you get a lot of tweets.

There are loads of Twitter apps for Mac. To name just a few, there’s Bluebird, Kiwi, Twitterrific and the previously mentioned Adium and Socialite.

More:
Twistermc.com
Mashable.com
Appstorm.net

FTP & MySQL

We haven’t mentioned FTP yet. There’s essentially two applications I would recommend using. First of all, the best one I’ve come across is Transmit 4. Very simple to use and very nice interface.

Second, if you want to download a free version I’d suggest going with CyberDuck. It’s not as good as Transmit but it sure works.

For connecting to your MySQL databases, the one application to use is Sequel Pro. Try it out, you’ll like it.

Web server

You’ve probably heard of MAMP by now—the Apache, MySQL and PHP stack for Mac. Setting it up manually isn’t what I would like to spend the weekend on so MAMP is a great tool for quickly getting a local testing environment up and running. And it’s free!

Subversion

Version control is an important aspect of web development. If you like me use Subversion to do this, then Versions by the Dutch company Sofa is what you want. It’s very simple to use and I love the interface. While it costs a few euros, it’s definitely worth the price.

Productivity

The last category I’ll mention is productivity. The Mac itself is great for productivity but there’s a few apps you should definitely take a look at. The first one, something I use hundreds of times every day, is Quicksilver.

Quicksilver is an application launcher, but it’s also so much more. You can use it to do a Google search, open URL’s, run shell commands, send things to OmniFocus, and much else. I suggest you Google for some nice video tutorials to see it in action.

WorkSaver is a life-saving application you should install if you use Apple iWorks. It takes care of auto-saving your Pages, Numbers and Keynote documents while you’re editing them. I had to find out the hard way how useful this actually is, so I suggest you install it proactively!

The last app for today is TextExpander and it’ll make your life a lot easier. You know those text snippets that you use a lot? Set them up in TextExpander and you’ll never have to type them again.

It’s especially useful for developers. For example, ’ve whenever I type “html_4” anywhere, it automatically spits out a complete HTML 4.01 template. If I type “ci_controller”, it gives me a basic CodeIgniter controller class.

Conclusion

As you can see, there are lots and lots of great applications that can be used by web designers and developers, or anyone else for that matter. I could write non-stop for another hour at least but I’ll stop here.

Part of this is of course about personal preference but some apps ultimately work better than others. If you wonder anything about Mac software, just let me know and I’ll help you out!