Artboards in photoshop

What are artboards in Photoshop?

An artboard in Photoshop is an individual canvas within a document on which you can add images, objects, and text, various elements, and create multiple designs and layouts. An artboard can hold numerous layers and layer groups.

Artboards are typically used for designing interfaces or layouts for websites, mobile apps, or print materials such as brochures and flyers. They provide a way to organize and view different designs within the same file, making it easier to compare and edit multiple versions of a design.

When will we use the artboard in Photoshop?

Artboards are helpful for a Web or UX designer. You can lay out designs for different screen sizes and resolutions. This can be especially helpful when designing for devices like Desktops, mobile, or tablets. Artboards play an important role if you want to create a responsive website.

When creating multiple design variations, artboards can be used to keep them organized in a single document. This allows you to quickly compare and contrast the different options and make any necessary changes.

Let`s say, You have made a presentation with multiple slides. You can use artboards to keep each slide organized in a single document. This makes it easy to add, remove, or rearrange slides as needed.

You can create multiple graphics with different dimensions and layouts in a single document for social media platforms. This can save time and streamline the design process.

Artboards can be used to create multiple designs for a product packaging, allowing you to see all of the designs in one place and make any necessary adjustments before finalizing the design.

Generally, artboards are useful when working on projects that require multiple designs, layouts, or dimensions. They help to keep your work organized and make it easier to make changes or revisions as needed.

How to create an artboard in Photoshop?

Go to the File menu then click on New. A New Document pop-up menu will appear. Name your preset. Select the artboard size preset or create a custom preset by typing width, height, and resolution. Make sure to checkmark of Artboards. Finally, click on Create.

Here I choose Web's Most Common size where the width is 1366 pixels, Height is 768 pixels, Resolution is 72 PPI, the Background color is white and the Artboard is in Landscape mode.

How to activate an artboard in Photoshop?

To activate the artboard click on any edge of the artboard by selecting the Artboard Tool in the tools panel. You can Zoom in or Zoom out the artboard.

How to customize an artboard in Photoshop:

Artboard Size

You can change the size of the artboard. Select any Artboard size preset or select Custom in the opinions bar. If you select custom then set width, height, and resolution.

Artboard background color

To change the artboard background color select the artboard backgrounds color on the options bar White, Black, Transparent or Other.

If you choose Other for the artboard backgrounds color then the Color Picker(Artboard Background Color) window will appear. Select your desired color from the color picker.

Portrait/Landscape artboard

You can change portrait to Landscape or Landscape to portrait artboard by selecting Make Portrait/Make Landscape on the options bar.

Add New Artboard

In the Tools panels, select the Artboard Tool. Draw the artboard on the canvas or click on "Add New Artboard" in the options bar and then click on the canvas.

You can also add new artboards to your document by clicking the + icons that appear around the artboard.

Hold down the Option/Alt key on the keyboard and click a plus (+) icon to duplicate an artboard and its contents.

How to convert a standard Photoshop document into an artboard document?

A standard Photoshop document

You can convert a standard Photoshop document into an artboard document in several ways. Go to the Layer menu select New and then click on Artboard or Artboard from Layers.

A small pop-up dialog box will appear. You can rename the artboard and set the artboard to preset/custom. Click on OK.

To activate the artboard click on any edge of the artboard.

Artboard document

What is the difference between an artboard document and a standard document in Photoshop?

Artboard document

An artboard document in Photoshop allows you to work with multiple canvases in a single document. You can create, arrange, and edit multiple canvases within a single document. This makes it easier to create designs that require multiple variations and layouts. You can choose to export individual artboards or all artboards as a group. This makes it easier to share and collaborate on specific parts of a design project.

Standard document

A standard document in Photoshop only contains a single canvas. With a standard document, you can only export the entire canvas as a single image file.

How to export artboards in Photoshop?

Export artboards as files

To export artboards as separate files go to the File menu, choose Export and then click on Artboards To Files.

A dialog box Artboards To Files will appear. Click on Browse to select the Folder where you want to save the generated files. You can rename the "File Name Prefix". Enable "Include Overlapping Areas if you want to export graphics outside of the artboard. Mark whether you want to export all artboards or only the selected artboards. You can also enable "Include Background in Export". Choose File Type: BMP, JPEG, PDF, PSD, Targa, TIFF, PNG-8, or PNG-24. Click on Run. Photoshop exports the artboards as files in the selected format.

Export artboards as PDF

To export artboards as PDF go to the File menu, choose Export, and then click on Artboards To PDF.

A dialog box Artboards To PDF will appear. Click on Browse to select the Folder where you want to save the generated files. You can rename the "File Name Prefix". Enable "Include Overlapping Areas if you want to export graphics outside of the artboard. Mark whether you want to export all artboards or only the selected artboards. You can also enable "Include Background in Export". Choose Multi-page Document or Document Per Artboard. Encoding: ZIP or JPEG. Also, choose a Quality setting (1-12). Click on Run.