Edge

Farewell to the Edge…

Adobe Edge Preview

Adobe announced today that it was ending their Edge Tools and Services experiment. I use the term experiment, as these products were built as part of a transition period for Adobe, shifting away from the Flash Platform toward a web platform stack. I was fortunate enough to be a part of the early development of many of these tools (as an Adobe Community Professional), but their usefulness as stand-alone elements was always troublesome.

For example, there was never a simple workflow to take your Edge Reflow work into a larger web project. Nor was it easy to fully interact with Edge Inspect from your system and devices.

But these experiments did lead to some tangible enhancements in Adobe’s main product lines. The responsive media query tool in Dreamweaver CC is a direct result of the groundwork laid by Reflow. The device preview features in PhotoShop and Illustrator are based in part on Edge Inspect.

But the mother of the Edge Tools and Services was Edge Animate (for those who remember, it was just Edge at first). EA was a interesting tool, focusing on animating the DOM rather than just painting to the HTML canvas. The timeline explored new ideas for animation control. Part of its appeal was that it was not Flash, which carried a dreaded (and partially unwarranted) stigma for many. But like all technologies, the web and its tools evolve. Although you could create some incredibly rich and interactive animations, EA never seemed to fit in. That Flash Professional app kept evolving as well, supporting more formats as publishing options (Canvas, WebGL, OAM). Take a look at last year’s Adobe MAX conference, and you can see that Flash’s animation roots were still strong and growing (judging by the number of sessions).

I have given several web animation talks, and could never quite explain how both tools fit under the Adobe umbrella. With today’s announcement, I will no longer be faced with that issue. Edge Animate’s development has been ended. It is still available as part of your CC subscription (heck, Fireworks is still there!), so you can continue to use it on your projects. However, as the web evolves with new browsers, standards, and libraries, EA will not be updated.

In its place, we can turn to Animate, the renamed Flash Professional. Like a phoenix rising from the ashes, Flash has really returned to its roots as a first class animation tool and is now reborn.

Now, designers can use a tool that they are all probably comfortable with, without worrying about backlash from managers or clients who didn’t understand that the tool was more than just a SWF creator.

I am looking forward to exploring Flash’s Animate’s new future as part of my design toolkit. To all those at Adobe who worked on these products, thanks for the efforts and experiments.

 

Come learn about the Edge Tools and Services!

I am presenting to Orange County Multimedia Association on Tuesday, January 15. I will be demonstrating the entire Edge Tools and Services suite. I will cover everything from Edge Animate, Edge Code, Edge Inspect, to PhoneGap Build, and even a sneak of Edge Reflow. Hope to see you there!

Time: Food and networking 6:00p.m.; Meeting: 6:30-9:00 p.m.
Location: Digital Media Center @ 1300 S. Bristol St. Santa Ana, CA 92704

animate-logocode-logoinspect-logoreflow-logowebfonts-logotypekit-logophonegap-build-logo

Update:  My slides are available here. Hopefully, the recording turned out. Once I have the link I will post it here.

San Diego CS6 Camp presentations

I had a lot of fun introducing both Adobe Flash Professional CS6 and Adobe Edge (Preview 6) to full classrooms during last weekend’s CS6 Camp. I hope the attendees were able to learn a little bit more about each of the products, and how they fit in today’s ever changing technical landscape.

Here are the slides that used for each session:

San Diego CS6 Camp - Intro to Flash ProfessionalSan Diego CS6 Camp - Intro to Adobe Edge (Preview 6)

Again, thanks to all that attended my session and the entire camp!

Adobe Edge Tip #1

Now that Adobe Edge Preview 1 has been public released, I can start talking about some of the things I have learned while exploring the tool. One of the first things you might notice is the alignment of the composition area.

Adobe Edge User Interface

By default, the ‘stage’ div is aligned to the upper left of the composition area (actually a running version of the Webkit browser). This can be problematic if you are trying to animate elements coming from the left side of the screen. The solution is actually quite simple.

Since Adobe Edge can open standard html files, there is a quick file. Create a new Adobe Edge project. Locate the html file, and open it in your favorite editor (Yes, round-trip integration would be nice, or even code editing within the tool, but hey, it is only Preview 1).

Once you have opened the html file, simply add:

<style type="text/css">
	#stage {margin-left:auto; margin-right:auto;}
</style>

before the </head> tag and save the file. If you kept Adobe Edge open, it will notify you that a file has changed, and ask if it should reload it.

Click yes, and your composition area should now be centered within the panel.

Adobe Edge Preview 1 is here!

After being demonstrated during last year’s Adobe MAX conference, the first preview of Adobe Edge is now available on Adobe Labs. Unlike Flash Catalyst which had the code-named Thermo (which ranks as one of the better code-names), Edge is the official name of the product! Although this is some interesting history behind that name as well, but I will leave that for another post.

So what is Edge? Edge is a new tool from Adobe to assist in the development of web animations using HTML5, Javascript and CSS. It is not a Flash converter (nor killer!), but another tools for web designers and a developers to draw upon to create rich and engaging content. This preview release focuses primarily on the process of creating and editing animations. Features like interactivity are planned for later releases.

Edge Preview 1 is something different from Adobe in terms of where the product is in it’s lifecycle. Edge is in fact very early in it life-span. Adobe has been a shifting to a more rapid development cycle in order to better respond to the increasingly changing digital world of both browsers and mobile. Be letting the public have an early look at the tools and it’s direction, the team can take in a wider range of feedback that neither an Advisory Board nor a private beta could provide. So download it, kick it’s tires (or timeline in this case), and let the team hear your thoughts. They are sick of mine ;).

Over the next few days, I will be writing more about my experiences using Edge, or better yet come to Monday night’s San Diego Flash User Group meeting where I will be demoing it!