I thought I would give my readers a little information on my current toolset. For the sake of the article, I’d like for you to pretend that we have just started working out of the same office together and you and I are comparing notes about our current tools and processes. Since we can’t actually do this in person I want to encourage you to share some of the tools that you are using in the comments below (or even better, link to your own blog post on the same topic). The tools that we each use are unique and say a lot about the kind of work that we do and what we value.
So without further ado, here is my list:
Index Cards – I’m a big fan of keeping things as simple as possible. I like to have a stack of index cards handy to jot things down on. I like both the 3×5 and 4×6 varieties. Lined on one side, blank on the other, and preferably college rule. I like to use index cards as story cards when planning releases, to write down ideas for new blog posts (one per card), to keep track of to-do items, and to doodle on ideas for projects. Yes, in my opinion, the index card is the single most valuable piece of writing material for the modern man. Infinitely versatile and so compact. Even better than those moleskin notebooks that everyone carries around, but hardly anyone uses.
Paper – I don’t often use paper other than index cards (do those qualify?), but when I do, I use plain 8½×11 printer paper. For paper prototyping I like to print out sheets of paper with a box in the center that is useful for keeping illustrations of the of the web app I’m working on constrained. I use the margins to jot down implementation details. “Here’s the document that I use.”:
Pencils and Sharpies – I am a longtime user of #2 BIC mechanical pencils. They are super cheap, write extremely well, and never need sharpening. I like them better than pens because they aren’t permanent (so they are better for sketching). If only the clip didn’t break off so easily. (Though I will admit to a certain amount of satisfaction every time I break a clip off.) I’m also a fan of the sharpie. It is a great tool to leverage when you want to avoid getting too detailed in your sketches. 37signals has talked about this before and I agree. Sharpies are awesome.
A Whiteboard – I don’t always have a whiteboard handy, but when I am working with a client this is an awesome way to capture ideas, map out complex flow diagrams, and discuss interface changes.
My Computer – Of course, no description of the physical things would be complete without talking about my computer. As you may have guessed, I have a MacBook Pro. I recently exchanged my 15″ for a fully loaded 17″. I decided to max out the memory and the hard drive this time and I am loving it. I can finally run a graphics program and VMware without the system coming to a crawl. I also have room for all my movies, TV shows, and music. It’s the perfect work/personal machine. During the day (if I’m not out galavanting about), I like to plug into my 22″ Apple display (it’s not one of the newer ones, but it is still pretty classy). I am also currently using a Microsoft Natural Keyboard and the Apple Magic Mouse (which may be the first mouse Apple has ever created that is worthwhile). I also have a pair of JBL speakers (no subwoofer to kick) which are compact and perfect for easy listening during the day.
Fireworks – My graphics editor of choice is Adobe Fireworks (formerly Macromedia Fireworks). Fireworks is quite simply the best website graphics tool on the market today (in my opinion). I know that there are people who prefer Photoshop, but I’m of the opinion that most of them aren’t UX people. They either do a lot of extremely high end design with lots of textures and polish, or more likely they also do print design and are using the tool that they are comfortable with. For my needs Fireworks is more than sufficient. It successfully combines vector and pixel-based editing into one program allowing you to create pixel perfect designs with far less effort than it takes in Photoshop. Oh, and did I mention that it’s fast? It makes Photoshop look like a 4 ton behemoth. The one caveat is that Adobe and Macromedia have always been a little hit and miss on the releases. I’m currently using CS3 as it seems to render fonts better.
Illustrator – I don’t do a lot in Adobe Illustrator, but whenever I’m working on a logo or a complicated piece of vector art I like to do it in Illustrator. I’m still not very efficient with it as I’m mostly a Fireworks man, but Illustrator a fantastic array of tools for doing complex stuff with vector art. On Windows, I was an XARA man. Xara is an amazing tool. It beats Illustrator hands down in terms of usability and can create photo realistic vector art. Unfortunately, they have yet gotten it going on the Mac yet. Somebody please help them port it to the Mac. It’s simply awesome.
Photoshop – I rarely use Adobe Photoshop, but when I do it’s usually for what it is good at: photo editing. The layer based approach is simply awesome for this. Most of the time the built in bitmap editing tools in Fireworks are sufficient for me, but when they are not I drop back and punt. Photoshop rocks for photo editing, but please! Don’t use it for anything else!!
Textmate – Textmate is my comfortable everyday editor. I like it because whatever language I am working in it provides pretty good support. And did I mention that it is simply gorgeous? I love it’s project based approach and typically launch it in a directory with the `mate` command.
Vim – I’m a Vim guy on the console or server. I’d probably use it instead of Textmate as my everyday editor except for the fact that I can’t get away from Textmate’s beautiful project drawer. Vim is great because it’s installed practically everywhere. This means that whenever I SSH into a server I can edit files in the comfort of a familiar editor. I don’t know a lot of Vim commands, but I know enough to get around.
Tweetie – Yup. I love Tweetie. When it comes to Twitter, there isn’t a better client on the Mac. And it is simply beautiful. The interface is unique, but very functional. I love the fact that it allows me to easily manage multiple Twitter accounts. This lets me keep @johnwlong, @rcreative, and @radiantcms in sync. Oh, and they also have a similarly awesome product for the iPhone.
Gmail – I’m currently using Gmail as my main e-mail client. It’s taken me a while to warm up to it, but without faster support for IMAP this seems to be the best way to view my mail. I use it with Google Notifier for the Mac to keep me informed about unread messages. I also use Gmail for chat these days and like the fact that I can close it all down if I need to get work done.
Skype – Skype seems to be the best way screenshare at the moment. It is much more stable than iChat making it the ideal screensharing tool when I’m trying to demo things for clients. The only thing it’s not good for is for yielding control of your screen to another user (which is extremely handy when pairing remotely). For that, I do resort to iChat, though it seems to crash every once in a while.
Serve – I’ve built a couple of tools that help streamline my workflow, but none is more useful than Serve. Serve is a rapid prototyping framework for Rails applications. It makes it easy for me to throw a bunch of HAML, SASS, and images in a directory and render the content. Serve allows me to use concepts similar to Rails partials and layouts to dry up my HTML mockups of the application, which allows me to quickly build a prototype of any web application. Think of it as Rails without the backend – just the views directory. Serve is simply awesome. I use it almost every day.
Shell Scripts – I’ve written a couple of custom shell scripts that help me fly around the command prompt. I’m not sure that my scripts are generally useful to anyone outside of myself, because you would have to structure your projects exactly like I do to get the same benefit, but I highly recommend that you take the time to write a couple of commands to make it easy to do your common tasks on the command line. Shell scripting is a bit convoluted, but with a little effort you can save yourself hundreds of hours of typing over the course of your career.
So there you have it. My list of tools and the reasons I use them. There are a lot of other tools I could list like Xscope, Billings, or TextExpander, but these are the one’s I can’t live without. What about you? What are the major tools that you are using on a regular basis? Are there any tools that you would recommend to improve my workflow? What about those of you who do more development than design? What tools are you using?
© 2013 John W. Long