Welcome to WeetHet!


Managed Web Hosting by Liquid Web

Your IP address:
54.198.55.167
     
 
Print this page
- use Landscape
Search the
WeetHet Pages
WeetHet is being updated! - Current articles will slowly move to www.tweaking4all.com
For excellent webhosting that is reliable and affordable, we highly recommend: LiquidWeb

On this Page ...

Your first Animation with Photoshop ...

In this article, Ruben will show us how to make your first animation with Photoshop ...
This article is setup in a simple fashion so you can get some of the basics on how to get started making animations.

We use Adobe Photoshop and Adobe ImageReady for this article (ImageReady comes with Photoshop).

Have a guide you'd like to see here as well, feel free to email me text and images ... We'll put your name, alias, and/or website with it if you'd like!

Tekenen met Photoshop ...
by:
Ruben Bosch

Step By Step

We'll use the following animation to illustrate what to do to get an animation: a car moving over a street from right to left.

Tip: drawing an image like this can easily be done right away in ImageReady, but we'd like to use this approach later as a base for more complex drawings ...

Step 1. In Photoshop create a new document and use it to draw a picture of a landscape with road - dimensions of the image are not that important right now.

Landscape with a road on it ...
Landscape with a road on it ...

Step 2. Make a new layer for this document (menu: "Layer" - "New" - "Layer", or press SHIFT+CTRL+N). This is the layer we will use for the moving object. In our example; a car. Draw the car and make sure it kind-a matches the dimensions of your landscape.

Draw an object that should move, in our example a car
Draw an object that should move, in our example a car

Step 3. First save your drawing as a PSD file ("File" - "Save As") - give it a name so you can find it later. In the menu click "File"-"Edit in ImageReady" or press SHIFT+CTRL+M. Another Adobe program will now open with your drawing already in it; Adobe ImageReady. Here is where we can do our animating ...

Step 4. For animations we will need to open the Animation window. In the menu click "Windows"-"Animation".

Step 5. First we must move our car to it's start position. So we first need to select the proper layer, specifically with more complex animations, you might want to check if you're working with the right layer! Use the layer window to select the proper layer:

ImageReady - Select the right layer
ImageReady - Select the right layer

Step 6. Now we must define each individual animation step for our animation. We'd like to have the car move from right to left, so first move the car to the far right until it's almost not visible. Next follow the following cycle for each animation "step":

  • Click "Duplicate Current Frame"
    Click "Duplicate Current Frame
  • Select the new frame (thumbnail with the highest number)
  • Move the car a bit to the left

Repeat this until the car disappears on the left side.

The more times your repeat this cycle, the smoother the animation will go, but also the bigger the file will become.

Tip: Press "Play" every now and then to see what the animation looks like!
IF you try this, then don't forget that after pressing the "Stop" button, you must select the last frame before continuing the cycle.

Tip: Under each frame you will see a time: 0 sec. Click it to set the playback duration of this specific frame. You can also changes all frames at once by selecting all frames and change the time under one of the frames - all frames will now have the same new playback time.

Tip: When moving an object horizontally, or vertically, then try this: move the object and while holding the mouse button down press SHIFT as well, you'll see that the object will move in a straight line now.

Tip: In the lower left corner of the animation window, you will see "Forever" meaning that the animation will repeat endless. Click it to choose other options like Once, and Other (1 or more time).

Step 7. Happy with your animation? The first save it as a PSD file ("File"-"Save As"). For web-publication one would like to use the so called Animate GIF format instead. Choose "File"-"Save Optimized As". Type a filename and select type (usually "Images Only"). This is an example of our work:

The result of this tutorial
The result of this tutorial



 

 


