Designer & bike rider in British Columbia, Canada

Essential Mac Web Design Apps

While working on a contract these are the applications and programs I have running on my MacBook Pro (with OSX 10.4) at basically all times while designing and constructing a website. I can’t work without these. A lot of Command-Tab, Command-r going on.
What do you use?
desktop-web-design-apps-mac-osx.jpg
Grab
Native OSX app for taking screenshots. Good for grabing areas of an existing design and layering that under a mockup, or to send a quick proof to someone over chat. If only it included the ability to save in JPEG.
Digital Colour Meter
Another indespensible little program that tells you exactly the colour your cursor is hovering over, anywhere on your screen. Pretty usefull esp. when dealing with multiple and conflicting colour profiles; its just on-screen WYSIWYG. Converts to RGB or Hexidecimal and allows you to hold those numbers while you enter them into your CSS or mockup palette.
TextWrangler
Free text editor. The search function is bit annoying, and overall it’s a bit overkill for simple HTML / CSS coding, but it’s free and works for me, and integrates well with Cyberduck FTP. I spend 1/3 of my time in here. barebones.com/products/TextWrangler/
Firefox
I actually prefer the speed and integration of Safari, but appreciate the customization of Firefox and but what I really want to talk about here is its MOST useful of plugins, Firebug. My god if every web developer in the world doesn’t use this web page inspector. Pretty essential when you’re dealing with server-side CMSes and dozens of stylesheets in who-knows-what hiearchal order.
Adium
Got the Facebook, MSN and Gchat integrated into this chat utility which, yeah, is mostly for socializing but maybe 15 per cent of the time is for corresponding with project peers or partners, sending screengrabs, asking a friend for help on debugging, etc. I also like Adium‘s iTunes status integration.
Dictionary
When Firefox’s integrated Canadian dictionary fails me, or I’m commenting something out in an editor, gotta stay professional and use the right ‘loose’ or ‘lose’, etc. Dictionary comes with OSX, and wow, it uses the OED (American version, but also shows Brit spellings). I used to use the included OSX widget but, after seeing my roommate use the standalone app, I appreciate the extended details and thesaurus with one CMD-tab (which is also faster than an F12 Dashboard load).
Cyberduck
Free FTP program. Cyberduck gets slighter better every release. Its TextWrangler communication allows me to edit off the server, and it’s got standardized OSX keyboard commands like CMD-r refresh, CMD-delete delete.
Preview
Usually have someone else’s PDF mockups in here, or converting a Grab grab into a JPEG. A native OSX app, like Windows Picture Viewer.
Finder
Usually have two or three directories open to a company’s identity materials, the master mockup folder, the template folder and my Downloads folder.
Photoshop
Editing the images, usually only if there’s photo work.
Illustrator
Usually tracing something in here, or occasional wireframing or mocking up mockups if another designer was using it to start the project. If I’m working on print design materials then Illustrator is front-and-centre.
iTunes
I’ll actually choose appropriate music to design to, like energetic music for an energetic website, or soothing for a relaxing site. For the more mindless aspects of cleaning up code or tracing it can be lyrical pop or indy rock, but for debugging or content writing it’ll be repetitive background like Eno or Glass.
Background Apps
Running in the background (little icons at the top right of my screen) are things like my email and calendar notifiers, last.fm plugin, Adium status, VPN connection to a client’s server. Occasional blue-toothing files to Tobias across the table. Oft-used dashboard widgets are the OSX standard Calculator and Unit Converter, and one of the more polished Lorem Ipsum generators, Cicero.
FireWorks
I can’t say enough good things about this dedicated web page design program. This week my project was building on someone else’s AI files, which I have to modify and return, otherwise I’d be in FireWorks, which I’ve used for at least eight years now.
TextEdit
Oh I usually have Mac’s WordPad equivalent open to copy-paste text, hold temporary content, or remove stubborn formatting from copied text.


Posted

in

by

Comments

2 Responses to “Essential Mac Web Design Apps”

  1. Davin Greenwell Avatar

    More or less the same here but add Terminal for SSHing directly onto the server and also some top secret Smallbox app we’re working on to manage and construct CMS’ on the fly.
    Love adium, love cyberduck (though the name is hilarious). I am on the mac most of the time but I run Skype on the PC at work since it has a headset (important for offices) but the interface is really weak. They should just copy Adium’s tabbed conversation windows and leave it at that.
    Looks like you are using the same theme as me for Adium but I opted for Stockholm status icons due to their horizontal efficiency.
    Oh I ALMOST forgot – I use ColourSchemer Studio for colour grabbing and scheming:
    http://www.colorschemer.com/

  2. Andy Avatar

    Pretty similar setup, firebug is such a life saver.
    I used to use cyberduck but ever since I started using Coda for html/css I don’t have much of a need for cyberduck.
    Also I use Billings 3 for time/project management.

Leave a Reply

Your email address will not be published. Required fields are marked *