Comments Recently, we attended technology demos across our design and web products. We saw a range of prototypes, many of which were focused on new services, multiscreen authoring leveraging html5 and css3. We have been spending a lot of time internally thinking about how our tools can best support and take advantage of some of the new functionality in HTML 5, and we wanted to share a couple of early ideas with you.
A couple of demos are worth highlighting. An earlier version of this demo was shown at Adobe Max last year. The workflow was focused on artwork (a Chart) that was taken from illustrator and placed into Dreamweaver which converts it into code and displays it via the HTML5 Canvas tag.
The user was then able to bind the chart to an XML data file. What was cool about this was that a designer doesn’t need to care about the underlying technology, they can just focus on the results.
<
As you may have guessed from the demo there has to be some sort of JavaScript framework in place that manipulates the chart to respond to the data in the XML file. So how would this play out in real world usage? We’re thinking about tying this workflow to a new class of Ajax widgets that can leverage Canvas to provide richer interaction along with a clean abstraction layer to allow designers real control in a tool such as Illustrator.
The sound and visual were out of synch so the demo was a little hard to follow but I’d use this functionality tomorrow if it were available. I produce a lot of graphs in Illustrator for print and PDF and being able to transfer those to the web and epubs via a method like this would really help as we develop a workflow that single-sources print and digital publications.Query: are you using the graphing utility in Illustrator? It’s pretty crank and crufty and I’d hope it would be rewritten at the same time this functionality was provided.Most efficient for us would be a workflow in which the data could be shared between the graphing utility and Dreamweaver or, better yet, drawn from Excel or a database external to both applications. Being able to update the data in one place and have various renditions of the associated graph update would increase efficiency greatly.
Wouldn’t SVG be better suited for presenting charts and illustrations created in Illustrator on the Web? SVG zooms nicely as vector graphic while canvas zooms as a bitmap.
wow, this thing blows my mind! vector on the web!!! i can’t wait for all these new features.
Great video. I am excited about the potential for Smart Paste. HTML5 and CSS3 need to have the support of the design tools, such as Dreamweaver. I noticed that it looks like you will be supporting the embedded fonts.Can’t wait to see these features coming to Dreamweaver. Maybe Flash can export to Canvas?
Yet again, people using the wrong tool for the wrong job – canvas produces raster graphics, Illustrator produces vector graphics.Clue: There’s already a widely supported vector format on the web that’s been around a lot longer than canvas. And it’s one Adobe actually has a history in developing for – why it wasn’t used here instead of the wholly unsuitable canvas is beyond me.
I think hooking the chart into a server side datasource, lets say via Ajax/JSON help us to create dynamic charts.
Love it that Adobe is pushing ahead with HTML5, CSS3 and aiming it at graphic designers.
Agreed. It is important to remember that we’re experimenting here. There has been a lot of buzz around Canvas and the team wanted to try a few ideas out.We’re also looking at SVG for this workflow (especially given Microsoft’s announcement today for better SVG support in IE9).
Supporting HTML5 and CSS3 would further extend Dreamweaver viability, period. With that said, yes SVG would be better, for this use, then Canvas. However, I understand and agree with the demo using canvas, as a lot of fan fair surrounding it right now.As for the xml dataset, I could see that used with many online sites with a high inventory turn-around, ie;Wholesale Pets (fish, Corals, Reptiles, etc.) – My brother owns a pet shop and it is VERY common to order X through a wholesalers website only to find out that X has been sold to a local walk-in. The data stream would allow to true real-time order. He who buys first wins, weather online or in-person, the computer doesn’t care.Wholesale Electronics – We all know that time is of the essence with this field and real-time data feeds that are also connected to pricing would allow for better pricing and moving product through the channels.In-person/Online auctions – Many car auctions are moving toward dual sales channel, by providing real-time data and charting will allow for better management for everyone involved. ie. There are two Ford Explorers by knowing this, the historical value of the vehicle models, combine with average up to date retail value, realtime request data and vehicle news will allow for dealer to get what moves or requested at the best price or get what doesn’t move at a lower cost to get the item sold quicker.These are just a sampling of my thought…Regards,cMason
notpad
The video here shows a flash animation being pasted http://www.youtube.com/watch?v=v69S22ZBBqA&feature=player_embeddedWhen will this be available?Thanks!-J-