Klik hier om te wisselen naar nederlandstalige pagina's You are currently on the English pages.
Help & AboutWelcome ... !!GuestbookWeetHet HelpGlossary ...Searching the InternetSearching WeetHetAvailable downloadsNews & UpdatesStatisticsDisclaimer!AdvertisingJoin us !!!AwardsAbout WeetHet ...Hansie goes USAWhere is Hansie?First monthsMy new homeGoing outPuck goes USAMy new carSnapshots PuckRandom snapshotsFinally: Spring!Nice warm summerFirst Family visit!CD's and DVD'sMusicAudio-DVD to MP3Music CD to MP3Music CD to WAVCopy Music CDYour own Music CDMusic from the InternetChanging MP3 VolumeNero Burning RomBurn BIN/CUE filesConvert BIN to ISOComputer CDRomBurn ISO filesPhoto VCDPhoto SVCDNero vs Nero ExpressNRG to ISOBurn SVCDSVCD with menuBurn VCDVCD with menuDVD VideoWhat are RegionCodes?What is MacroVision?Video formatsDIKO: 3 AVIs - 1 DVDHow does a CD work?How to burn a CDCreating a DVDConvert BIN to ISONRG to ISOCreating a disk catalogComputer InfoHow does a CD work?Netiquette: E-MailWhat is DivX?What is MP3?What is RAID?What is USB?What are PAR files?Wireless LAN introPC to TV cablesStart XP fasterBoot from USB driveFireWire connect 2 PC'sPhoto SizingGraphics / PhotosPhotoshopPhoto SizingFast car3D buttonsDraw lightningPhotos on CDPictureToTVVideoCD with NeroSVCD with NeroMagix Pictures on CDDVD PictureShowPhoto SizingPhoto SizingGSM / PDAsCompaq iPAQReplace batterySerial craddle to USBGarmin eTrex cableGarmin eTrex plugRound Garmin plugPalmPilotConnect Ericsson GSMGarmin eTrex GPSMobile phonesEricsson RingtonesMusicBoxRingtonesMasterA edit SIMSMSC numbersConnector pinoutsHardware & HacksOverclocking CPU'sGenericAMD CPU codesAMD Slot-AAMD Socket-AProgr. SmartcardsMillenniumAlcatel HackLCD display to PCNetwork cablesBoot from USB drivePC to TV cablesPromise Ultra -> RAIDSoundblaster MIDIResistor colorcodeFireWire NetworkInternetNetwork genericEnabling DHCPWin95/98/ME ClientWin2000/XP ClientMac OS 7/8 ClientMac OS X ClientWell known IP-portsDNS addressesNetwork cablesWireless LAN IntroFireWire NetworkDialup connectionTCP/IP optimized for Win9xPublic IP Address?ADSL / MxStreamADSL in generalHow ADSL worksDNS addressesMXStreamInstallingPSTN EthernetISDN EthernetRouter for MXStreamSMC 7404 WBRA/BeTech ModemRoutereTech RouterSitecom 4S routerVigor 2200E routerSolving problemsAlcatel HackHack the modemPassword CalculatorPurpose of the LEDsSolving problemsFirmware upgradeDNS addressesWell known IP-portsMapping PortsAutoPortMappingConnection sharingPossibilitiesWinRoute (software)Network Win95/98/MENetwork Win2000/XPNetwork Mac OS 7/8Network Mac OS XWell known IP-portsWireless LAN IntroNetwork cablesRoutersSMC 7404 WBRA/BeTech ModemRoutereTech RouterSitecom 4S routerVigor 2200E routerInternet by SatelliteHow does it work?Brief intro ...Overview variantsStandardBySky methodTwo-Way InternetInstalling cardsWhich satellite-card?PC requirementsHarmonic CyberstreamPentam. Pent@VisionHauppauge DVBs NexusTechnotrend PCLineEOL problemsNew driversMounting a dish (Astra)Dish size?EON ChecklistTransponders EOLRamdisk for FazztYour own webpageNavigation solutionsInsight and solutionsApyCom apPopupMenuD.Binard PopupMenuPopupMenu generatorPopupMenu flatTips and TricksE-Mail linkE-Mail FORMBookmark this pageIcon for my webpage'Page back' link?Jumping within a pageEscape from framesUse frametitleControlling framesAuto redirectFixing 100% problemChange link colorText in the statusbarFixed backgroundText over imagesBrowser safe colorsUsing the .htaccess fileSpecial charactersWhere to downloadIRC using mIRCInstalling mIRCDownload Movies etcFAQMovies from InternetMovie QualityWhat are PAR files?LeechGuyLeechGuy editoreMuleWinMXE-MailNetiquetteQuote of the dayMiscellaniousHack Arescom NetDSLWireless LAN IntroFireWire NetworkWell known IP-portsWhat is my IP Address?Search (WeetHet)Searching (Internet)WeetHet DownloadsA few great websitesDNS addressesMicroControllersBasic Stamp IIStarting with the BS2Assembling the kitFullsize scematicsConnection to your PCBS2 to 44780 LCD44780 LCD SnapshotsBS2 to M50530 LCDM50530 SnapshotsHomebrew BS2Smartcards/SIMProgrammer Softw.CardMasterInfinityUSBMasterBurnerMilleniumCard TypesEdit GSM SIMResistor colorcodeMusic / AudioMusic from InternetIntroductionLeechGuyLeechGuy editorWinMXeMuleUsing mIRCBurn BIN/CUE filesConvert BIN to ISOAudio-DVD to MP3How does a CD work?Copy music CDYour own music CDWhat is MP3?Music CD to MP3MP3 CD for Yamakawa?Changing MP3 VolumeMusic CD to WAVSB MIDI interfaceAC3 to WAV/MP3ProgrammingBorland DelphiHansies Delphi ToolsAYeah!CatalogQuote of the dayPopupMenu generatorOverview ASCII chars.Satellite (TV & GPS)Satellite TelevionSatellite TV on the PCTV reception on your PCPC requirementsNew driversPentam. Pent@VisionHauppauge DVBs NexusTechnoTrend PCLinePVA file to MPEG2DirecTV TiVoRemote ControlDirecTiVo to OS6.21: Intro & Images2: TiVo disk in PC3: Install OS 6.24: OS6.2 first start5: SuperPatch & More6: Recordings to PCTyTools - Movies to PCOld: DirecTiVo to OS4Old: Sleeper HackSmartcardsProgrammer Softw.CardMasterInfinityUSBMasterBurnerMilleniumCard TypesWhat is DiSEqC?Mounting a dish (Astra)Dish sizeSRT8000 firmwareGPS NavigationGarmin eTrexDiagnostic modeSerial connectionConnect to iPAQ 36/38xxConnect to PalmPilotThe eTrex connectorThe round connectorHow GPS worksGeoCaching explained ...Internet by SatelliteHow does it work?Brief intro ...Overview variantsStandardBySky methodTwo-Way InternetInstalling cardsWhich satellite-card?PC requirementsHarmonic CyberstreamPentam. Pent@VisionHauppauge DVBs NexusTechnotrend PCLineEOL problemsNew driversMounting a dish (Astra)Dish size?EON ChecklistTransponders EOLRamdisk for FazztVideoVideo guide - start hereIntroductionGSpot: AVI InfoDIKO: 3 AVIs - 1 DVDDownload QualityVideo in generalWhat is DivX?Video formatsRecording TypesWhich AVI codecs?Intro K(S)VCD/KDVDDVD+RW IssuesAbout bitratesVideoServer pluginWhat are RegionCodes?What is MacroVision?RippingAudio-DVD to MP3Photo SizingAVI to MPEGGSpot: AVI InfoDIKO: 3 AVIs - 1 DVDAVI to DVD/(S)VCDWithout SubsD.I.K.O.MainConcept (S)VCDNero Vision Express 2TMPGEnc (S)VCDTMPGEnc K(S)VCDTMPGEnc with AC3With SubTitlesD.I.K.O.MainConcept (S)VCDNero Vision Express 2TMPGEnc (S)VCDTMPGEnc K(S)VCDTMPGEnc with AC3Burning CD NeroBurn VCDVCD with menuBurn SVCDSVCD with menuBurn BIN/CUE filesDVD PlayersCompatibilityAdd DVD playerDVD+RW IssuesIntro K(S)VCD/KDVDVideo ToolsBitrate CalulatorDVD RippingGSpot: AVI InfoFlaskMPEG and CCEVideoServer pluginDVD to DivXIntroductionCalculating bitratesRippingDVDx and SmartRipperDVDx settingsFlaskMPEG method 1FlaskMPEG method 2FlaskMPEG method 3DVD to (S)VCDIntroductionCalculating bitratesRippingDVDx and SmartRipperDVDx settingsFlaskMPEG 0.6 and CCEDVDx and Video ServerDivX to (S)VCDDVD to DVDDVD2OneDVDShrinkDVD+RW IssuesTMPGEnc & CoDIKO: 3 AVIs - 1 DVDMovie Cut & PasteGSpot: AVI InfoMergingMPEG1 and MPEG2Using TMPGEncWomble MPEG2VCRAVI with VirtualDubCuttingNewWith TMPGEncWomble MPEG2VCREasy Video SplitterAVI en DIVXAVI with VirtualDubEasy Video SplitterMovies from InternetIntroductionLeechGuyLeechGuy editoreMuleWinMXUsing mIRCWhat are PAR files?Burn BIN/CUE filesConvert BIN to ISOPictures on CDPictureToTVVideoCD with NeroSVCD with NeroMagix Pictures on CDDVD PictureShowRipping SubtitlesVobsub: fast and easy!SubRip (OCR)Sync subtitlesDisplaying subtitlesDisplaying with VobSubSync subtitlesCreate a MicroDVDPC connected to TVPC to TV cablesATI softwarenVidia softwareTiVo - Harddisk VCRTiVo Series 1What is a TiVo?Opening a TiVoSerial accessDebug Mode accessLinux Bash shellSet the clockDisable dialupDirecTV TiVoRemote ControlDirecTiVo to OS6.21: Intro & Images2: TiVo disk in PC3: Install OS 6.24: OS6.2 first start5: SuperPatch & More6: Recordings to PCTyTools - Movies to PCOld: DirecTiVo to OS4Old: Sleeper HackYamakawa 713/715IntroductionFAQThe Remote ControlSecret codesSet regioncodeSet regionfreeDisable MacroVisionFactory-settingsWhich DVDRom driveFirmware versionChange firmwareDownload firmwareChange backgroundCreate MP3 CDM.U.F.Y. MP3 CD'sHelpForumSearch (WeetHet)Search (Internet)News & UpdatesGlossary ...DownloadsLinksStatisticsAdvertisingJoin us !!!Guestbook

Liquid Web Fully Managed Web Hosting