Essential Apps for Professional Designers and Developers

If you’re new to freelancing or web design/development, then chances are you’ll be picking up applications left and right to accomplish all sorts of tasks. With all the applications available, it can be quite overwhelming to pick and choose the best ones to fit your needs. Often times there is no clear winner, applications can and will be equal, it just depends on what suits you best.

With that being said, here’s the applications I use on a regular basis to get my work done. Hopefully this list can help some of you starting out or even some of you pros.

Design and Graphics

Adobe Photoshop

This one is pretty much a given. Just about everyone uses Photoshop for one reason or another. It’s a staple of my graphic design diet. If you’ve never used Photoshop before then do yourself a favor and check out some tutorials over at psd.tutsplus.com

Adobe Photoshop

Primarily I use photoshop for designing web templates and slicing them up to create a functional product. On a smaller level I use it for everything from editing screenshots (like this one) to editing photos for people or even just tinkering around when I’m bored. Needless to say, a solid graphics editing application is a must for designers and the like.

Adobe Photoshop

Adobe Fireworks

Another application many web designers use is Fireworks since it was built primarily for web work. I’m not a big user of Fireworks but it does come in handy occasionally and supports PNG8 Alpha Transparency (Photoshop doesn’t). I’d say Alpha Transparency for PNG8 is just about the only reason I keep Fireworks around but in the future I’d like to start using it more for web template designs.

If you would like to learn more about Alpha Transparency in PNG8 images (which is supported in IE6 without hacks/plugins) you should read “Image Types and Usage in Web Design“.

Adobe Fireworks

xScope

This is one application that comes in very handy quite often and has tons of great features. xScope uses hotkeys to make working easier and more efficient. Here are the three features I use most but there are many more useful features included.

This is the ruler which comes in very handy when you need to find a quick pixel perfect measurement of something onscreen. This feature was actually the main reason I bought the application. Both ruler axis can be resized quickly.

xScope Ruler

This feature is called dimensions and it basically automatically measures the space between two points (whatever is on your screen) on the x-axis and the y-axis. I didn’t actually know about this feature when I bought xScope but it makes it really fast and painless to find most measurements in a jiffy.

xScope Auto Measure

The loupe tool (I just call it the magnifying glass) has made color sampling much easier for me. I actually used to take a screenshot and use Photoshop’s eye dropper before I found this. You can quickly zoom in and out, copy the hex color code or the image and more with shortcut keys. This has saved me a ton of time and frustration.

xScope Loupe

Google Picasa Desktop 3

I don’t do much photography nor have I been big on photo management software but I recently started using Picasa 3 along with Picasa Web and have been loving it so far. I prefer keeping photos in the cloud and Picasa seamlessly integrates with Picasa Web where I’ve purchased an additional 10GB of storage for $20. Picasa Desktop and Web make it easy for me to share all sorts of images and even videos privately or publicly with clients, friends, family and strangers. Plus Desktop has easy photo editing for basic stuff so I don’t need to jump into Photoshop all the time.

Google Picasa

Web Development

Coda

Coda is a one window web development application that, aside from Firefox, is my most used application. It has so many great features that this is a must see if you’re going to do web development. If you’re going to work on higher level programming projects then Coda might not be enough for you but I’ve found it to be plenty capable for all my projects so far.

Panic Coda

CSSEdit

I used to use Coda for all my code related work but I’ve recently started using CSSEdit because it’s very well known as one of the best CSS editors available but more importantly, it offers some features that Coda doesn’t.

CSSEdit has a live preview feature in a separate window that changes instantly as you edit your CSS. This makes quick work of CSS editing and testing since there’s no need to switch windows and refresh the preview. It also has great features built in to examine the structure and elements of the preview making this an invaluable tool for my work.

CSSEdit

MAMP

When I needed a live web server environment to do testing and development I used to edit directly off my web server but MAMP changed that. MAMP made it super easy for me to setup a local testing environment so I can do my development without the risk of making files available to the wrong people on the web. Plus everything is just faster when editing locally.

