Tag Flash

First Look at Adobe Edge


On Monday, Adobe opened up their beta trial of Adobe Edge, their latest tool for creating animations for the web. Being that they are getting hammered on all sides about Flash, instead Edge uses HTML5/CSS/JavaScript as it animation engine. HTML based animation has gotten dramatically better, my test animation ran surprisingly well across browsers and mobile devices. Whether this is Adobe’s little white flag on the end of Flash is yet to be seen but for now we options.

At first glance Edge seems closer in structure to After Effects then to Flash which could be a nod to where Adobe is heading or a way to separate the apps, again we’ll have to wait and see. The application is laid out in four sections: Properties, Timeline, Elements, and the editor window, which is Webkit based. The basic premise application is the simple, add items to a stage and then animate them via keyframes along a timeline. There are no interactions or ability to add scripts with this version of the application. Nor can you create new objects/shapes outside of rectangles, so all your assets will need to be created externally.

The timeline offers auto-keyframing and each attribute can be animated separately. Edge supports the standard set of easing which can be applied individually or to a group via multi-select. Each object/layer is a different color and their attribute list can be contracted/expanded to maximize work space. Attribute values are displayed both in the properties panel and inline within the timeline. Similar to After Effects, you can filter the timeline by typing within the timeline’s search field. Another nice AE style feature is the ability to scale the timeline and manipulate your existing keyframes in bulk.

Since the main editor is Webkit based text is true HTML text as are the CSS styles connected to it. Adobe’s handling of object positioning within the stage has a few quirks. The biggest being an object’s Zero Point being based on where it was initially introduced to the stage and not to top-left or other standard. This make is difficult to quickly create animations or layouts based on numerical coordinates from either external applications (Fireworks) or from object-to-object. For now you’ll need a PNG/JPG to create your gradients. I’m not sure if this is due to the complicated CSS to support gradients between browsers or just something missing from this release. There’s also a few glitches revolving around scaling images but text and divs work as expected.

Code wise, Adobe hides most of the magic in pre-minimized JavaScript files with the external CSS file only defining the initial elements. As long as you keep the stage and associate includes untouched you can edit the rest of the page at will. Which will only help Adobe gain support of this among larger web shops. Despite this flexibility HTML based animations still lack the self-contained nature of Flash’s SWF, which means to view my sample animation you’ll need to click to a page outside of WordPress’s CMS.

Overall, I think this is a great example of where I think web content creation apps need to go. Live HTML in the editor means there is no guessing on how things will look when it hits a browser. I hope they follow this thinking with the next version of Fireworks allowing less web savvy designers to get a better feel for what how their designs will really look outside the false perfection of the current design tools present.

Though Edge is only in its first beta release it’s pretty solid app and could easily be used to create complex animations for websites, banners and other strongholds of Flash. You can view the my test animation I created for this review. Future versions promise support for increased support SVG and the Canvas tag which will only make this more powerful tool for web animators. Will HTML5 really be the death of Flash? If so, Edge is a smart bet for Adobe to keep relevant in this new world.

Weekly Rewind: Viral Gamification

The battle for the mobile space is fierce as ever and according to Adobe’s recent survey users prefer a the mobile web for shopping and media rather then downloading apps. Though the same survey showed for single goal oriented tasks (social media, games, etc.) apps were preferred. Hopefully this will help guide companies into making decisions on where and how best to reach their customer’s needs. See the press release for more stats from the survey.

If you looking to get out there an promote your product/site you have a few options for building up the buzz, and SocialTwist’s new report on viral stats may be a good place to start. According to the report 55% of referrals come via email, 24% from social media and 18% through IM. Though that’s not the whole story, when it comes to click-throughs Social is king with 60%, followed by email’s 31%. Twitter is earning around 19 clicks per link, to Facebook’s 2.9 clicks per link. Lastly sharing is dominated by Facebook at 78%. What does all this mean? Each service has it’s strengths and to maximize your viral potential you’ll need to work them all.

Want more numbers…well Tweetdeck’s got you covered. They looked at the Android ecosystem to see product penetrations and found over 500 different phone models and around 120 different OS versions.  On one side it shows how fragmented the Android market is, on the other it shows how well Android handles that fragmentation. Feels like history repeating itself (Windows/Mac).

– – – – –

Search gets social as Facebook goes with Bing as it’s search partner. According to Yusuf Mehdi, a senior vice president for online business at Microsoft, Bing’s results will soon be biased by the number of “likes” a link has received from your Facebook friends. It’s not a surprise that Facebook didn’t team up with Google as they are reportedly working on their own social platform. Though Mark Zuckerberg points out that with Bing being the underdog they are going to work harder, innovate more. He expands on this point in the Q&A event post the announcement. The New York Times also points out that Places uses Bing’s maps rather then Google’s as well.

