From the course: Productivity Tips for Web Designers
Unlock the full course today
Join today to access over 22,400 courses taught by industry experts or purchase this course individually.
Creating animated GIFs for memes and banner ads
From the course: Productivity Tips for Web Designers
Creating animated GIFs for memes and banner ads
- Hello everyone, this is Sue Jenkins with productivity tips for web designers. Today I'll show you how to quickly create custom animated GIFs for your memes and banner ads. Animated GIFs are simple frames based animation files that will play automatically when viewed in a browser window. The concept behind how they work is simple. By displaying a series of images on different layers, within the same file, the animated GIF gives the illusion of movement by showing each image within the series for a set number of seconds. Essentially, it's the equivalent of a time delayed digital flipbook. There's quite a bit of controversy about how to pronounce this file format. Most people call the non-animated version a GIF with a soft G like giraffe, while the animated version is better known as GIF, with a hard G like gift. So since we're talking about the animated version here, we'll call it a GIF with a hard G. Animated GIFs use a timeline to show each frame in the animation. The timeline can…
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.
- 01_01_MakingBlogHeadlinesPop.zip
- 01_02_block_quotes.zip
- 01_04_pairingfonts.zip
- 01_05_linkstyles.zip
- 01_06_Readability.zip
- 02_01_Rulers_Grid_Guides.zip
- 02_02_Shadow_Effects.zip
- 02_03_Type_Shapes.zip
- 02_04_AIWebSetup_Layout_Outlines.zip
- 02_05_AI_Symbols.zip
- 02_06_AI_TextFormattingForTheWeb.zip
- 02_07_AI_GraphicStyles.zip
- 02_08_AI_WorkingWithTextures.zip
- 02_09_AI_TheArtofRoundingCorners.zip
- 02_10_AI_UsingTextWrapAsPadding.zip
- 03_01_Grabbing_Measurements.zip
- 03_02_SmartFilters.zip
- 03_03_Content_Aware_Scale.zip
- 03_05_SamplingColors.zip
- 03_06_Resize.zip
- 03_07_ColorTinting.zip
- 03_08_QuickTeethWhitening.zip
- 03_09_Levels.zip
- 03_10_Optimize.zip
- 04_01_GoogleFonts.zip
- 04_02_bootstrap.zip
- 04_03_master_css.zip
- 04_04_CSSShadows.zip
- 04_05_repeat.zip
- 04_06_TwoMinRotate.zip
- 04_07_stitchedborder.zip
- 04_08_dropcaps.zip
- 04_10_CSSRoundingImages.zip
- 04_09_entities.zip
- 04_11_textselectioncolor.zip
- 04_12_tintedimagerollovers.zip
- 05_02_Externalize_CSS_JS.zip
- 05_04_CodeCleanup.zip
- 05_05_about_fix.zip
- 05_06_validation.zip
- 05_07_CheckingLinks.zip
- 05_08_5_8_Using_Snippets.zip
- 05_09_5_9_EasyPopups.zip
- 05_10_5_10_HideShow.zip
- 05_11_about.zip
- 05_12_SEOchallenge.zip
Contents
-
-
-
-
-
Grabbing measurements to speed up your workflow5m 29s
-
Editing nondestructively with Smart Filters7m 27s
-
Using content-aware scaling for photos on the web7m 53s
-
Advanced tips for sampling colors6m 53s
-
Best practices for image resizing6m 53s
-
Tinting images using one or two tones5m 45s
-
Tricks for quick teeth whitening3m 47s
-
Balancing color and tone using levels8m 33s
-
Choosing the right file format when optimizing web images7m 46s
-
Creating animated GIFs for memes and banner ads7m 28s
-
Pulling the text from images with OCR4m 3s
-
Making oddly sized images work in your layout5m 14s
-
-
-