Archive for March, 2012

March 16, 2012

Edge Preview 5.1 Now Available

Today we released a minor but important update – Adobe Edge preview 5.1. Preview 5.1 fixes 2 bugs that were reported by users that we felt were important to fix.

The first concerns a “blank” error dialog that is displayed when deleting an image from the images folder while still referencing the image from the composition.

The second is an issue where existing HTML files that contained unclosed <li> tags would not be displayed correctly.

Both are now fixed, and you can download the update from the Edge page on Adobe Labs.

4:21 PM Permalink
March 13, 2012

Preview 5: Timeline Updates

Since Preview 4 in January, we’ve made a lot of tweaks and improvements to Edge’s timeline.

Here’s the Preview 5 timeline. Click to cycle between Preview 5 and Preview 4.

Preview 5 (click image to cycle between Previews 4 & 5)

We refined and tighted up the visuals quite a bit. Some of these changes are cosmetic, and some have functional motivations. For example, the ruler is 10px shorter, which frees up room for (most of) another lane in the timeline proper. We’ve added some color: the Pin (more on that shortly) is blue and the Playhead is gold. The layout of the eyeball and lock buttons now matches the layout of the Elements Panel.

New and Changed Controls

With the Edge UI, we try to walk the line between simplicity and control, so there’s a lot of debate before we add new timeline controls. Preview 5 adds a few controls: Easing (with no selection, this button sets the default easing for new transitions; with transitions selected, it edits their easing); Toggle Pin; Expand/Collapse Lanes; Insert Label; and Snap On/Off.

Snap On/Off is tucked at the bottom left of the timeline, along with Only Show Animated Elements.

We sort of inverted the Generate Smooth Transitions mode and button: We replaced Generate Smooth Transitions with an Instant Transitions mode and button (the button with the hollow diamond; a hollow diamond represents an instant transition). This command’s hotkey is I.

The Pin

We renamed “the Mark” to “the Pin” this release, and improved it in a number of ways. This feature is the fastest way to create animations in Edge — you get two keyframes with a single edit, and spend less time moving the Playhead around and dropping keyframes. But the Pin is unique to Edge, and surfacing it has been tricky. These latest changes help, but you may need to play with the feature for a few minutes to get a feel for it. Mark Anders’s Introducing Adobe Edge Preview 5 video includes a good introduction to the Pin.

Visually, the Pin is more important now — it’s positioned above the Playhead, and when active, it’s blue. The Region between the Playhead and Pin is rendered in one of two colors: gold for a “forward” animation, blue for a “backward” animation, along with subtle arrows that indicate direction.

Pin interactions are improved too. In Preview 4, clicking and dragging the Mark would activate it and drag it away from the Playhead. We saw new users do this unknowingly, when they intended to move the Playhead. So now the Pin is attached to the Playhead until you explicitly activate it. There are a number of ways to toggle the Pin: double-click the Pin or Playhead; the Pin button on the timeline; menu — Timeline/Toggle Pin; hotkey — P.

We also added Flip Playhead and Pin (hotkey Shift-P), which exchanges the location of the Playhead and Pin.

Ghost Pin + Playhead, and the Return Command

After creating transitions — with or without the Pin — most of us press Play to see the animation. The newly added Return command (the arrow next to the playback buttons; hotkey — Return; menu — Timeline/Return) brings the Playhead back to its original position. If the Pin was active, the Return command also reactivates the Pin and Region. You can see this original position as a “ghosted” version of the Pin, Playhead, and Region.


A big change in Preview 5 is the absence of the large, editable timecode display. We added timecode displays right next to the Playhead and Pin, which makes it easier to see their exact positions as you move them with the mouse. The Playhead time indicator shows the absolute position of the Playhead; the Pin’s shows the relative length of the Region between the Pin and Playhead.

For those of you who love and need editable timecode, remain calm — we’re planning to bring it back in a future release.

Missing Controls

In addition to timecode, another control is missing, at least for now: the Filter Text box. We expect to bring this back in the future as well.

Symbol Lanes

Symbol playback lanes now show subtle forward/backward arrows that indicate when the symbol’s timeline is playing.

When a symbol is selected, any Symbol Playback Commands (Play, Play Reverse From, etc.) now show the command’s target time or Label.

You can now double-click a Symbol Playback Command to modify it.

Zoom Hotkeys

In Preview 4 the zoom hotkeys had the Alt/Option modifier; we removed that in Preview 5. Zoom the timeline with = and , and zoom to fit with \.

That’s It For Now

Again, it’s worth checking out Mark’s Preview 5 video and blog post for more on this release.

The timeline is central to Edge’s UI, and we spend a lot of time talking about it and trying ideas. Look for more evolution in the future. And of course, we welcome your feedback!

1:15 AM Permalink
March 12, 2012

Edge Preview 5 – Now available!


Edge preview 5 is now available on Adobe Labs! We’re VERY excited about this release, which has a lot of big updates – many of which were requested by the community. Here’s a quick overview:

New Publishing and Optimization Features:

  • Publish to web: Preview 5 has an option to specify if jQuery should be packaged with the composition, or downloaded from a CDN to produce lighter code and improve caching.
  • Down-level browser support: Define a fallback state of a composition for non-HTML5 browsers like IE8 and below.
  • Preloader improvements: Choose what gets shown during the preloader, before the framework, jQuery, or composition is loaded.

Emphasis on animation:

  • Timeline: We made several significant improvements to the timeline that make composing animations much easier and faster, such as an easier to use Pin (formerly the Mark) and smarter playback behavior.
  • On-stage tools: New clip and transform tools make it easier to manipulate objects and create animation effects.

Many other enhancements:

  • Improved symbol functionality, stage editing options, the ability to swap images, more intuitive contextual menus, many bug fixes, and much more have been added to preview 5.

See the full list of updates here.

And here’s the latest video from Adobe Fellow Mark Anders, who covers the latest goodies in preview 5.

Please download preview 5, give it a spin, and let us know what you think!


3:59 AM Permalink