Learn your way! Get started

Web Graphics using PS CC, Part 3: Interactivity

with expert John Wiley & Sons

Watch trailer

Web Graphics using PS CC, Part 3: Interactivity Trailer

Course at a glance

Included in these subscriptions:

  • Creative Design Power Pack
  • Power Pack Plus

Release date Release date 4/9/2015
Level Level Intermediate
Runtime Runtime 1h 22m
Platform Platform Major browsers on Windows Major browsers on Windows Major browsers on Mac OSX Major browsers on Mac OSX Mobile Devices Mobile Devices
Published eBooks Published eBooks N/A
Hands-on labs Hands-on labs N/A
Sample files Sample files Included
Exams Exams N/A

Enterprise Solutions
Enterprise Solutions

Need reporting, custom learning tracks, or SCORM? Learn More

Course description

Master the ins-and-outs of creating web graphics using Photoshop CC in this 3 part learning series. The courses start with an overview of web file formats, and then dives into the optimizing settings for JPEGs, GIFs, and PNGs. You will also learn how to create slices for optimization and interactivity; creating buttons, and rollovers, and animating web graphics. The course concludes with automation techniques like batch processing and creating droplets.


This course assumes you have familiarity with Adobe Photoshop CC. This course is part of 3 part learning series, Web Graphics using Photoshop CC: Creating; Web Graphics using Photoshop CC: GIF, PNG, and Slices; and Web Graphics using Photoshop CC: Interactivity. Please be sure to view the courses in order if you are new to the material.

Meet the expert

John Wiley & Sons Our Creative Design courses are presented by experts from Wiley Publishing. Wiley is a global provider of knowledge and knowledge-enabled services that improve outcomes in areas of research, professional practice, and education. They are the publisher of award-winning journals, encyclopedias, books, and online products and services.

Course outline


Creating a Rollover Button (17:55)
  • Introduction (00:10)
  • Creating a Multi-state Button (03:43)
  • Adding Styles & Saving Files (02:40)
  • Using the Layers Panel (04:49)
  • Applying Effects to a Button (02:14)
  • The Bevel & Emboss Layer Style (04:07)
  • Summary (00:10)
Preset Styles & Saving for Web (12:58)
  • Introduction (00:10)
  • Preset Button Styles (02:56)
  • Applying Preset Styles (02:56)
  • Saving the Button Elements (04:07)
  • Using the Save for Web Feature (02:38)
  • Summary (00:10)
Animation for the Web (27:31)
  • Introduction (00:10)
  • Web Graphics for Animation (05:02)
  • Framed Based Animation (03:01)
  • Editing Individual Frames (02:55)
  • Timeline Based Animation (03:19)
  • Adding & Styling Layers (02:40)
  • Tweening Frames (02:03)
  • The Tween Dialog Box (03:39)
  • Optimize Animated GIFs (04:28)
  • Summary (00:10)
Actions & Droplets (24:12)
  • Introduction (00:10)
  • Creating an Action (05:22)
  • Record the Action (03:24)
  • Running a Batch Action (04:53)
  • Set Up & Execute the Batch (03:28)
  • Droplet Preliminaries (01:52)
  • Create the Droplet (04:52)
  • Summary (00:10)