Developing Webs logo
Google
Web DW-Main DW-Photoshop
Visit the message board for solutions or post a question Check out the Classes offered for free at Developing Webs Voice Chat submit a tutorial, resources, article, font for publication consideration and earn a one way link back to your site Get more specifics about the Developing Webs Voice chat room and its room members View the current news at Developing Webs alternative sites which are resources for your d3evelopment needs Join Developing Webs Chat Link to us on your web page to help support this resource! Check out Developing Webs At yahoo groups! Developing Webs Home Adobe Photoshop Tutorials Macromedia Flash Tutorials Jasc Paint Shop Pro Tutorials Adobe Illustrator Animation basics Some Basic PHP tutorials Perl Tutorials HTML Tutorials Cascading Style Sheets javascript Front Page Tutorials Macromedia Dream Weaver Tutorials dreamweaver Publishing your site, FTP, ChMod, Promotions Tools to help you create your site Free and shareware fonts to download Photographs to use in your projects Shop for your site needs Free Online classes REcommend this site to others Log in or edit your information when logged in Developingwebs Log Out Change My Account details and preferences
RSS Newsfeed
for your site
DW News
Calendar
DW Forum
Right click on button and copy shortcut

Add to My Yahoo!

Reminder
Remember to book mark this site!



Request a Tutorial

Animating an Oscilloscope Screen

1. Open the source image called scope3.gif. Click Image=> Mode=> RGB

2. Insert a layer. Click Edit=> Fill and select pattern. Select your "square 10" Grid from the square grid pattern tutorial. Set to 50% opacity and click ok.

3. Click Filter=> distort=> Polar coordinates. Select rectangular to polar.

4. Duplicate your background. Set your default colors by hitting your d key. ON the background copy layer Click Filter=> Artisitic=>Neon Glow

  • size= 5
  • Glow Brightness = 15
  • Color = hex #CCFFCC

5. Click on your top layer with the grid. Add a new layer. Select the oval marquee tool and draw a circle from top left corner to the bottom right corner.

6. Click Select=> inverse. Click Edit=>Fill and select foreground color at 100%.
7. Insert 8 layers on top. name them frame 1, frame 2, frame 3, frame 4, frame 5, frame 6, frame 7, frame 8.

8. Select your gradient tool. Set the gradient to be black to clear, Angle Gradient, 75% opacity.

Draw the following gradients:

Frame 1: Draw your gradient from center down to the center bottom.

Frame 2: Draw gradient from center to lower left corner.

Frame 3: Draw gradient from center to center left

Frame 4: Draw gradient fromcenter to upper left corner.

Frame 5: Draw gradient from center to center top

Frame 6 Draw Gradient from Center to Upper right corner.

Frame 7 Draw Gradient from center to center right side.

Frame 8 Draw gradient from center to lower right.

9. Turn off all your gradient layers but Frame 1. Click the button on the bottom of your tool bar to Jump to Image Ready.


10. Bring up the animation panel where you will find animation frame 1. Set the time to 0.2 seconds.

11. On the animation panel, Insert a new frame(2). Turn off the layer-frame1 and turn on layer frame2.

12. On the animation panel, Insert a new frame(3). Turn off the layer-frame2 and turn on layer frame3.

13. On the animation panel, Insert a new frame(4). Turn off the layer-frame3 and turn on layer frame4.

14. On the animation panel, Insert a new frame(5). Turn off the layer-frame4 and turn on layer frame5.

15. On the animation panel, Insert a new frame(6). Turn off the layer-frame5 and turn on layer frame6.

16. On the animation panel, Insert a new frame(7). Turn off the layer-frame6 and turn on layer frame7.

16. On the animation panel, Insert a new frame(8). Turn off the layer-frame7 and turn on layer frame8.

 

 

 

 


"Building The Web Into a Nicer Place -- One Site At A Time"
Developing Webs Group Copyright © 2001-2009 All Rights Reserved
Privacy and Legal