Join Julieanne Kost for an in-depth discussion in this video Creating artboards, part of Photoshop CC 2018 Essential Training: Design.
- [Instructor] Artboards are a unique type of document in Photoshop that enable you to create multiple iterations of a design within a single document. For example, if you're a mobile or a web app designer, you might want to mock up an interactive app and it would be very convenient to design and lay out multiple screens within the same document, and artboards are perfect for this type of work, so let's get started. I'll click on the New button, then navigate to Mobile. I'll select the iPhone 6 preset, and just point out on the right side here under the Preset details that we're selecting an artboard and that the background contents are set to white.
I'll choose Create, and although there are many similarities to regular documents, artboards have some unique behaviors and the background color is one of these unique behaviors. In the Layers panel, we see a new type of layer group called an artboard, and yet the layer looks transparent in my Layers panel but it's white in the document area. So this is the special unique behavior where artboards have a background color but you need change that background color using the Properties panel.
Now before I select the Properties panel, I'll click on the Artboard layer group, and then choose Properties, and we can see that the artboard background color is indeed white. If I want to change the background color, I can choose Other, select a color. When I click OK, it's been changed in the artboard area but not on the Layers panel. All right, let's change that back to white. I'll close the Properties panel and tap f to go to fullscreen mode to give me a little bit more room.
You might have noticed that when we selected the Artboard layer group, the move tool changed to the artboard tool. If I click on the layer again, then I return to the regular move tool. We'll talk more about the artboard tool in just a moment. For now, I want to rename the artboard. I'll double-click on the Artboard layer group and rename this Cover 01. When you have an artboard layer group selected, the easiest way to add another artboard that's the same size as the current artboard is just to click on any one of the circles with the plus icon.
Depending on where you want to place the new artboard, you'll click on the corresponding circle. So if I wanted to add it above or below or to the left, or, in this case, to the right. Using the Options bar I can select from the preset sizes or I can change the width and height but if I make any changes now, it will the change the currently selected artboard. So instead I'll choose Layer, and then New, and Artboard. Here we have that same set of presets, so I can select something and then click OK and it creates that artboard.
I can also, as long as I have the artboard tool, I can also just click and drag out an artboard anywhere in the document area. I'll hold down the space bar in order to access the hand tool and just pan this down a bit. In order to select the different artboards, you can click on the name of the artboard in the document area or you can select the different artboards on the Layers panel. In order to select more than one artboard, I'll use the Layers panel and hold down the command key and select Artboard 2 and 3.
If I ever need to align artboards, I can use the Alignment options in the Options bar. In order to toggle the orientation of an artboard, Artboard 3 for example, I'll select it in the Layers panel and then click on the icons here in the Options bar to change from horizontal to vertical. In order to delete an artboard, we can drag it down to the trashcan icon on the Layers panel or with the artboard select, just tap the delete key. Another easy way to change the size of an artboard is to simply drag on any of the transformation handles in order to resize it.
I'll use command + z in order to undo that. All right, let's double-click on Artboard 1 in order to rename it. I'll call this Cover 02, and then I'll choose File, Save As. I'll call this KI for Kangaroo Island. I'll save it as a PSD file in the Exercise Files, 10 Artboards as a Photoshop layer document and click Save. Now we're ready to start adding our content which we'll do in the next video.
Photoshop CC boasts tools and features for making tonal and color adjustments, applying effects and treatments to type and graphics, and distorting, filtering, and layering elements—all while maintaining the highest-quality output. In this course, Julieanne demonstrates how to efficiently perform common design tasks, including editing images, drawing shapes, and working with type and fonts. Along the way, she shares the secrets of nondestructive editing using Smart Objects, and helps you master features such as layers, filters, blending modes, typography, custom brushes, vector masks, and much more—increasing your productivity every step of the way.
- Working with Smart Objects
- Linked vs. embedded Smart Objects
- Creative transformations and warping
- Essential filters for designers
- Emulating traditional drawing techniques
- Working with shape and fill layers
- Pen tool basics
- Applying layer effects and styles
- Type essentials
- Creative brush techniques
- Working with libraries and artboards
- Exporting files and sharing images