step1

Photoshop Actions – Creating Folder Structures for Web Designs – Tutorial

This tutorial will show you how to create Photoshop actions and more specifically how to create an action to create a folder structure for your web design layouts

When creating a screen design of a web page organisation is key, keeping layers in folders enables you to quickly move or hide any layers that you need to. When you initially open Photoshop you should create folders to do this, hence a Photoshop action to do it all instantly, every time you want to design a new layout, here is how.

Video Tutorial


Text Tutorial

These Images and text support the video Tutorial

Step 1 – Actions Panel

step1

Go to Window > Actions or use keyboard shortcut ( Alt + F9 )

Step 2 – A Folder for your Actions

step2

Create a new (label 1 step 2) folder to keep any actions that you make, you can put them all in one folder so you know where they are or create new folders depending on the type of action you are creating.

Step 3 – Create folders and layers for organisation

step3

Create a new action (label 2 step 2) and give it a descriptive name so you can easily tell what it does, you can give it a shortcut key as well using the F1-12 keys , some are already occupied by Photoshop default shortcuts but you can overwrite them.

Here are the defaults using F1-12 keys

  • F1 – Adobe Online Help
  • F5 – Brush style palette
  • Shift + F5 – Fill Layer Dialogue Box
  • F6 – Colour, Swatches, Styles palette
  • F7 – Layers, Channels, Paths palette
  • F8 – Navigator, Info palette
  • F9 – Actions, History, Presets palette

Step 4 – Create a new document

step4

Create a new canvas that is suitable for your web design layouts ( Ctrl + N ) you can even give it a default name

Step 5 – Folder Structure

step5

You have your blank canvas and now you need to create your folders that you will use to organise your web designs make as many folders as you need.

Step 6 – Stop Recording and Test

step6

Hit the stop button (label 3 step 2) so that no more actions or mouse clicks are recorded your action should now be complete hit the shortcut key you assigned it in the video it was F2.

Conclusion

There are so many ways you can use actions to record your clicks and settings try and experiment and think about what you do the most in Photoshop and try to create an action for it…maybe cropping images!.

Comments

Was this tutorial clear and easy to understand? do you use any actions in Photoshop, if so please let us know in the comments below.




There are no comments

Add yours

Comments are closed.