I didn’t want to setup a testing environment like this locally for a long time because I thought it would be complicated and difficult and I didn’t want to mess with my work system. Don’t make the same mistake I did. Do yourself a favor and take a few minutes to setup MAMP because it’s super easy and will save you a ton of time.

MAMP

Parallels Desktop

In my opinion, no web developer’s setup would be complete without a virtualization application. I picked Parallels but VMware Fusion is also great. You can see below that I am running Windows XP with IETester so I can test IE6, 7 and 8 running from my MAMP directory. I’ve also been toying around with Windows 7. :-)

Parallels makes it easy for me to quickly setup additional OS’s like Windows or Linux for testing, learning or whatever reason.

Parallels Desktop

Transmit

If you don’t already have an FTP application, you’ll most likely need one soon enough. You could get a free one if you want but I’ve found the free ones to be subpar at best so I’ve chosen Transmit, from the same makers as Coda (Panic). It’s an easy to use, flexible and very reliable FTP application with lots of great features to suit any level of experience.

Panic Transmit

Browsers

My primary browser is Firefox since it has plugins (like Firebug) that I use on a regular basis. Below you can see the browsers I use in order of frequency; Firefox, Safari, Opera and Safari 4 standalone. I also use IE6, 7 and 8 but only for testing purposes as IE6 is as close as a browser can get to being the devil. :-P

Browsers

Misc Utilities and Apps

Overflow

If you were wondering what application was shown above with the browser icons, it’s Overflow. Overflow is a great little app that makes it easy to launch apps quickly without navigating to your applications folder or keeping tons of apps in your dock. I launch Overflow with hotkeys and launch the app I want from there. As you can see I haven’t kept it very organized but it’s working well in my workflow.

Overflow

Freshbooks (Not a desktop app)

Every freelancer needs some sort of invoicing/billing and time tracking software to make their lives easier and get paid. There are lots of desktop applications available but I prefer to keep as much in the cloud as I can. I went with Freshbooks as they were the most affordable, flexible and feature filled I could find. So far I haven’t had any issues and they can do everything I need done. Clients have an easy place to login, view invoices, make payments, etc. I can track my time, billing, expenses, etc. without paying an arm and a leg.

Freshbooks

Skype, Adium & Twitter

Chat and social media probably aren’t absolute must haves for freelancers, designers or web developers but they definitely seem like it. I mostly use Skype for video conferencing with clients or family but I also use it to chat with a few people. Adium is what I use to chat with clients, friends and family on multiple services (gmail, hotmail, aim, etc.). If you aren’t using Twitter yet, you probably will be soon. Twitter has blown up in the last year and has proven to be a really great resource and tool for working individuals like freelancers.

If you are using Twitter you should be following a few people that are great resources for web and other related stuff. I’m last on the list if you’d like to follow me.

Twitter

Jungle Disk

I create a lot of data on a daily basis that I want to make sure I don’t loose. Jungle Disk and Amazon S3 make it easy for me to backup and store that data in the cloud at really cheap prices. Jungle Disk also has lots of other great features as well as a workgroup environment.

For more information on how I use Jungle Disk and Amazon S3, check out “Using AWS S3 to Power Your Digital World“.

Jungle Disk

iTunes

So far I’ve never met someone who didn’t like music. For me, music is a source of inspiration and motivation which are both things I could never have enough of as a freelancer. Of course you can use whatever music software you like, I just picked iTunes because it works so well with Mac and my workflow. :-)

iTunes

OS X Dock

If you’re wondering how I’ve got my dock setup, here it is. I’ll also list the apps from left to right.

Left Side

  • Overflow (next to Finder)
  • MAMP
  • Toggl (time tracking for specific client)
  • Parallels Desktop
  • Safari
  • Firefox
  • Coda
  • CSSEdit
  • Photoshop
  • Fireworks
  • TextEdit
  • xScope
  • Transmit
OS X Dock Left

