This post is part of a series where Behance developers talk about the various tools they use to get things done and make ideas happen.

1) Who are you and what do you do at Behance?

My name is John Refano. I’m a professional contrarian, noise-maker, perfectionist and coffee drinker. Oh yeah, and I’ve been known to make websites. I was born in New York, but lived in Philadelphia for the majority of the past 10 years. I currently live in Brooklyn, and wouldn’t want to live anywhere else. I also have a degree in Design, strangely enough.

I am a developer at Behance where my focus and interest lies primarily on the front end. I use Sass, Javascript (thank Resig for jQuery) and PHP to build pretty things (About Behance, About Prosite) and style up stuff you just might use every day on the Behance Network. I built most of the 99% Conference site, and put in a teensy bit of work styling the new Action Method Online. I also helped on a big restructure of the Sass on our Served sites and CCN‘s with the rest of our awesome front end team (JFTW… our names all start with the letter J), finding ways to make things more efficient in terms of customization and reusability. I try to add cool stuff to our private little Sass framework when I can. I guess in some capacity, I touch the part you see of everything we build here.

2) What hardware do you use?

27″ Apple iMac . Magic Trackpad. 27″ Thunderbolt monitor. iPhone.

3) What software do you use?

The things I use every day are:


I don’t know if I love it or if I am just used to it. But it does the trick and I have a number of bundles and snippets that make life easier for me. Plus I love the “twilight” theme, even if it is somewhat ruined by sharing a name with that awful movie/book.


I’ve gone back and forth over the years, at one point being a huge Chrome fan, but in the end, I always come back to Firefox. Things like Firebug and FirePHP make that an easy decision. I even have a treasured Firefox backpack (geek cred?)

I would have previously listed PixelPerfect as an essential tool, but it seems like an abandoned project and doesn’t work in the latest versions of Firefox. I’m seriously considering figuring out how to build my own version of that plugin. I guess I could fork it on github… or you could.

Sass/Compass, Livereload and FolderWatch

I use these tools together to create some kind of unholy front end dev trinity that I wouldn’t give up for anything. Sass is the best CSS preprocessor in the world (dare I say this is fact, not opinion), and Compass is an the awesome framework for Sass that makes life even more easy. If you write old-school CSS, do yourself the biggest favor ever and look into using these two. Run, don’t walk.

LiveReload is a handy tool that sets up a server for your browser to connect to (via a plug in or Javascript) that monitors your files and soft-refreshes your browser as you save them. That means you can see all the elements popping into place as you save your files, with no need to refresh and wait for your entire site to load anymore. FolderWatch comes in handy for me because our specific setup here involves a virtual machine “sandbox” which I use FolderWatch to automatically sync my files over to while I work. I mount the file system of my sandbox and have LiveReload watch that!


I find this tool completely essential for measuring things on the screen and quickly checking if elements line up. The “dimensions”, “crosshair” and “guides” tools are well worth the price of admission, and it has a bunch of other cool stuff too.

Cornerstone helps make SVN slightly less painful.

In other odds and ends: Adium is my favorite chat app (because you can customize it to be minimal and unobstrusive), HipChat is our awesome group chat app (gotta love all the awesome hidden emoticons), I love to hate Photoshop, Alfred launches my apps, Action Method helps me get things done, and Dropbox mostly holds music I throw it in when I am at home to listen to at work.

4) What do you listen to while working?

Some weird combination of metal, electronic, shoegaze and experiemental/noise. I always have my headphones on, and I mean always. I miss out on all kinds of things in the office, but it’s for the best. Having headphones on helps me focus significantly on what I’m working on. Hell would be a job where I couldn’t wear headphones.

5) Out of all the equipment used, what piece of software/hardware do you feel is the most useful of all?

Terminal. The main reason I switched to a Mac from years of Windows use. If you are a web developer and don’t use the terminal… learn.


Read my complaints about every day life at @threehz