--- title: Designer Tools teaser: tags: design author: Galen Frechette published_on: 2012-01-26 --- In addition to the [basic development environment](https://github.com/thoughtbot/laptop) everyone at thoughtbot works with, there are a number of other apps most of the designers here use to keep our work flows efficient and our skills top notch. When I came to thoughtbot as an apprentice a little over three months ago, I was exposed to a variety of new apps that greatly improved my work-flow, so I thought I would share with you some of the apps I open up every morning and a bit on how I use them. ## The basics These apps are not necessarily design-specific apps but they are so essential in our day to day work-flows that I couldn’t leave them out. * [**Propane:**](http://propaneapp.com/) Chat client for 37Signals’ Campfire. This is an indispensable communication tool. * [**Growl:**](http://growl.info/) Notifications for anything and everything. Used primarily for Campfire notifications. * [**iTerm:**](http://www.iterm2.com/) Terminal emulation for OS X. Mostly beneficial for it’s ability to open multiple windows in tabs. * [**MacVim:**](http://code.google.com/p/macvim/) Text editing. If you're not already using Vim, take the time to start learning. It will greatly speed up your development time and if you're working with developers who use Vim it will make pairing easier. * [**Divvy:**](http://mizage.com/#macdivvy) Helps you keep your screens and windows spaced, aligned and organized efficiently without clicking and dragging all day. ## [Adobe](http://www.adobe.com/products/creativesuite.html?promoid=ITXQM) If you work on the web I am sure you are already familiar with the typical Adobe software that web designers use, so Im not going to get into the details of our Adobe setups here. Most of us prefer to do hand sketches/whiteboarding and move into wire framing with HTML and CSS as soon as possible any way. Static mock-ups tend to have a host of draw backs when working in an agile development process. That said, photoshop, illustrator and [fireworks](https://thoughtbot.com/blog/post/3564422865/dear-photoshop-user-meet-fireworks) are still our workhorses when it comes to specific graphic design needs. ## [Skitch](http://skitch.com/) A handy screen capturing tool that allows you to very easily draw and add notes on top of your screen shots, without having to open up photoshop or some other image editing tool. ## [Cloud App](http://getcloudapp.com/) Collaboration and iteration are key ingredients in doing great work and I have found this app to be an effective way of sharing screen shots with team members, clients and other designers so I can get that valuable feedback on the development of my work. When you take screen shot Cloud app automatically uploads your image to web servers and in a drop-down from the Cloud app icon in the OS X menu bar, provides you with a sharable link to that image. ## [Notational Velocity](http://notational.net/) Good for general note taking and the keeping of VIM and Git cheat-sheets. Especially if you are new to VIM or Git keeping track of commands and remembering how to get certain things done right can be quite challenging, so we all suggest building up robust cheat-sheets with this little app. ## [FontCase](http://www.bohemiancoding.com/fontcase) or [FontExplorer X](http://www.fontexplorerx.com/) Great typography is a fundamental element of great design. Managing your fonts effectively will help you find that perfect type-face faster and reduce the time it takes to get started with a solid visual design direction. Taking the time to organise your typefaces in a way that is meaningful to you can also be a good way of curating your collection and more intimately familiarizing your self with the fonts in it. ## [Little Snapper](http://www.realmacsoftware.com/littlesnapper/) or [Gimme Bar](https://gimmebar.com/) Both are awesome tools for building a personally curated library of design inspiration. Saving images and examples of the things that inspire you is a great way to refine and hone your own personal style and also a great way to help kick off the visual direction for a new project. If you are not using tools like these already, start. It will be hugely beneficial to the quality of work you do. ## [Hues](http://giantcomet.com/hues) A great little app for grabbing colors from anywhere on your screen. It provides rgb, hsl, and hex values for any color you select which makes pulling color pallets from photos and images you have stashed in your Gimme Bar or Little Snapper quite nice. ## [Bourbon](http://thoughtbot.com/bourbon/) Bourbon is not an app, it’s a library of Sass mixins and functions that greatly speed up front-end development time. It is just as awesome for new comers to .css/.scss as it is for the most seasoned pros. It’s also one of the main reasons the sketch-to-html&css-wire frames process has proven to be so effective and efficient for us. [We have extensively written about bourbon before.](https://thoughtbot.com/blog/post/7846399901/introducing-bourbon-sass-mixins) So that’s it for a light-weight overview of the apps I find my self opening on a daily basis. Hopefully I have introduced you to some new and useful tools. I’d also love to hear about some of the tools your using, so feel free to add your comments below!