From the course: Web Motion: Create an Animated Banner Ad
Unlock the full course today
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
PNG graphics creation in Photoshop - Edge Animate Tutorial
From the course: Web Motion: Create an Animated Banner Ad
PNG graphics creation in Photoshop
Based on our plan, we are going to need three images. Two of them, the leaves and the canvass, will be your basic bitmaps. And the third, that paintbrush, will need to have a transparent background. Now, before we get started, keep in mind, this is the web here, so file size matters. Never scale graphics in the browser. If a file is eight by 10 and 100 MB in size That whole amount gets loaded into the browser regardless of whether it is a full screen image or a scaled down in the browser. The best place to reduce file size is in imaging applications such as Photoshop. So let's get started. Navigate over to your exercises folder and open the autumn JPG found in the O2O3PMG folder. open it in Photoshop. And when it opens, you'll discover that, obviously, this image is way too large for a banner ad that will be 728 pixels wide and 90 pixels high. The plan is to leave about 100 pixels of space on the left for the logo. Which tells us the final image needs to be about 600 pixels wide by 90…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
Project overview and plan2m 20s
-
(Locked)
SVG graphics creation in Illustrator6m 35s
-
(Locked)
PNG graphics creation in Photoshop7m 25s
-
(Locked)
Assembly in Edge Animate7m 7s
-
(Locked)
Create a three-state button in Edge Animate7m 9s
-
(Locked)
Add interactivity in Edge Animate9m 26s
-
(Locked)
Test and output6m 21s
-