Webmonkey » CS5

Flash Faces Down Threats on Adobe’s Big Day

Michael Calore — Tue, 13 Apr 2010 00:14:35 +0000

Adobe announced details of its Creative Suite of applications Monday amid a stormy debate over its relevancy and the vitality of Flash, one of its most important products. But even though the air around it has grown chilly and the skies above have darkened with menace, Adobe went ahead and held its big parade anyway.

[See our reviews of the new Photoshop, Dreamweaver and Flash]

The fact is, even though it looks like the cards are stacked against the Flash platform, there’s very little threat that it will be supplanted by another technology any time soon.

Key to Flash’s success is the explosion of web video. More than 90 percent of web-enabled computers around the world have Flash Player installed, and all of those people can go to sites like Hulu or Comedy Central or YouTube right now and watch the full spectrum of clips, from viral candy to Hollywood hits. Microsoft’s Silverlight technology, which can also stream videos at a level of quality roughly on par with Flash, doesn’t have the same penetration (it’s ~~closer to 30 to 40 percent~~ Update: the post I previously linked to was outdated, and according to Microsoft’s April numbers, it’s actually closer to 60 percent), and there are far fewer sites using Silverlight as their sole video platform.

Also, the latest version of Flash Player (version 10.1, which came out earlier this year) addressed many of the performance, security and consistency issues that have been dogging Flash for the last year.

So, for now, Flash remains the de facto standard for video on the web.

While some proponents of the open web would have you believe that a viable replacement for Flash is already here in the form of HTML5 video, that’s not exactly the case. The HTML5 video tag does indeed allow you to embed videos in web pages without Flash. But native HTML5 video has several things holding it back.

Most important, the HTML5 method leaves it up to the browser to actually play the embedded video. And that’s where the biggest problem arises — what video codec should the browser use? Apple, with the iPad, iPhone and its desktop apps, is pushing the H.264 codec. But the H.264 video codec has licensing requirements and is not free in any sense of the word. Moving from the Flash plug-in to the H.264 codec is like moving backward — from Flash to a more expensive Flash.

Mozilla has already said that Firefox will not support H.264. The company is instead backing Ogg Theora.

Google’s Chrome browser does support H.264, but the company also recently acquired On2, makers of a third, competing video codec. As NewTeeVee reported Monday, Google has plans to release On2′s VP8 video codec under an open source license soon. Both Theora and VP8 are promising, but it will be years before either of these technologies reaches the same level of maturity and acceptance as H.264.

Since there’s no agreement among browser makers on a standard for open web video, it means that no matter which option you choose — HTML5 with H.264 or HTML5 with Ogg Theora — the best case scenario is that 20 to 25 percent of the web can see your video without needing a plug-in.

As long as that’s the case, Flash is going to be part of the web. Unless of course you’re surfing with an iPad, an iPhone or an iPod Touch. Apple refuses to support Flash Player on its touchscreen mobiles, blocking owners of those devices from watching most videos online.

Of course, the web is much, much bigger than the iPad. But excitement around the devices is enough to drive some heavyweight companies, including The New York Times, Vimeo and YouTube, to create iPad-friendly versions of their sites that use HTML5 technologies to serve videos and animations, so they won’t be left out. But even those sites are only serving Flash-free pages to iPad and iPhone visitors. Everyone else still gets Flash.

That’s the web-video story. The other side of the campaign against Flash turned particularly nasty last week when Apple rewrote the rules for its iPhone OS, prohibiting its developers from using Adobe’s software to write apps for its touchscreen devices.

Apple’s new rule specifically bans applications built with cross-compilers from being sold in the App Store. Flash CS5 will ship with such a cross-compiler, Adobe’s Packager for iPhone, which lets developers build apps in Adobe’s suite of tools that can be exported with the click of a button and wrapped up as Apple-native code. Depending on how strictly Apple chooses to enforce the new rule, those apps likely won’t run on iPhones and iPads once the devices get their software updates this summer and fall, respectively. (There’s also a note on Adobe’s website Monday noting the use of Packager for iPhone is “Subject to Apple’s current requirements and approval.”)

This move, Brian X. Chen pointed out on Gadget Lab, is a setback for developers who are using non-Apple tools (including Adobe’s) to make iPhone apps.

Adobe CTO Kevin Lynch even ridiculed Apple in a video published by All Things D over the weekend, in which he imagined Apple releasing a future version of its developer agreement requiring programmers to “build applications by typing with one hand and swinging a chicken above your head.”

Even if they’re locked out of the iPad, developers will still be able to use Adobe Flash to build apps for Android- and Windows-based tablets and touchscreens. Several are expected later this year, and some of them, like Google’s tablet and the HP Slate look strong enough to truly compete with the iPad.

