mashables
HTML5 Developer Tool: Adobe Edge
August 3, 2011 | 
Author 
Adobe Edge HTML5 Animation Tool
Adobe has just made two significant announcements this week on its support for HTML5. First, there is the new HTML5 tutorial and evangelism site, The expressive Web, which is chock full of examples of HTML5 +CSS3 code with comments, links, and Complimentary resources – see here for a review. Next, Adobe Labs has released a UI tools developing animations in HTML5 – and Adobe Edge is a very solid basic animation tool. Clearly Edge is not in the same league as the Flash/Flex/Air and its versatile cross platform and online/offline capabilities. But Edge does show Adobe’s determination to become a first rank cross-platform tool provider – which is no small deal in a development world confronting an OS Mess and ever more proprietary offerings from Amazon, Apple, EMC, Microsoft and Nokia as a Microsoft OS subsidiary.
What Adobe Edge Preview Edition allows developers to do now is create fairly sophisticated motion animations using text, images and rectangular boxes. The Edge developer tools can be downloaded here and is good for free use for 151 days. But by that time two more beta versions of Edge should have emerged[more on this below]. The reason Edge is solid is because it uses the old Adobe GoLive interface. GoLive was Adobe’s competitor to Flash before Adobe bought Macromedia and Flash. GoLive had a much better Timeline interface for creating animations than Flash [a continuing problem, see SwishMax4 for a superior 2D animation tool]. Unfortunately, Adobe decided not to use the superior GoLive interface for Flash animations; but it is now available for Edge and works quite well in creating HTML5 animations.
As noted users can add images, text, and rectangles with reasonable property control like color, sizing, rotation, position, scale, skewing , opacity, etc. These properties can then be changed in the timeline creating a from here-to-there change in say opacity[disappearing text, for example] or position – moving from upper left to lower right on the screen. There are over a dozen method of easing/tweaking the animations. Any number of property settings may be changed in the timeline and any number of times. The result is fairly sophisticated banner ad or slide deck creation tool. Even more interesting is how Edge works:
Actual HTML code just uses calls on the <div> stage to jQuery and CSS and is a <div> mover not Canvas or SVG
Once again we see that HTML5 is really heavily committed to JavaScript [also true of CSS3]. The code was tested in all 5 A-grade browsers [latest editions] and worked without hitch in all, including preserving the CSS-driven rounded corners [many _webkit, _ms, _moz specs]. But just as great in interest is the ambitious plans Adobe has for delivering Edge by 2012. Remember you already have a very usable HTML5 Banner-ad or slidedeck creation tool right now.
Plans for Delivering Adobe Edge HTML5 Development Tool
I am not certain whether Google’s Swiffy Flash to HTML5 translator tool accelerated Adobe’s plans to introduce Edge; but clearly Adobe has ambitious plans for Edge as seen in the slide below:
Edge Development plans
Now ye Editor does not pretend to know what Expressivity means and the extent of the Coding, Interactivity and Graphics clouds could be either wide or narrow moats. See the discussion here for some excellent insights on the design ideas and considerations around Edge. But clearly Adobe is targeting an early 2012 introduction for Edge. This coincides with the more agile development cycle Adobe appears to be adopting. I do not expect any sophisticated forms and data interaction capability and also offline operations will likely have to wait for an Edge 2. But the ability to run in mobiles and browsers is part of Edge’s mandate from the get go.
In sum, it appears Adobe will be intro-ing some preview/beta updates on Edge that will be well worthwhile downloading if the current preview is any indicator. Meanwhile, just below is an example of an Edge Animation in the Das Blinken Lichts style of many years ago:
Posted in 
Google Plus is ++
Dave Winer is yawning at Google Plus, the new social sharing service offering from Mountain View[what happens to Google's Orkut??]. Dave says it is just a personal peeve between Google top brass and Facebook top brass. Ye Editor has moved from MySpace to Flickr to Fotki to Facebook never quite satisfied among existing Web/Social Sharing services. For example, having been exposed to all the data and privacy giveaways of Facebook, ye Editor welcomes another approach to social media sharing. Google Plus is of interest if it will offer new ways to share with friends and colleagues. But also a business slant is of interest since Lotus Notes and Microsoft SharePoint have come up short in a number of areas. View this series of videos and see what you think – is there real value add?
Overview
Despite the background music, one gets an essential overview of what’ on offer.
Circles
Circles[~Facebook Groups] has attraction because it makes defining people with their roles and privileges to be very easy to do. This has definite business interest beyond consumer-oriented social networking.
Sparks
Sparks is the most ‘socially” oriented of the new features in tie-ing together in almost Twiiter+IM fashion people on common interests. This seem “too open” for business applications … and even on the social side it will be quirky. But it may be the Reddit/Stumbleupon/Digg of social networking.
Hangout
Hangout is a possible Skype killer [depending on performance]; but it is being pitched incorrectly. Huddle is for any type of meeting from structured to free-flowing. What will make it work better are signals – but the list of participants may be enough. In a business setting with lots of communication bandwidth available this could cut meeting and communication time and costs big time.
Huddle
Huddle is GroupIM/Chat; so everything depends on the response time Google can deliver. But at least Google has had some great practice with Google Wave. Again, this has great attraction for business use as well as social networking – think of the all the meetings that could be done via a Huddle saving time and costs.
Mobile+Instant Upload
Mobile shows the strong integration with Android [and iOS] and the mobile world that will be available with Google Plus. Also the Instant Upload hints of greater Cloud possibilities; but strong user control is the key to making this a useful service. Where will this Instant Upload fit in with Gmail and other Google Cloud Services?
In sum, Google has presented some compelling extensions to our current social networking “state of the art”. Judging by the comments at YouTube and Engadget, there appears to be solid interest from potential users.
WhereDaApps and API?
Three things appeared to be missing from the Google Plus as presented. First, where are the Apps and the API. Nada – not a word. And maybe strategically so – Google Plus does not want to appear to be way behind Facebook in the availability of Apps. Don’t start off like Android, behind the 8-ball in number of Apps. Perhaps this is why Google Plus is a “by invitation only” release. Give the Google troopers and 3rd party developers a chance to create a bunch of Apps for Google Plus. Or maybe the API is just not completely ready.
But that leads to the next question – how does Google Plus integrate with some important Google apps like Docs, Earth, Mail, Maps, TV, Shopping, Sites, etc. Again there were some very big integration question marks still left on the table.
Performance numbers was the last missing info. But because performance for Huddle and Hangouts among others will be crucial to their success, their absence has to raise questions. Again, Google may score a reprieve as this is “beta” or “trial” software subject to radical change – so specs and performance numbers would be a distraction if not downright misleading. So the next few weeks and the speed of the Google Plus rollout will reveal the state of readiness and system stability for Google Plus.
Summary
Unlike Dave Winer, ye Editor is intrigued by what has been revealed so far about Google Plus. Business IT should also be too. Many of the elements of Google Plus puts Lotus Notes and Microsoft SharePoint to shame. Now if Google were to package Portal, Docs, top of the line Hangout/Video Conferencing, top of the line Huddle/Group IM/Chat services with some serious Cloud Space with Security, Backup and Admin services they could charge for it – and have a second, non-search related revenue stream.
Right now there are still too many questions to call it an unqualified success; but there are enough promising features and capabilities such that ye Editor would not turn down an “invitation” like Dave Yawner.
Update: July 1 2011, 4 days in and no word or even rumors of a Google+ SDK or API
JavaScript and WordPress
JavaScript and WordPress go together like oil and water – they mix but only under certain conditions. True, WordPress supports Java Script and its many attractive frameworks like DHTMLx, EXTjs, jQuery, mootools, Prototype,, Scriptaculous and others. WordPress even puts a link to the core jQuery engine right into every header. So WordPressers using jQuery scripts only have to add their code appropriately – and they can add nifty jQuery-powered features. But that is also where the plot thickens.
Read what the official WordPress Codex has to say about using JavaScript:
Javascript will work within WordPress. If used within the template files, most Javascript will work fine. Using them within a post is another matter, though. Once you enter the world of PHP, it is really hard to go back to using Javascript, but they still serve their purpose. If you can replace a Javascript with PHP code, tags, or script in WordPress, do so. Your life will be much easier. If not, here are a few tips to make your Javascript work in WordPress.
So using JavaScript in WordPress is possible but without caution it can become a quickly vexing business. However, sticking to PHP-only just does not work with so manypowerful UI gadgets like image galleries, sliders, grids, and so many other useful widgets available[the PHP code often just invokes them]. So here is how to operate effectively with JavaScript in WordPress.
The Design Decisions
There are the three design decisions which determine how to most effectively use JavaScript within WordPress.
1)Will the JavaScript be used once or twice in one or a few pages or postings at most?
2)Does the JavaScript code already work as a separate standalone page?
3)Will the same JavaScript code use different stylings or data connections depending on the page or post it is used in?
Lets examine each design question in turn and see what JavaScript methods can be used. Read the rest of this entry »
Google Gmail Motion Mocks Microsoft Kinect
After taking a slap on the face from Microsoft with Redmond’s antitrust complaint yesterday, , Google returns fire with its superior GMail Motion on April 1. The Redmond UI experts who are working feverishly on a Wii to get Kinect into the Windows UI will be weeping and gnashing their teeth – or just LOLing about. But seriously, Kinect as a UI is like direct Speech Commands in an open office, just not going to make the office cut; at home or in a personal space – maybe.
Technical Story: Best Chart of US Federal Budget
The NYTimes has done it again- produced the best online graphic of the US Budget available anywhere. And the Times did it one day after the release of the budget proposal by the White House. Even more interesting is how they did it.
This graphic tells the story of the budget in 6 ways [click on screenshot to go directly to chart] :
1)The budget is displayed in blocks by department and category with sub-blocks within each;
2)The size of the block represents its percentage of the total budget;
3)the color of a block shows growth or decline year over year;
4)Hovering over any block pops up budget details;
5)There are extensive zoom controls;
6)The sidebar activates on/off various budget groupings.
This is the fastest way to become informed about the US Budget realities. See how big the mandatory and entitlement programs are. See where the growth is.See why arguing over Foreign Aid, often the only leverage the US has in various World hotspots is only a pittance. Get a measure of discretionary spending. See how much is spent per citizen on various items. This is where the government is at spending your tax dollars – get an idea of what the federal budget looks like versus your own.
Whats Behind the Chart
Ye editor fully expected to see some Flash magic behind the graph. Nope. Okay, Microsoft Silverlight? – well there are serious cross platform, cross browser problems with that. HTML5? – could probably be done but again cross browser and newness presents problems. Okay, a JavaScript framework like mootools, EXTjs, DHTMLx or others? Very close. But it looks like the NYTimes has done a home brew using jQuery JavaScript plus extensive, clever HTML+CSS. The key is the zoom feature and data display/hint scripts. And for all the diehard HTML+CSS fanatics – yes indeed this is one case where <div> and <span>s are much more flexible than using <table> tags. Overall a virtuoso and timely performance by the NYTimes graphics crew – congratulations.