DC web design news

Photoshop is a powerful tool to design websites. But through shortcuts and a combination of keys, you can really expedite the design process and be faster and more productive.

When I first started working for the government (especially The White House), I had unbelievable deadlines and pressure that seemed impossible at the time. We would get assignments at 5 o’clock at night and they would expect us to deliver designs and mockups by 8 am the next morning.

In order to meet our deadlines and catch a couple winks of sleep, I needed to take my creativity to its edge.  At times, I felt like I was in the matrix, my hands were moving faster than lightning.  I had to learn shortcuts fast.  And, I had to become absolutely efficient.  I couldn’t waste a single keystroke.

Using the mouse to select options from the tools and menu bar takes time. Every 2 or 3 seconds you need to select a new tool. Multiply those seconds per hundred or thousand and you’ll find that you may spend more time using the mouse accessing the tools than actually designing.

The use of shortcuts allows you to execute those tools directly, and improves the time you invest on the computer doing your designs.  I have about 100 tips for you and every week I will publish another tip.  This is the first one.

Notice: I’m still working with CS3, but shortcuts are the same on CS5.

The move tool.

Yeah, the move tool, it doesn’t sound special, but it’s actually the most important tool of Photoshop in my opinion, because it allows you to select and move layers without having to select them from the Layers window.

Photoshop settings recommendation: Press the “v” key or the Move tool , and near the top of the photoshop window – under the menu bar – select: “Auto select – Layer”.

Now, with those settings, you can click on any item of the design, and select the corresponding layer, when the move tool is selected.

Example:

Imagine that you are working on a web design, and you have selected a rectangular marquee over a layer:

You want to move that portion of the image to other place. If you click over other area of your work, you will loose your selection. Normally, you would need to use your mouse, to select the move tool and then move the selection. Well, by only pressing the “v” key, the move tool will be selected (notice that on the tool bar at the left, the is highlighted):

Then, you can either move the marquee to other place:

Or click over other graphic element of the composition to select its corresponding layer (notice that the selected layer changed on the layers window at the right, by just clicking over one of the texts of the composition):

OK, I hope this helps. As I mentioned, I’ll upload more tips in the future.