Lastly, Adobe is smart enough to realize it can’t take Flash’s current dominance over HTML5 for granted. The company knows HTML5 is going to be a big part of the web’s future, which is why it has built tools into Creative Suite 5 for rendering Flash elements as HTML5-ready Canvas animations, as seen in this video.

We can expect to see more export tools like that coming out of Adobe. Even if the Flash platform erodes away or changes shape as the web evolves — and it certainly will, just very slowly — Adobe will be able to maintain its relevance as a maker of developer tools that let people build apps for (almost) any audience.

See Also:

Photo: Brian X. Chen/Wired.com

Dreamweaver CS5 First Look: More WordPressy, More Firebuggy

Michael Calore — Mon, 12 Apr 2010 18:28:53 +0000

There’s a new version of Adobe Dreamweaver on the way, and it includes new features for building sites with WordPress, new CSS enhancements and a new set of tools that let you see code changes in real time as you work, much like the popular Firebug add-on.

Adobe announced details about its latest Creative Suite bundle of applications on Monday morning. Creative Suite 5 is Adobe’s new package of apps for building websites, assembling videos and editing photos. We have a first look at Flash CS5 here on Webmonkey, and we have a first look at the new Photoshop on Wired.com’s Gadget Lab.

Dreamweaver, which has been one of the most popular apps for developing websites since its debut (as a Macromedia creation) in 1998, gets a fairly substantial update in Creative Suite 5. It doesn’t have the whiz-bang new features found in Photoshop CS5, but if Dreamweaver is part of your development workflow, you’ll definitely find much to appreciate in the new Dreamweaver CS5 that makes it worth an upgrade.

Of course, whether or not to use a WYSIWYG editor like Dreamweaver is a debate in itself. Most can get by with a text editor, a few browsers and a short stack of reference materials. But if you’re working with a team of developers, or if you’re building more complicated sites with dynamic elements, databases and hundreds of pages, tools like Dreamweaver are essential. They speed up the workflow, keep everything organized and ease the pain of constant testing and iteration.

So, if Dreamweaver has a place in your life, here’s a rundown of what’s new in the latest version.

One of the biggest improvements in the new Dreamweaver is the inclusion of better development tools for dynamic sites built using PHP-based content management systems like WordPress and Drupal. These systems, which of course are super-popular for blogs and community sites, don’t spit out static HTML files. Rather, most of the pages on a WordPress blog or a Drupal site are generated on the fly using templates and include files. Dreamweaver CS5 now gives you tools to design templates and see what your layout will look like in your final design. The built-in WebKit engine renders your page as it would render in WordPress (or whatever PHP-based system you’re using).

New CMS tools let you edit template files and see your changes right away (click for larger image).

PHP support has been improved in other places within Dreamweaver, too, with new code hints for WordPress, Drupal and Joomla, plus support for custom functions and classes, so you can create your own code hints and error highlights for other PHP frameworks.

Added support for WordPress and other like-minded CMS tools is a big improvement, and one that’s necessary since so much of web publishing has moved to PHP-based systems. Fans of WordPress or Drupal should find reason to test out the latest Dreamweaver and see if it takes some of the pain out of designing templates.

The new inspection tools in Dreamweaver CS5 let you make adjustments to the CSS or the DOM of whatever page you’re working on and see them rendered in real time. The inspector shows you how your code will change as you interact with dynamic elements on a page, and it will show you how various changes you make to stylesheets show up on the rendered page.

Dreamweaver's inspection tools let you edit your CSS and JavaScript and see your changes in real time.

As with several of the features in Dreamweaver, this is something that you can do with the free browser-based plug-in of your choice. In particular, the inspection features offer an experience similar to the Firebug add-on and its various extensions, but here it’s baked right into the development environment. The primary advantage of having these tools sit directly inside your editing environment is one of convenience. Once you make the changes, there’s no copying, pasting, testing and redeploying. Most Dreamweaver users have found a happy medium between browser-based and IDE-based inspection and testing tools.

Speaking of testing, Dreamweaver fully integrates Adobe’s BrowserLab web service, which lets you examine your layouts as they appear in different browsers. So you can look at your page in a 2-up dialog, with Firefox on one side and IE8 on the other (or any two browsers). There’s also a cool “onion skin” feature that overlays your differently rendered pages on top of one another, so you can clearly spot any layout inconsistencies, color differences or interactive elements that don’t work.

BrowserLab is a free service available to anyone right now, and it very well may remain free for its entire lifetime. But the fine print on the site warns that Adobe could make it a paid service at any time. So, fair warning. UPDATE: Adobe’s site says “Notice: On April 30 2010, the limited free preview of Adobe BrowserLab will conclude. [...] If you sign up by April 30, 2010, you will receive one year of complimentary access to all CS Live services.” [Thanks, Scott!]