– – – – –

Cupertino must be celebrating after winning a patent on the “pinch-to-zoom” gesture. Though the patent is very specific and doesn’t pertain to all pinch-to-zoom gestures only those that are followed by an additional gesture to continue the zooming (figure 4A in the patent application). Still this is one more weapon in Apple’s legal arsenal…along with the 17 other patents they were awarded on Oct 12.

Apple is already suing HTC over 20 patents that according to Apple the manufacturer is infringing upon. As of this week, HTC is no longer alone in this fight. Motorola has decided to back HTC in this fight and is pushing for the entire suit to be thrown out of court on the basis that they are invalid. Separately, Motorola is suing Apple over patent infringements of their own.

Aside from the patent wars there is a growing number of designers/developers questioning the app craze in favor of web-based solutions that work across all the platforms. Zeldman, a constant advocate for standards, offers a succinct argument that the iPad has become the new Flash. Personally, I don’t think he’s too far off the mark but not only from the coding aspect but as far as UI’s. Just like with Flash there are many iPad designs based solely on showing off this, that or the other thing rather then providing a good, easy to use UI. Ultimately, it was the show-off designs and poor user experience that became the poster boy for the anti-Flash community. Sure it’s not a open standard, but it is a standard that is supported by 96+% of the users out there. Every tool has it’s purpose just like the iPad and platform specific apps have there place.

One thing not to be missed from Zeldman’s editorial is the link to LukeW’s Touch Gesture Reference Guide.

– – – – –

Who doesn’t like to play games now every once and a while? Since everyone likes games adding game elements to your site is the latest/greatest way to build synergies with your customer/user and solves just about every business ask. So next time you’re solutioning a business problem think about tossing a progress bar in there.

Ok, so that’s not really a good idea after all, but I’m sure it’ll come up just like all the other buzzwords. When it does offer to take a breather and play a few rounds of Progress Wars. Adding game mechanics to your site is more complicated then offering badges and progress bars. My buddy @Arpit recently posted his notes on Game Mechanics, a collection of links, books and a great SlideShare (Pawned. Gamification and its Discontents) on the subject. One great item from Pawned is “Games are not fun because they’re games, but when they are well-designed.” So what Is Gamification? @Adachen gives an excellent breakdown of the different types of games and how they are being used.

– – – – –

  • What is BLADE? It’s a new anti-maleware app that blocks websites from launching their services just by you visiting their page. BLADE will be a must have for any Windows user (once it’s released). I know once it’s available I’ll be installing it on my mom’s computer ASAP.
  • Calling themselves the Internet DVR is a bit of a stretch, but if you like YouTube videos enough to want to keep them Dirpy maybe for you.
  • Love Flickr but don’t have the time to explore all it’s goodness then check out Flickr for busy people.

Week in Links: Apps, Ideas and Reality

Top 10 Twitter AppsApple’s “there’s an app for that” marketing has been causing companies to go app crazy and forget that a websites are still the primary point of interaction for users.  A few weeks back the folks at Twitter reminded people that despite the fact that the heavy users all use 3rd party apps (desktop or mobile) the majority of users (78%) use Twitter.com. This week the folks at Twitter launched a new version of Twitter.com that features a number of elements that were previously only available in the app world.  They added a dynamic side panel to showcase user profiles and conversation view all while not disturbing the core of what Twitter.com was.  They’ve brought the sophistication of the external apps to the masses and with this they may have inadvertently signaled the return to web apps. For those that haven’t gotten the (rolling) invite to the new site check out TechCrunch’s overview “Best subtle things about new Twitter“.

– – – – –

A week doesn’t go by without Google making an announcement about something or other. This week they get their Google Voice app back on the iPhone. MacRumors gives a detailed run through of the app. Looks like Google has cleaned up their UI a bit with this version and offers just about everything the phone could do with the addition feature of translating your voice-mails into text. The one thing it can’t do at the moment is MMS, otherwise for $2.99 you can double the number of phones in your pocket without the bulk.

Also Google related is the steady growth of their Android platform, which is now 17% of the smartphone market. To put that in perspective the iPhone is at 24% and RIM’s BlackBerry commands 39%. Also note that the overall smartphone market has grown and these numbers are percentages of that growing market (data from Wired).

Part of Android’s success is it promotion from Verizon not having the iPhone to promote and instead needing to compete with it. Now Verizon wants a bigger cut of the action and has opened their own app marketplace. They say it’s for improved customer choice, but I’ll go with control and money.

