How to Use Artboards in Photoshop (UX / UI / Web Design in Photoshop)

▶ Download the practice files for this tutorial (free with a PHLEARN account): https://phlearn.com/tutorial/use-artb... Artboards are one of Photoshop's best-kept secrets for UX, UI, and web designers, letting you preview and design your layouts across multiple devices, like a 27" iMac, a 15" MacBook Pro, and an iPhone, all within a single document. We're walking through creating artboards from scratch, arranging Smart Objects so nothing loses resolution as you resize, and using linked Smart Objects so a single logo update automatically applies across every device layout at once. CHAPTERS 00:00 What Artboards Are Used For 02:33 Creating Your First Artboard 06:20 Working with Smart Objects 09:36 Selecting and Positioning Layers 12:02 Duplicating Artboards for New Devices 14:50 Redesigning Layouts Per Device 17:33 Stacking Elements for Mobile 20:06 Linking Smart Objects Across Artboards 22:47 Updating a Linked Logo Live 25:30 Exporting Your Finished Artboards THE STEPS 1. Go to File, then New, and choose Artboard as the document type to pick a device size like a 27" iMac 2. Convert your design layers to Smart Objects so they can be resized without losing resolution 3. Duplicate your artboard (hold Alt/Option and click a plus icon) to create versions for other devices 4. Open Window, then Properties to change each new artboard's size to a 15" MacBook Pro or an iPhone 5. Rearrange and resize your layout for each device, stacking elements as needed for narrower screens 6. Use File, then Place Linked to add a shared element like a logo that updates across every artboard when the original file is saved 7. Export finished artboards with Quick Export, Export As, or File, then Export, then Artboards to Files or PDF Get the full step by step breakdown here: https://phlearn.com/tutorial/use-artb... ― PHLEARN PRO: every PRO tutorial, one membership ◦ 200+ in-depth courses and masterclasses on Photoshop, Lightroom and photography ◦ 1,000+ downloadable PSDs, RAW images and sample files to follow along ◦ Presets, Photoshop actions and LUTs included ◦ New PRO tutorials every month, streamed in 4K with captions and chapters ◦ Rated 4.93/5 by 3,900+ students ◦ Cancel anytime, 100% money-back guarantee ▶ https://phlearn.com/pro ――――――――――――――― Follow PHLEARN: Instagram:   / phlearn   Facebook:   / phlearn   Twitter:   / phlearn   #Photoshop #Artboards #WebDesign