Animating Gradients for 3D Look and Feel

Show:

CodeDependent

Products Covered:

Save

Translations

Was this episode helpful?

Yes No

About This Episode

Former Adobe Flex SDK team member Chet Haase explores using a graphical object as a button and various ways of animating its look as you click on it to get a smooth 3D-like interaction.

Show More Details

More Episodes

Comments

Episode Title	Runtime	CC	Products Covered	My Library
Image Zoom Effect in Flex 4 Image Zoom Effect in Flex 4 Chet demonstrates an effect that you can use to zoom in on details of an image while switching between thumbnail and high-resolution versions of the image. Runtime: 00:06:18 Added: June 24, 2010 Views: 10,391	00:06:18
Animating Filters in Flex 4, Part II Animating Filters in Flex 4, Part II In this sequel to the previous episode, Chet shows how to use the Animate effect in Flex 4 to animate filters that persist on an object after the animation is finished. Runtime: 00:05:37 Added: June 17, 2010 Views: 1,944	00:05:37
Animating Filters in Flex 4, Part I Animating Filters in Flex 4, Part I Chet demonstrates how to use the new AnimateFilter effect in Flex 4 to animate transient filter effects such as blurring objects out. He also shows when AnimateFilter is not the right tool for the job. Runtime: 00:07:50 Added: June 10, 2010 Views: 4,575	00:07:50
3D Distortion in Flex and Flash 3D Distortion in Flex and Flash Chet explains how scaling artifacts can sometimes distort the visuals when using the 3D capabilities of Flex and the Flash Player, and how you can avoid these problems. Runtime: 00:05:16 Added: June 03, 2010 Views: 2,828	00:05:16
Easier, Better Transitions in Flex 4 Easier, Better Transitions in Flex 4 Transition effects rely on state information to specify the values to animate between. You can hard-code these values in the effects, but in this episode Chet shows why you should avoid doing so. Runtime: 00:06:15 Added: May 26, 2010 Views: 3,108	00:06:15
Flex 4 States and Transitions Flex 4 States and Transitions Chet shows how the simple state syntax in Flex 4 makes state code easier to write and read. He also highlights how transitions can create a more engaging experience when changing application states. Runtime: 00:06:36 Added: May 20, 2010 Views: 6,882	00:06:36
The Path Object in Flex 4 The Path Object in Flex 4 Flex 4 provides the tools you need to create custom graphics. In this episode, Chet explains how to utilize the Path object and mouse events to create a simple drawing application. Runtime: 00:06:55 Added: May 13, 2010 Views: 2,369	00:06:55
Creating a Reflection Container in Flex 4, Part II Creating a Reflection Container in Flex 4, Part II In this sequel to the previous episode, Chet shows how to create a better reflection effect in Flex 4 with an alpha mask to make it more realistic. Runtime: 00:05:58 Added: May 06, 2010 Views: 3,260	00:05:58
Creating a Reflection Container in Flex 4, Part 1 Creating a Reflection Container in Flex 4, Part 1 Chet shows how to create a container in Flex 4 that displays an image and a simple reflection of that image. Runtime: 00:03:27 Added: April 29, 2010 Views: 4,025	00:03:27
Event Performance in Flex Event Performance in Flex Former Adobe Flex SDK team member Chet Haase shows how to use the updateAfterEvent() function to get better UI performance for time-sensitive events such as mouse movement and timers. Runtime: 00:06:31 Added: April 01, 2010 Views: 1,832	00:06:31
Using Libraries in Flash Pro Using Libraries in Flash Pro In a continuation from a previous show, Chet imports his Flex-less animation library into Flash Pro and creates a Flash application with it. Runtime: 00:06:38 Added: March 18, 2010 Views: 1,008	00:06:38
Creating a Reusable Flash Animation Library Creating a Reusable Flash Animation Library Former Adobe Flex SDK team member Chet Haase discusses how to build a reusable animation library in Flash Pro that can be used in Flash and Flex applications. Runtime: 00:07:50 Added: March 04, 2010 Views: 2,085	00:07:50
The Animation Class in Flex 4 The Animation Class in Flex 4 In this video, Chet shows how to use the Animation class, which is the timing engine used internally by Flex 4 effects. Runtime: 00:05:38 Added: February 25, 2010 Views: 5,585	00:05:38
Keyframe Animation in Flex 4 Keyframe Animation in Flex 4 Former Adobe Flex SDK team member Chet Haase explains how to create more complex animations by using keyframes to define multiple intervals in each motion path. Runtime: 00:05:38 Added: February 18, 2010 Views: 3,658	00:05:38
Simple Container Effects, Part 2 Simple Container Effects, Part 2 Former Adobe Flex SDK team member Chet Haase shows a better way to animate adding and removing items from a VBox container in Flex 3 by using a technique from Flex transitions. Runtime: 00:08:49 Added: February 11, 2010 Views: 1,182	00:08:49
Simple Container Effects, Part 1 Simple Container Effects, Part 1 Former Adobe Flex SDK team member Chet Haase answers a question posted on his blog about how to animate adding and removing items from a VBox container in Flex 3. Runtime: 00:06:41 Added: February 04, 2010 Views: 1,423	00:06:41
Auto-Reversing Transitions in Flex 4 Auto-Reversing Transitions in Flex 4 Former Adobe Flex SDK team member Chet Haase shows how to use the new “autoReverse” property of Transition to get a better user experience for Flex 4 transition effects. Runtime: 00:08:11 Added: January 28, 2010 Views: 1,963	00:08:11
Animating Gradients for 3D Look and Feel Animating Gradients for 3D Look and Feel Former Adobe Flex SDK team member Chet Haase explores using a graphical object as a button and various ways of animating its look as you click on it to get a smooth 3D-like interaction. Runtime: 00:06:15 Added: January 21, 2010 Views: 2,603	00:06:15
Animating Button State Changes Animating Button State Changes The tutorial about component state feedback continues as former Adobe Flex SDK team member Chet Haase details how to add animations to a button’s skin to provide animate changes between skin states. Runtime: 00:06:45 Added: January 14, 2010 Views: 1,769	00:06:45
Visual Component State Feedback Visual Component State Feedback A component can change its look between different states, like when the mouse is over it. In this video, former Adobe Flex SDK team member Chet Haase shows how Flex buttons do this to provide important visual cues to the user. Runtime: 00:06:32 Added: January 07, 2010 Views: 951	00:06:32
Animating a TextArea Animating a TextArea Former Adobe Flex SDK team member Chet Haase explains how to animate scrolling for a TextArea component using some simple ActionScript code to create and play animations. Runtime: 00:05:36 Added: December 17, 2009 Views: 2,619	00:05:36
Programmatic Scrolling Animation Programmatic Scrolling Animation Former Adobe Flex SDK team member Chet Haase walks you through an application that animates a scrolling behavior. Animations happen automatically when you click on a scrollbar’s track or up/down buttons, but this case requires custom code. Runtime: 00:03:06 Added: December 10, 2009 Views: 2,066	00:03:06
Measuring Frame Rate Performance Measuring Frame Rate Performance Former Adobe Flex SDK team member Chet Haase demonstrates techniques of measuring the performance of animations, and shows how the performance of effects, render events, and the SWF frame rate relate to each other. Runtime: 00:08:32 Added: December 03, 2009 Views: 1,150	00:08:32
Transitions and Easing in Flex Transitions and Easing in Flex Flex makes it easy to create animated transitions, helping the user understand what is happening in the UI. Former Adobe Flex SDK team member Chet Haase shows how transitions and easing behavior improve the user experience. Runtime: 00:07:33 Added: November 19, 2009 Views: 3,654	00:07:33
Interactive GUI Components Interactive GUI Components In this video, former Adobe Flex SDK team member Chet Haase takes a look at some of the techniques used in gaming consoles to achieve highly interactive and fun user experiences. Runtime: 00:07:42 Added: November 12, 2009 Views: 7,546	00:07:42
Animated Scrollbar and Slider in Flex 4 Animated Scrollbar and Slider in Flex 4 Chet Haase, formerly of the Adobe Flex SDK Team, demonstrates the new animated behaviors in the Flex 4 scrollbar and slider components. Runtime: 00:05:40 Added: November 05, 2009 Views: 8,623	00:05:40
Resize Adobe AIR Windows through Custom Flex 4 Eff... Resize Adobe AIR Windows through Custom Flex 4 Effects Interpolation Former Adobe Flex SDK team member Chet Haase shows how to use the new custom type interpolation abilities in Flex 4 effects for better animated resizing effects on the window of an Adobe AIR application. Runtime: 00:06:59 Added: October 29, 2009 Views: 4,556	00:06:59
Custom Type Interpolation in Flex 4 Effects Custom Type Interpolation in Flex 4 Effects In this video, former Adobe Flex SDK team member Chet Haase explores interpolation arbitrary types in Flex 4 effects, and explains how to use the new IInterpolator interface to create custom interpolators. Runtime: 00:09:24 Added: October 22, 2009 Views: 1,553	00:09:24
Custom Easing in Flex 4 Custom Easing in Flex 4 Chet Haase, formerly of the Adobe Flex SDK team, shows how to create and use custom easing functions with Flex 4 effects which allows for new and interesting timing behavior for animations. Runtime: 00:09:34 Added: October 08, 2009 Views: 1,514	00:09:34
3D in Flash Player 10 and Flex 4 3D in Flash Player 10 and Flex 4 Former Adobe Flex SDK team member Chet Haase demonstrates Flash Player 10 and its ability to position and transform objects in 3D – then showcases this capability using new effects in Flex 4. Runtime: 00:05:41 Added: September 17, 2009 Views: 7,018	00:05:41
Shader Transitions in Flex 4 Shader Transitions in Flex 4 Former Adobe Flex SDK team member Chet Haase explores the new Pixel Bender-based effects in Flex 4, such as CrossFade and Wipe. Learn how to use these effects to create cool transitions in your Flex 4 applications. Runtime: 00:06:35 Added: September 17, 2009 Views: 2,858	00:06:35
Pixel Bender Shaders and Flex 4 Pixel Bender Shaders and Flex 4 Former Adobe Flex SDK team member Chet Haase continues his exploration of the new Pixel Bender-based effects in Flex 4, this time focusing on Shaders. Runtime: 00:07:39 Added: September 03, 2009 Views: 2,809	00:07:39
AnimateFilter Effect in Flex 4 AnimateFilter Effect in Flex 4 Former Adobe Flex SDK team member Chet Haase demos the new AnimateFilter effect, which allows you to animate the properties of Flex filters over time to create rich animations for your Flex application. Runtime: 00:04:43 Added: August 27, 2009 Views: 2,586	00:04:43
Transform Effects in Flex 4 Transform Effects in Flex 4 Former Adobe Flex SDK team member Chet Haase explains how the new transform effects work in Flex 4 and how Move, Scale, and Rotate combine their operations internally to result in the correct behavior. Runtime: 00:05:47 Added: September 24, 2009 Views: 2,129	00:05:47
Fade Effect in Flex 4 Fade Effect in Flex 4 This effect exists in Flex 3, but the Flex 4 beta version includes more logic to automatically handle different situations of fading. Runtime: 00:05:42 Added: August 13, 2009 Views: 2,358	00:05:42
Animate Color in Flex 4 Animate Color in Flex 4 Follow along with former Flex SDK team member Chet Haase and explore the new AnimateColor effect, which allows you to easily add color values in gradients to achieve interesting visual effects. Runtime: 00:05:34 Added: August 06, 2009 Views: 1,346	00:05:34
Animate Effect in Flex 4 Animate Effect in Flex 4 In this video, former Adobe Flex SDK team member Chet Haase explores the new Animate effect in Flex 4. This effect can handle animating multiple properties of arbitrary type and is the superclass of all the new effects in Flex 4. Runtime: 00:06:45 Added: July 30, 2009 Views: 1,520	00:06:45
Color My World Color My World Former Adobe Flex SDK team member Chet Haase introduces the color animation effect in the next version of Flex. He then compares RGB interpolation and HSB interpolation to find out which provides better color interpolation behavior. Runtime: 00:10:01 Added: July 23, 2009 Views: 443	00:10:01
Faster than a Speeding Button Faster than a Speeding Button Former Adobe Flex SDK team member Chet Haase adds lifelike motion to GUI objects, using traditional animation techniques of anticipation, follow-through, and motion blur. Runtime: 00:10:18 Added: July 16, 2009 Views: 689	00:10:18
Stretch and Squash in Flex 4 Stretch and Squash in Flex 4 In this episode, former Adobe Flex SDK team member Chet Haase highlights the ease of creating realistic animations and sequential motion effects in the next version of Flex. Runtime: 00:09:42 Added: July 10, 2009 Views: 5,081	00:09:42
Bouncing Ball Behavior Bouncing Ball Behavior In this episode, former Adobe Flex SDK team member Chet Haase explains how to add a bouncing effect to a ball. See how easing functions give a realistic look to an animated object’s movement. Runtime: 00:06:10 Added: June 18, 2009 Views: 1,368	00:06:10
Easing Does It Easing Does It Different visual effects require different motion. Former Adobe Flex SDK team member Chet Haase shows how to incorporate realistic movement into your animations by using various easing functions in Flex 3. Runtime: 00:06:13 Added: June 05, 2009 Views: 673	00:06:13
A Moving Comparison A Moving Comparison In this video, former Adobe Flex SDK team member Chet Haase demonstrates and compares how a simple animation effect is constructed both in Flex 3 and in the next version of Flex, codenamed Gumbo. Runtime: 00:05:49 Added: May 21, 2009 Views: 324	00:05:49

Suggested Episodes

Next episode in this show

Animating Button State Changes

CodeDependent

Products Covered:

Other Suggested Episodes

Flex Community Summit Wrap Up

Flex Community Summit: December 2011

Products Covered:

Brainstorm Future Flex Contributions

Flex Community Summit: December 2011

Products Covered:

Open Discussion about Falcon and FalconJS

Flex Community Summit: December 2011

Products Covered:

Forward-Looking Investments

Flex Community Summit: December 2011

Products Covered:

What it means to be an Apache Project - Part 2

Flex Community Summit: December 2011

Products Covered:

Products used in this episode

Flex SDK

Try Learn More

Related Shows

ActionScript 1:1 with Doug Winnie

In this series, Doug Winnie shows you how to get up and running with ActionScript. Learn how to use ActionScript to manipulate objects, create event handlers and timers, and create a simple project.

Recent Episodes

Setting Initial Values to Class In...