While Android is growing into the third largest smartphone platform Nokia held it’s Nokia World 2010 event. They boasted that Nokia has a larger market penetration then Apple and Android combined, the threat is clear (as in they’re threatened). They followed their showcase of facts with info on their latest models, the N8 being the darling of the bunch. They flaunted “they perform day in and day out no matter how you hold them,” an obvious dig on the iPhone4. Then went into talking about the latest advances in Symbian and coding for it. Sadly, for US customers as nice as Nokia’s equipment is, if no carrier picks them up they don’t exist.

Final reference to Google (for this week) is their recent site/blog conveniently called Google New where they are posting all their latest products/projects. And by the looks of it they’ve been busy.

– – – – –

FCC is looking at opening up some radio frequencies, one of the selling points for opening these frequencies is the potential for Super WiFi. The are suggesting that this new Super WiFi would be able to travel farther and through buildings due to the longer wavelengths.

– – – – –

“Flash is dead, long live HTML5/CSS3.” Ever since Steve Job’s BS’ed his reasons why he didn’t want Flash on the iPhone this mantra of many front-end developers had some indisputable logic in regards to the mobile market. Now Android 2.1 supports Flash inside a browser as well as HTML5 true comparisons can finally be made. Based on the finding of Christopher Black’s tests (the video below) and a number of others Steve’s claims are no longer valid, if they ever truly were. So once again, developers have a choice as to what the right tool for the job.

Based on how the two technologies work it’s of little surprise, to me, that Flash (a platform based around animation) out performs HTML (which is designed around static structured layouts. Don’t get me wrong HTML/JavaScript have come a long way and in many ways fulfills the need that once only Flash could fill.

I’m impressed with how far HTML and JavaScript have come but structurally it’s not meant to do the animations etc. that Flash is specifically designed for. For me it’s about picking the right tool for the job and there are many factors that go into that choice, but jumping on a bandwagon shouldn’t be one of them…but I digress.

– – – – –

Pencil Vs Camera - 24It’s so easy in the world of technology and tight time frames to skip some seemingly tangential steps in order get the product or design out in time. Sometimes we just need to be reminded that we need to get back to the basics. I know that one thing that often gets skipped are the rough little sketches, Spyrestudios has done a nice write up to remind us of the benefits of sketching (and wireframes) in fleshing out ideas and saving time. It’s also a great way to look back and see the progress of ideas and inspire new ones.

A different way to look back and see how things progressed is BookTwo‘s 12 book collection displaying the changes to the “facts” of the Iraq War over the course of 5 years. The concept is simple enough, collect all the changes to the Wikipedia page on the Iraq War in one place. What it reveals is anything but simple, more of antithesis of the Orwellian nightmare 1984, where news/history was rewritten with no trace of what was.  Then again, out side of BookTwo’s project how many people are looking into trail of changes that make today’s truth.

Returning to the temporal life where now is everything, context-aware computers will be a welcomed addition to the ever growing overflow of information. For years this has been an “up and coming” technology, now (read: once again) the researchers at IBM (and many others) are hoping the power of smartphones will provide the always on, GPS info and increased processing needed to make context-aware computers a reality. What’s interesting about all this technology and it’s promise still echoes some of the thoughts of Marshall McLuhan and Norman Mailer from the late 60’s. Beyond theory and technical abilities data sensitivity will also have to be addressed before the masses should be adopting little brother to guide them through life.

– – – – –

The value of ideas is one that seems to fluctuate depending on personal circumstance. If you’re the creator of the idea, then the idea is everything. If you’re the producer of ideas (production) then it’s the implementation of the idea that matters most. So which is it? As someone that straddles both sides it’s not any simpler to define. Like most things in life the truth lies in the gray area between the extremes. Recently, my buddy Arpit delivered his take on this topic and I think he’s on to something…iteration. A back and forth between pure concept and implementation. Love the connection to dogfighting as a example of idea->action proving iteration is the actual key to success (courtesy of Jeff Atwood’s own post on the subject).

Papervison 3D: first blush

Papervision3DPapervision 3D has been around for some time. I’ve been interested in checking it out but never had a project to bring it beyond just a thought.  I now have a project that calls for some simple Flash 3D.  To start out I hit GoToAndLearn, as usual his tutorials are quick and concise .  I was shocked how simple the basics were.  Sure things will get more complicated once you move beyond the box.

My first snag was with a basic scene and a simple cube.  I placed specific materials to each of the faces of my cube to emphasize the feeling of depth.  Upon export I’m not seeing the front of my cube, but rather the back face.  I wasn’t doing any rotations yet so I’m not sure why it was rendering as if from behind.  Not finding any explanation, I instead readjusted the faces themselves to look as I wanted.  Every other transformation worked as expected, it was only the mirrored view of the cube’s faces.  If anyone has an explanation I’d love to hear them.

Links:
Papervision 3D
GoToAndLearn