When it comes time to deploy files, Dreamweaver CS5 has vastly improved Subversion support. There was some support for Subversion in CS4, but it was pretty limited. Now, you can make all your changes, moves and deletions locally, then sync to your server. The svn:ignore command works now, too. Also, the the Extensions Manager (which has been a vital part of Dreamweaver since the Macromedia days) now handles the Subversion libraries, so if there are any updates, you’ll be able to download them for free from Adobe Exchange.

Finally, something helpful for the new users: the addition of some new CSS starter layouts. These are basic CSS files that help you kick-start a site design using the latest web standards, including totally bare-bones layouts and more complicated things like dropdown menus. So if (like a lot of people starting out) you understand CSS but you don’t feel confident writing it all yourself, Dreamweaver’s templates will provide a boost — and hopefully keep you from taking the easy route and doing your whole site in tables. There, of course, similar templates available on the web, but they vary in quality and in compatibility across browsers.

The new Dreamweaver will ship soon, (Adobe says mid-May), along with the rest of Creative Suite 5. Dreamweaver on its own costs $400, or $200 for an upgrade from any previous version going back to Dreamweaver 8. You can also get Dreamweaver in one of the Adobe Creative Suite 5 bundles, which vary in cost from $1,800 to $2,600 depending on which one you buy. Upgrades vary between $500 and $1,400 for the suite. Also, we should note that Adobe has done away with the Web Standard edition of Creative Suite, so now the Web Premium edition is the cheapest CS5 bundle you can buy that includes Dreamweaver.

See Also:

Flash CS5 First Look: Adobe Drops a Hefty Update Into Stormy Waters

Michael Calore — Mon, 12 Apr 2010 18:27:55 +0000

Adobe has released details about the latest version its Flash authoring tool, which arrives amid great uncertainty concerning the multimedia platform’s future.

Flash Professional CS5 boasts a number of improvements over previous versions, including better animation physics, improved typography controls, new code hints and snippets for building webapps in ActionScript, some new data formats, and better ability to add cue points to videos. It also has a few tricks for developers eager to publish apps to places where Flash isn’t allowed.

Flash is part of Creative Suite 5, Adobe’s new package of apps for building websites, assembling videos and editing photos. The new suite of apps, which Adobe says will ship mid-May, was announced Monday. We have a first look at Dreamweaver CS5 on Webmonkey, and we have a first look at the new Photoshop on Wired.com’s Gadget Lab.

Adobe Flash has taken a beating lately, especially from the hurricane that Apple’s public relations team generated around the launch of the iPad. Apple’s mobile devices don’t support Flash Player, so Apple is encouraging web developers to make their sites “iPad-ready” by removing Flash elements.

Also, last week, the new iPhone OS was announced, and it includes a new rule banning applications built with cross-compilers. Flash CS5 will ship with such a cross-compiler, Adobe’s Packager for iPhone, which lets developers build apps in Adobe’s suite of tools that can be exported with the click of a button and wrapped up as Apple-native code. Well, those apps won’t run on iPhones and iPads once the devices get their software updates this summer and fall, respectively. (There’s also a note on Adobe’s website Monday noting the use of Packager for iPhone is “Subject to Apple’s current requirements and approval.”)

Even with this cloud of negativity hovering overhead, Flash has plenty of steam left. The biggest factor in Flash’s success — video playback — is still a killer app on the web. The latest version of Flash Player (version 10.1, which came out earlier this year) addressed many of the performance and consistency issues that have been dogging Flash for the last year. And Flash will continue to be a key to video experiences in browsers, at least until the mess that open video is stuck in right now gets cleared up.

Even so, Adobe is smart enough to see that HTML5 is going to be a big part of the web’s future, which is why the company has built tools into Creative Suite 5 for rendering Flash elements as HTML5-ready Canvas animations, as seen in this video. As developer and blogger Simon Willison notes, this feature could be very useful for displaying newspaper infographics and other “Flashy” data visualizations on iPads and iPhones.

The HTML5 debate aside, here’s a rundown of what else is new in Flash Professional CS5.

Video cue points

If you’re building content around a Flash-embedded video file, you’ll be keen on one of the new enhancements in CS5: the ability to use cue points in the videos’ timelines to trigger ActionScript events.

You'll find code snippets and new code hints in Flash CS5's ActionScript editor. (Click for larger.)

Building ActionScript apps

There are also new tools for building ActionScript apps. The most powerful tool is Adobe Flash Builder, which is fully integrated with Flash CS5 (It used to be called Adobe Flex Builder, and it’s been in an open demo program since early 2009).

Flash Builder is an Eclipse-based IDE for building web apps with Flex, Adobe’s open source web framework. You can use Flash Builder to create apps that interface with local databases or the APIs of various web services. You can also set up Flash Builder to be your default code editor for ActionScript.

