Court’s Mighty Morphin’ Web Design Tools *Updated*

I’ve seen that it’s a bit of a trend amongst web designers to make a blog post about the tools that they use. Seeing how I’m a sucker for a good fad I figured I’d hop on the self indulgent train and share all the gizmos I use to make a super website. Here it goes:

Court's Mighty Morphin' Web Design Tools

My Brain

I don’t use this one as often as I should, but when I do, I tend to get some pretty good results. I highly recommend trying yours out. If yours is broken, or doesn’t work as well as it used to, borrow a friend’s.

Sketch Pad and Pencil

I’m not gonna lie, I sort of have a deep seated hatred for Photoshop and most other Adobe products (It’s not you Adobe, It’s me). The longer I can spend without touching it, the better. I like to have a small stack of sketches before I even turn on my MacBook. If you can get stoked on a design while it’s still on paper, then it’s gonna make the whole process that much more enjoyable.

MacBook Pro

It’s shiny, it’s sturdy, and every hipster in every coffee shop has one. I’ve got the 17″ display one with the 1GB of dedicated graphics RAM, if you were at all curious.

Logitech Performance Mouse MX

I didn’t realize that a man could have feelings for a mouse, but it has happened. This thing is comfy as hell, has the smoothest scroll wheel in the world, and tracks on any surface, including glass. Although the price tag hovers around $100, I don’t regret spending any of it.

AiAiAi TMA-1 Headphones

I can’t work without music. It helps keep my concentration when working in a noisy environment, and let’s face it: Dr. Dre designs beats better than I could ever hope to design a website. So naturally, there’s no better place to look for inspiration. Rated in CNET’s top 5 headphone picks, these things are crisp, clear, not too bassy, and comfy to wear for prolonged periods. They’re not noise cancelling, but they may as well be. The $200 price tag makes them rather attractive as well.

Pathfinder

Pathfinder completely changed how I use my Mac. It replaces the standard Mac Finder, and is hundreds of times more powerful. Here’s a basic list of things it does: tabbed windows, split pane browsing, breadcrumbs, integrated Subversion and Terminal window, easily switch hidden files on and off, Drop Stack for moving multiple files, and that’s just scratching the surface. It costs $40, but it’s worth every penny, and this is coming from the guy who pirates EVERYTHING.

SCPlugin and svnx

SCPlugin fully integrates Subversion into your file browser, and svnx does everything that SCPlugin can’t. Together, they’re the closest you can get to TortoiseSVN on a Mac.

Komodo Edit

I spent a good while testing out code editors, and Komodo Edit takes the cake. It’s free, incredibly customizable, has libraries and autosuggests for every coding language you can think of, has tabs and split pane editing, has in window file browsing, and is just generally a wonderful tool. The support team is great, and they have a full IDE version for purchase if you’re interested as well. In short, it’s the bomb.

Google Chrome

It’s fast, it’s sleek, and I’m a sucker for Google products. The minimalist feel to it is great. The WebKit layout engine is the least buggy one out there and the Javascript engine it uses is very speedy. The built in web development tools are killer, and paired with Pendule, you’re flying. Plus, it’s got some nice extensions too, here’s a few I can’t live without: Gmail CheckerXmarksPenduleEye Dropper, and Awesome Screenshot (Makes a screen cap of the ENTIRE web page!)

Photoshop & Illustrator vs. GIMP & Inkscape

So, just like the rest of you, I’ve been using Adobe tools for my whole design career. But when I got my new laptop, I didn’t feel like spending the money to purchase the software, nor did I feel like spending the effort to acquire the software through less legitimate means. So, I started fooling around with GIMP and Inkscape. So far, the learning curve is a little high, but I’m slowly getting the hang of it. Even if I do go back to the cruel mistress that is Adobe, at least I’ll get to say I experimented with open-source a little in college like everyone else. I’ll make a post about my experimentation when I’ve come to a decision.

Evernote

Evernote did to my organization, productivity, and creativity what Newton did to gravity. Evernote is a note taking application that I use to take notes (duh), keep track of to do lists, store business cards and contact info, organize ideas as they come up, and store links to useful web resources. It syncs across everything, and has type recognition, so you can just take a picture of your hand written notes with your phone, and then search them with Evernote later. Best of all, it’s free!

MAMP

MAMP (Mac, Apache, MySQL, PHP) is a god send. If you’re unfamiliar with it, it’s an app that makes hosting a server locally dead simple. Flip a switch and go. I use it to set up development domains on my computer to test my sites. You can also set it up so clients can take a look at the progress you’re making. Free and paid versions.

Cyber Duck

Great FTP Client. Does it’s job, and does it well.

VirtualBox

It’s no secret: Internet Explorer is the bane of the web desinger’s existence. It’s an even bigger piss off for designers who use Macs, because we have few ways to test in IE. Luckily, using VirtualBox, you can run Windows right in your Mac, and can even set it up to access your local server. I’ll be writing an article on this, and other methods of testing IE on a Mac, a bit later.

Tons of Web Design Digests

While fooling around with the specifics of a design, I peruse through as many designs as I can to see what I like and don’t like about them, and then try to pull all the awesome bits into my new design. Tweet My DesignWeb Design LedgerDesign Melt Down and Thinking For a Living are some of my favourite places to go for ideas.

Color Tools

Sometimes finding the right color palette is waaaaayyyyy harder than it should be. When backed up into such a pigmatic predicament, I like to turn to a color tool and play around until I find a palette I like. Check out Color Scheme Designer and ColoRotate.

What The Font?

Ever wondered what that font was? Then upload it to What The Font? and you’ll know!

CSS3 Please!

It’s hard to keep track of all the new fangled CSS3 tags for all the different browsers. This handy little webpage creates all the code for you. It even gives you code for gradients in IE. Weird…

Google Analytics, Google Webmaster Tools, and Google Keyword Tool

I get it: I’m a Google whore. But that doesn’t stop these tools from being AMAZINGLY helpful. I do some basic SEO research and implementation on all my sites, and since Google is the biggest search engine out there, it makes sense to use their tools to help get you hits. Before I sit down to write any copy, I always do some thorough research of possible keywords using the keyword tool. Later, once the site’s up, I track my position for those keywords in Webmaster tools, and the amount of hits using analytics. It’s a wonderful system, really.

HostPapa.ca

Awesome hosting, reasonable prices, great support team, Canadian owned and run entirely off green energy.

GMailSkype, and Adium

You’ve got to keep in contact with clients somehow.

Google Docs

Perfect for writing up web copy. Don’t have to worry about sending it back and forth with a client, you guys can just share permissions to the file and work on it together (Always keep a back up though, clients can be zealous).

WordPress

You want a blog? I’ll give you a blog! Easy to use, looks great, and easy to make themes for. Hey, I’m using it right now!

And that’s about it! Congratulations for reading through that whole post, hopefully you learned something about a new application that’ll help you out. Maybe you only garnered that I was lacking ideas for a blog post. Maybe you decided to get a Google account (Very good idea). Whatever the reason, I thank you, and assure you my next post will be more interesting.

Posted in Tips | Tagged , , | Leave a comment