March 23, 2009
The design of Adjustments in CS4 [Part 2 of 3]
On Thursday I talked a bit about how the Adjustments panel introduced in Photoshop CS4 fits in with the team’s larger vision for the product. Now I’ve asked my fellow Photoshop PM, Bryan O’Neil Hughes, to elaborate on some of the design goals that informed the effort. Bryan drove the development of this feature, so I thought you’d like to hear his perspective (in this post’s extended entry).
When we looked at improving the user experience for Photoshop CS4, we decided very early on that we wanted to help as many users as possible–no small nut to crack when you consider the incredibly diverse user-base that the application serves. Although Photoshop has several core competencies and an admittedly large trough to draw from with regards to becoming more “walk-up simple,” we found that the many options around image adjustments and selections were both dizzying and, at times, limited. Here I’d like to specifically address what we did with the Adjustment Panel and why it’s one of CS4’s most important and transformative features.
Whether you’re a seasoned veteran of the application or someone who has popped over for the first time from Lightroom, Photoshop can be a bit intimidating (I can hear you agreeing from here). I can’t tell you how many times I would loom over a professional’s shoulders and hear, “you probably know a better way to do this”…what a terrible way to feel with so much power at one’s finger tips.
Luckily, when it came to image adjustments, we knew that there was a set of feature that in many cases, were far better than the rest – Adjustment Layers. Adjustment Layers are non-destructive and re-editable (think history that lives with your file); they offer unparalleled creative control with 25 blending modes and 100 levels of opacity; and they can be easily shared, duplicated and repurposed. The problem here is that in order to appreciate the benefits of adjustment layers, you need to know where they are, how they work and a series of secret handshakes to leverage their power.
The problem was clear, but in order to help as many users as possible we needed the solution to be easier to find, faster and more powerful. Let’s step through those one by one:
1. Easier to find: Step one was getting the features where people would find them, out of the menus and into the application’s main interface (oceanfront real estate). This addressed discoverability, but more importantly it delivered a non-modal solution. No longer did a user need to navigate from a menu to a sub-menu to a dialog box (which held the application hostage in a frozen state) to an “OK” button.
In the Adjustment Panel you’re enjoying the many benefits of layers in real-time with the entire application LIVE, by default. You can wander anywhere in the application as you choose without being handcuffed to a dialogue. For those of you using multiple monitors, having these controls in a panel means that much more control of the interface.
2. Faster: As you might imagine, moving from one’s image to a panel beside it is far faster than combing through various menus and dialogues – as it turns out the experience uses up to 89% less mouse travel than the old, menu-driven, modal method.
In CS3 we introduced the notion of on-image editing with the then-new Black & White feature. This tool allowed users to click on the desired tone in the image itself, then pull left to right to darken or lighten the image – no additional UI required. For CS4 we took a page out of Lightroom’s book and brought on-image editing to Curves, Hue and Saturation in the new Adjustment Panel. Talk about fast and easy, you just click on the desired area and pull (up and down for Curves, left and right for Saturation, add the Command modifier for Hue).
Another thing that helps both new users and old is the power of presets; being able to get started quickly and re-use your work can be both inspiring and fast. CS4 added preset mechanisms to Levels, Exposure, Hue/Sat and Selective Color (the others we added in CS3), I personally created 22 new presets that ship in the CS4, but you can generate your own as well (don’t forget that presets can be shared too).
3. More Powerful: To leverage power from Lightroom and Camera Raw, we brought the Vibrance control to CS4 in the form of the Vibrance Adjustment Layer. The best way to appreciate the benefits of this powerful new feature is to let the results speak for themselves – open a colorful image and increase saturation to 100%, then reset and try Vibrance at 100%. Vibrance is most effective with keeping skin tones within the range of the believable, but I think you’ll find that it’s a superior method of controlling the accuracy of saturation with any image.
The last thing I’ll say about power is that we assured it for all by removing stumbling blocks (those aforementioned secret handshakes)…simple things like reset, preview and deletion of layers have clear, iconographic buttons; as Lightroom has proven, creativity follows ease of use and a lack of unnecessary interruptions….”just let me get to work!” we often hear.
In closing, while I’m proud of what these features offer all users, I’m most excited about what they mean to newer users or those not previously using layers. For the first time in the application’s history we’ve advocated the right thing, up front and helped all users of CS4 take full advantage of the best we have to offer, by default.
Thanks for reading,