ActionScript editor

If you’re a whiz at ActionScript, you’ll appreciate the new ActionScript editor in the new Flash Pro. You get new custom class-code hinting and code-completion features. There’s also a library of ActionScript snippets for new coders — so many, in fact, that you don’t really need to know that much about ActionScript to build simple animations.

Natural animations

Animations will be more natural overall since Adobe has updated its physics engine in Flash CS5. The last version saw the inclusion of a new inverse-kinematics engine, and it’s been enhanced in CS5 to produce animations that are more lifelike and realistic.

Flash CS5's text-handling capabilities have been improved. (Click for larger.)

Text handling

There are new text handling tools, too, including Adobe’s Text Layout Framework. This framework has been built into multiple products, including Flash Player 10.x and the other CS5 production tools. So, when a designer hands you a file with text laid out in InDesign or Illustrator, that text will be better preserved once you start playing around in Flash.

Flash Catalyst

Shipping along with Flash Pro in most of the Creative Suite 5 packages is Flash Catalyst, another product that began life as a free beta in Adobe Labs. Flash Catalyst lets you take a static design created in Photoshop or Illustrator and make a functioning Flash web app out of it.

You select the different things like scrollbars or menu elements, and apply ActionScript actions to them. Catalyst basically brings a static illustration to life as you define how the parts move and how they interact with one another. When you’re done, you can export it to Flash Builder, where you can tie the interface to a database or to web APIs. There’s more info about it on Adobe Labs, including a video.

Outside the box

One more cool thing Adobe has done in CS5 is they’ve solved Flash’s hermetically-sealed–box problem. When you export your Flash project, you can just spit out a single, binary FLA, or you can choose to export as an XFL package. It’s a new XML-based format developed for Adobe Flash.

The XFL option produces an uncompressed package where your various elements — video, objects, scripts — are all left separate. You can edit individual elements of your project (or pass them off to other team members for editing) without having to repackage everything any time a change is made.

We’re not going to spend too much space here encouraging anyone to ditch Flash in favor of open web technologies. There is plenty that HTML5 can do when it comes to building apps, animations and playback experiences, and the smart developers out there are already using emerging standards to do those things (with and without Adobe’s tools). For everything else, Flash will continue to fill in the gaps. Love it or hate it, Flash has its place on the web, and for those of you using it, Flash Professional CS5 should serve as a welcome upgrade to your workflows.

Flash Professional on its own costs $700, or $200 for an upgrade from any previous version going back to Macromedia Flash 8. Flash Catalyst CS5 costs $400, and Flash Builder costs $250. So, if you’re interested in getting all of the Flash tools, you should also look into one of the CS5 packages, which come with other flagship apps like Photoshop and Dreamweaver.

The Adobe Creative Suite 5 bundles containing the Flash tools vary in cost from $1,800 to $2,600 depending on which one you buy. Upgrades vary between $500 and $1,400 for the suite. Also, we should note that Adobe has done away with the Web Standard edition of Creative Suite, so now the Production Premium edition ($1,700) is the cheapest CS5 bundle you can buy that includes the Flash apps. For that price, you also get Photoshop, Illustrator, Premiere Pro, Bridge and several other apps.

See Also:

Adobe’s Magical ‘Content Aware Fill’ Bends Pixels to Your Will

Scott Gilbertson — Fri, 26 Mar 2010 15:49:30 +0000

Adobe is already counting down to a new version of its creative suite, with updates for Dreamweaver, Flash, Photoshop and other apps common in the web designer’s toolkit. While the company is characteristically tight-lipped about new features, it is showing off a mind-bending new tool for Photoshop — content aware fill.

Like the content aware scaling (AKA seam stitching) in the current version of Photoshop, content aware fill is about intelligently adding, removing and changing objects in an image based on what’s around them. While that sounds fairly prosaic, seeing it in action will blow you away.

The video above starts a bit slowly (photographers would no doubt argue, realistically), if you just want to see the crazy stuff skip to the halfway point.

As always Adobe isn’t saying the content aware fill will be in Photoshop CS5 (due next month), but that’s really their way of saying it will be in Photoshop CS5 because no company in its right mind would show off these features and not deliver them shortly thereafter.

If you’re interested in learning more about the tech behind the content aware fill features, check out the Adobe website which features another, earlier demo movie.

If the content aware fill whets your appetite for CS5, well you don’t have long to wait. In fact, thanks to Adobe’s CS 5 countdown site we can tell you you only have 17 days, 00 hours, 00 minutes and 49 seconds as of this writing.

Normally we’re not ones for promo sites, but this one is notable because Adobe created the entire site without any gratuitous Flash elements. See, Adobe is embracing the modern web.

See Also: