Best 10 Photoshop Shortcuts for UI Designers

As a UI Designer and extended time fan/user of Adobe, I tend to find myself with Photoshop to make icon collections and mobile/web mockups.

Listed below are a small number of shortcuts I have picked up during the previous five years to produce the regular layout workflow somewhat simpler.

Filling a Twist

Currently, this is a very neat shortcut.

You're able to fill a chosen layer with your current foreground or background colors. It.

MAC: Alt+Backspace (foreground) or Cmd+Backspace (desktop )

WINDOWS: Alt+Update (foreground) or Ctrl+Update (desktop ).

Duplicate Layer Styles

This shortcut is most likely something that you discovered over the first couple of weeks of studying Photoshop. 

Just hold the Alt/Opt primary and drag on the FX icon in the layers panel in the coating with the fashions to the goal layer -- the styles will be duplicated straight over!

Shape Attributes

Precisely like copying coating styles, replicating contour characteristics is also very helpful when having to design several silhouette what is a good professional photo editing software components. When copying shape characteristics, you can reproduce the live contour properties of an element like the color and boundary properties.

To replicate shape features, right-click onto the coating which holds the features which you would like to reproduce, select Copy Form Characteristics, then choose the layer which you would want to glue the elements and excellent shape past Characteristics.

Change measuring units that are Instantly

How frustrating is it when you make a new record, and your dimensions are in inches rather than pixels? It is frustrating to need to experience the breadcrumb path of Edit>Preferences>Units & Rulers.

However, if you did not already know, it is possible to right-click your record's rulers instead (in case they're observable ) and then pick the measuring device of your selection.

Add Lorem Ipsum

A working copy is not always readily available for the site or program we are mocking up. Where Lorem Ipsum comes in to play, that is.

Currently, I used to work with Lorem Ipsum generator net software. However, I discovered about three years back the Photoshop has it's own Lorem Ipsum function. After you draw a text box in Photoshop, go to the menu bar, choose Form > Paste Lorem Ipsum to meet with your text box using Lorem Ipsum text.

Eyedropper Shortcut

Working together with the Brush tool but you want to sample another color in the image? Rather than clicking the Eyedropper tool hold the Option or Alt key to change. Release to return to Brush tool.

Save Internet & Devices

For years I had the menu bar to get this choice and rescue my layouts for the internet. Solely from habit. It was just until I began with this shortcut. It is currently one of my favorite alternatives.

MAC: Cmd+Shift+Pick +S

Artboards

This is a somewhat new attribute on Photoshop CC. Employing artboards is an absolute necessity if you are a UI Designer.

Now it's possible to put out your different screen mockups as though you were operating. Great.

Adobe Preview

I adore this feature. It is a terrific way to observe your layouts on screen dimensions that are chosen.

I usually utilize Preview to affirm that each pixel and component in my cellular screen mockups appears pixel-perfect on the gadget. Simply download the Adobe Preview program onto the tablet or your telephone computer, be sure best professional photo editing app that the devices along with your computer have been about the specific identical WiFi network and you are all set.

10. Copy CSS

If you are a UI Designer that additionally codes your layout, this awesome feature lets you replicate the CSS of pretty much every single part in your file.

Simply right-click the coating of the option, pick"Duplicate CSS" and then you've got a great snippet of CSS on your clipboard for use.

Bonus Suggestion: Prototyping Your Own Photoshop Style

Should you use UXPin, then you may use their Photoshop plugin to begin simplifying your inactive layouts. When you've installed the plugin, then you may make prototypes that are smooth such as the under confirmation cartoon.

The brand new system does not flatten files, and that means that you may prototype any coating. Just drag and drop your data and you are prepared to proceed.