Behind the Scenes: Lafayette College
Back around the time of the first and second North American blizzards of 2010 (more popularly referred to as the Snowpocalypse and/or Snowmageddon) we started working with Easton, PA based Lafayette College on a redesign of their Lafayette.edu website. It had been years (many years) since the site had a major overhaul so when we sat down with the varsity team of Lafayette stakeholders we knew this was going to be a fun project. Six months later on the heels of a new academic year the shiny new website was ready for primetime.
Clean Up Your Photoshop Swatches and Styles
I can't stand how Photoshop loads your Swatch and Styles palettes with a whole pile of useless defaults. They gunk up a feature that should, by its very nature, be as pared down as possible. I try to keep custom palettes for the sites I'm designing because it makes my work faster and more consistent. If you're always grabbing the eye-dropper to get colors and copying/pasting layer styles, chances are you're wasting time and getting innaccurate results to boot. So what's a good Photoshopper to do?
You could select each color and style individually and delete them, like I used to do. But there's a faster solution that is so easy, you'll kick yourself. I've created two empty palettes for you. Just download them and follow the directions below.
Download: Empty Styles Palette | Empty Swatches Palette
To empty your Swatches palette: Open the Swatch palette, select the More Options dropdown in the upper right, and select Replace Swatches. It'll prompt you to browse for the new palette. Choose empty_swatches.aco. It replaces the default rainbow of colors with a single swatch of black.
To empty your Styles palette: Open the Styles palette, select the More Options dropdown in the upper right, and select Replace Swatches. It'll prompt you to browse for the new palette. Choose empty_styles.asl. It replaces the default monstrosities with a simple "no styles" style.
That's it. Quick and painless. When you've built your fancy new custom palettes just go back to the options menu in the upper right and choose Save Swatches/Save Styles. Once you've saved them you can load them into any document you want.
Photoshop Scripts: Hidden Magic
This one's going to be short and sweet, unlike most of my posts. I just wanted to share a little something that I find myself using daily in Photoshop: Scripts.
The ability to script Photoshop started all the way back in version 7, but still doesn't get the attention it deserves. Most people don't know it even exists, and fewer still realize it's possible to write your own custom scripts to automate tedious tasks. There are a few great resources out there if you're so inclined. If not, you can still take advantage of the ones that come pre-loaded and others available freely on the web.
Pre-loaded Scripts
Photoshop comes with a few handy scripts right out of the box. You can find them under File > Scripts. The one I use most often is:
Layer Comps to Files
This one does exactly what it says, outputting your Layer Comps to separate files. If you have never used Layer Comps, read up! They're a pretty fantastic way to create "snapshots" of your comp in various states. The script makes outputting those snapshots fast and simple. You can output to various file types including PSD, PDF, and JPEG. If you have clients who like to see everything in PDF format, there's also "Layer Comps To PDF" which outputs the layer comps into a single PDF document with multiple pages.
Add-On Scripts
Photoshop scripters have been generous, sharing freely and even writing scripts that people request. A few worth looking at:
Remove Copy From All Layers
I use this daily, and get giddy just thinking about it. Before installing this script I would manually go through and remove the word "copy" from dozens of layers every day. I HATE that Photoshop adds the word copy to a layer automatically when you duplicate something. HATE. But I love that I can run a script at the end of the day and get rid of all those ugly add-ons. It removes the word copy and also the number next to it, so "mylayername copy 12" becomes simply "mylayername".
Read more and download the script.
NOTE: In CS5, you can opt to turn this off. In your Layers palette click the button on the right for more options. Toward the bottom, you'll see Panel Options. Select that and you get a dialog box that looks like this:
Make sure the Add "copy" to Copied Layers and Groups box is unchecked.
Delete Empty Layers
Another layer palette clean-up script, this one gets rid of any layers that have no pixel content in them. Which happens more than you might think, especially when the text tool comes out.
Read more and download the script.
Close Without Saving
Close one or more documents without saving - and without going through the prompt twenty times. This one is nice for times when you've opened a ton of images and done some futzing but just want to close out of everything. Use with caution, since it does exactly what it says - closes without saving.
Read more and download the script.
These are small improvements, but they add up to a less tedious workflow. Which means a much happier Mindy. If something bugs you every day, a script might be the solution.
Do you have scripts you find useful for everyday tasks? I'd love to hear what everyone else is using!
Boss Your Segments Around: Freebie, an ExpressionEngine Addon
I love how flexible ExpressionEngine URLs are — by not strictly parsing URLs, EE lets us send users to /whatever/long/url/we/want/ and find our own clever uses for the URL segments. We use this technique a lot at Viget for returning entries or specific templates, but it’s also great for setting page states, like showing unpublished entries by tacking a /preview/ segment onto a link or using /success/ to throw a "Form submitted!" message.
I recently wrote about Structure and how it gives clients more power and designers more freedom by directly assigning templates to pages. I also mentioned that it parses URLs strictly, which makes a lot of our old tricks much, well, trickier. In 1.6, we used NSM Safe Segments to 'hide' some segments from Structure and get around this issue, but the solution was less than ideal, and the upgrade to 2.0 found us searching for a new method.
Announcing Freebie
We made a wishlist of features we always wanted to see in Safe Segments, and the result is Freebie. Freebie prevents EE from parsing particular segments of your choosing, allowing you to use much more complex URLs without the risk of Structure choking on them.
Continue reading "Boss Your Segments Around: Freebie, an ExpressionEngine Addon"
Consumption: How Inspiration Killed, Then Ate, Creativity
For creatives, the definition of the word "inspiration" has lost its meaning. It's no longer a spark of intuition to solve the uniqueness in a problem, but a search for the current and complacent solutions created by others. As a creative collective the term "inspiration" has driven us to become lethargic to the realities, foundations, and intentions of our chosen craft.
The misinterpretation of inspiration is bred into our culture. In school we are taught by the examples of others, given information to digest and remember, instead of being handed problems to analyze and interpret on our own. As children we are taught to fear failure and to learn from the mistakes of others instead of experiencing them first hand. Many times curriculums centered around creativity and exploration are pushed out of the way to make room for ones rooted in practical application and applied theory. An example of this logic is painfully evident in design schools that focus more time on learning design applications than nurturing creative exploration and development.
Continue reading "Consumption: How Inspiration Killed, Then Ate, Creativity"
jQuery Image Scroller Plugin
Building websites for PUMA has given me the opportunity to do some pretty cool stuff. The latest feature was dreamed up by Owen, and it turned out to be pretty easy to do with JavaScript.
These large individual product images work great for products like shoes, but when we needed to introduce clothing items we couldn't fit the entire product in without shrinking the image down until it was too small. Owen’s solution was to have a small thumbnail preview that you could drag over to view different sections of a larger image.
So with a little bit of jQuery, I was able to make that happen, and I made a plugin out of it.
2010