Right Side

  • iTunes
  • SpeedDownload5 (file download management)
  • JungleDisk
  • Twhirl
  • Adium
  • Skype
  • Picasa
  • Hulu desktop (added just today to watch Hulu via desktop app)
OS X Dock Right

Conclusion

I surprisingly receive a lot of questions about what applications I use; so there you have it ladies and gents. If you’re jumping into freelancing, web design and/or web development, these are some of the best apps to acquire you on your way and then some. Ultimately, it will come down to preferences and the way you work — but it’s pretty hard to go wrong with any of these apps.

If you know of a great application you think I might like, let me know in the comments so I can check it out. Also, if you have any questions about the applications shown here, just let me know and I’ll do my best to answer them.


38

Comments
  • pulphero says:

    Nice article for the Mac minority. I’d like to see a similar article for Windows users.

  • Caesar says:

    Essential Mac Apps for Professional Designers and Developers
    fixed*.

  • Ryan says:

    Seeing articles like this and all the amazing apps on AppStorm has got me wanting to switch to Mac!

  • Jason says:

    I couldn’t live on my Mac if it weren’t for Quicksilver — the flexibility in not only launching apps, but doing things like directly sending a quick note to anyone’s email without opening Mail, setting up a meeting in iCal, etc is priceless to me

  • Great collection. I personally like Growl a lot. It enables me to keep less windows open, while it pops notifications up as they come. I think it keeps me a little more productive than having to check the separate email / RSS accounts during the day.

  • kilinkis says:

    very nice list! ill give some of them a try!
    thanx 4 sharing bro’

  • Andrew says:

    Great Article,

    I made the switch to Mac last year and I am happy to say I will never go back Windows :D I use Coda on a daily basis, I just love the clips feature, it is very handy.

  • VERY helpful article, esp. about CSS tools.

  • Fawad says:

    I don’t know much about Jungle Disk but for data backup, I use Box and SkyDrive because they both are free ;)

    By the way this is very nice collection of apps :)

  • surreal says:

    As pulphero pointed out, while this is a good article it’s only essential for mostly Mac users.

  • Mark Dijkstra says:

    Nice but i like to see a similar article for Windows users because i have seen a lot of this kind of articles but they where all mac users.

    Next time a link to the programs would be nice ;)

    greetz

  • Thanks for the great article!

    Some apps wich could be added are Billings and Things.

  • Mitch says:

    Maybe its time to switch to Mac you windows folks. I think he was trying to make a point. Mac>Windows =)

  • Jamie says:

    @pulphero seconded! Would also like to see Windows apps

  • Kayla says:

    I’m a PC user myself, but I can see some of these apps can be used in Windows, and I’m looking forward to trying them out. I’m in need of a good code editor, but have never really taken the time to upgrade from Notepad++. I think I’ll try Coda out.

  • I think this is a good article. Whilst it would be great to see a PC version too, I simply don’t think there is enough quality software of this type available for PC.

  • dj says:

    I second the Window’s comment, but I’d also like to see Linux apps too.

  • Michael says:

    Thanks for the list. I use Transmit as well but I find that ForkLift it easier and more powerful tool for the Mac. Worth checking out.

  • Brandon says:

    Nice article – funny that I’ve only used 2 of these apps though as part of my workflow, which consists of :

    Photoshop > Dreamweaver/TextEditor > FireFTP > LitmusApp/Xenocode > Freshbooks

    I’ll have to do some serious research time to check into some of these – FreshBooks is quite useful though – I highly recommend it to anyone looking for a simple billing solution :)

  • Alek Davis says:

    Links to product pages would be helpful.

  • Nori Silverrage says:

    Nice list, I agree that it’d be nice to have a Windows list. I currently use Photoshop, WeBuilder2008, FileZilla, TortoiseSVN, Firebug and XAMPP. I don’t imagine changing from these tools anytime soon as they do everything I want and/or need. Though the real time CSS changing looks nice, then Firebug will partially do that for you. :)

  • Damol says:

    Nice list!

    Is there a program like Overflow for PC? It could be very useful! :)

  • Camxso says:

    I find that having Textmate (http://macromates.com/), Snippely (http://code.google.com/p/snippely/downloads/detail?name=Snippely-1.0.air), Evernote (http://evernote.com/) and Skitch (http://www.skitch.com/), in addition to the apps you’ve suggested, make my design life much, much easier. Great List! Camxso

  • John says:

    Parallels is a must. Or also try Virtual Box from sun, which is free and does much the same thing. That is what we use at our web design and development agency, Pelago.

    Another web-based app (not desktop) app worth checking out is Intervals. It’s useful for project management, time tracking, and billing.

  • Alessio says:

    Wonderfull list! ty

  • Pedro Vidal says:

    Nice article, and I would like to see a similar article about Essential Windows Tools for webdesigners.

  • matthew says:

    This is a great list. Thanks.

  • John Erdie says:

    Nice list!

    I really like Coda, but have been using Textmate & Transmit more and more. I’m really spoiled by Textmate’s keyboard shortcuts now that I’ve learned (some of) them. The E TextEditor for is a great windows version of TextMate ( http://www.e-texteditor.com/ ). I’m also impressed by FileZilla for windows – pretty good for a free ftp client.

    Thanks for the article!

  • Logan says:

    Wow, now I want to get a Mac. I desperately want coda to come out for the PC, but I don’t think it is going to happen.

  • John Doe says:

    I can’t believe there are so many PC users. I’ve been a Mac user for some time and just recently bought a PC for some 3ds max classes I have to take and I have to say I’m ready to throw my dell xps right out the window. What a pain in the ass. Something is always crashing, freezing or just doesn’t work. Vista doesn’t allow some programs to run right. It decides every once in a while that the internet isn’t going to work. You can’t mount an iso to save your life. Just a rant but if you want to save yourself from frustration buy a mac. They are more durable.

  • Tripp says:

    Really nice list. Though it’s aimed towards Mac users, it’s not a bad thing.

    Sadly Mac’s cost to much for to little. You can get the same thing for much cheaper on a PC and if you pay attention to what you’re doing or educate yourself on the hardware/system you’re using, it’s all a pretty smooth ride. Besides, if Mac’s “just worked” as they say, there wouldn’t be forums upon forums for how to fix a Mac or technical support.

    (looks around)

    Mac users are like a cult anyway. Sandals, Starbucks, and blogging. Scary.

  • slayaz says:

    Fireworks is the great unsung hero in my eyes.

    A truly amazing app, without all the bloat of PS.

    Gonna look at overflow now.

    Great work!

  • Merstzik says:

    I just wanted to recommend something, in my opinion, better than “Overflow”. Try “Enso Launcher” insted. It always work in background. To open a program you hold “capslock” and type “open your application’s name”.

    Good article by the way,
    cheers,
    Merstzik

  • MSFX says:

    Your missing Abobe Flash ;)

    Very much agree with Tripp :P

  • Downloading a few of these right now :)

    I especially like Coda.

  • It would be great to see apps for Window Users..

  • Francisco says:

    Nice list, Freshbooks is right there with me.

    For those throwing down Macs, I have not much to say but coming from PCs myself I will never, ever go back to using Windows. I dont know how much everyone here charges per hour but the usual rate for me is $85-125/hour for freelance work. Using windows I had to give up so much on my time on making sure everything was working in prime condition, updating anti-virus programs, cleaning up my disk, fragmenting HD to try and get the most juice I could get form the PC. What can I say, it’s simply not efficient to work that way.

    I’m more than glad I payed the price for a Mac. It has certainly payed off in time numerous times over and over. Simple, stable and quite simply a better user-centered interface. Its the kind of computer I can trust to stay ON working for days and weeks(about to reach months) without a single hiccup.

    Mac for the win. Go ahead, give one a try. Apple should pay me for this marketing!