Former Apple engineers release Adobe Flash-killing HTML5 authoring tool

“For all the talk of HTML5, web developers nowadays are still doomed to hard-coding pretty HTML5 websites. Deciding enough is enough, two engineers left Apple to found Tumult, a Y Combinator-funded startup. Their goal: Address a chronic shortage of decent HTML5 authoring tools,” Christian Zibreg reports for 9 to 5 Mac. “What, you didn’t think Adobe’s Creative Suite is the be all end all of web development?”

“The result of their undertaking is Hype, a brand new Mac application taking the pain out of creating eye-catching animations on the web that don’t require the Flash plug-in,” Zibreg reports. “The $30 download (limited introductory pricing) is already the top-grossing program on the Mac App Store.”

Full article here.

Hype’s HTML5 output works on all modern browsers and mobile devices like iPhones and iPads. No coding required.

• Interactivity & Animations
Hype’s keyframe-based animation system brings your content to life. Click Record and Hype watches your every move, automatically creating keyframes as needed. Or, if you’d prefer to be more hands-on, manually add, remove and re-arrange keyframes to fine-tune your content. Hype lets you make as many scenes as needed, and a variety of actions can switch between scenes using smooth transitions. Use the power of multiple timelines to run animations based on mouse/keyboard events.

• HTML5
Hype outputs state of the art HTML5, CSS3 styles, and JavaScript. It supports cutting edge features like box shadows, reflection, and 3D transformations. Hype tries hard to deliver 100% fidelity across all browsers. For example, if the high-performance CSS3 transitions aren’t supported, Hype will fall back to Javascript-based heartbeat animations. When there are no good fallbacks, Hype warns about browser incompatibilities, so you’re never caught by surprise.

• WYSIWYG
Hype’s scene editor is powered by WebKit, the same modern rendering engine that powers Safari. What you create in Hype is what your viewers will see in the browser. Hype’s rich inspector lets you dive in and easily tweak every aspect of your content. Intelligent guidelines, arrangement, and sizing tools give fine control over element placement.

• Exporting
Hype creates an entirely self-contained directory that holds all the resources and JavaScript for your content. Upload that directory to your web server, copy and paste three lines of HTML into your exiting web page, and you’re good to go. If you have a Dropbox account, Hype can publish to your Dropbox public folder for easy sharing.

• Flexibility
Hype provides a rich set of tools for styling, but sometimes you need to get hands-on. Every element’s inner HTML is only a couple clicks away and all of your changes are rendered on the fly, giving a live preview as you edit. The integrated JavaScript editor lets you write custom functions triggered by user actions. The Hype JavaScript API can manipulate the scenes from inside or outside of the embedded Hype content.

• Native Mac Experience
Hype was written in Cocoa exclusively for Mac OS X. It is intuitive and easy to use, letting you focus on creating great content. Hype launches in a second.

Tumult “Hype” application via Apple’s Mac App Store (US$29.99) here.

[Thanks to MacDailyNews Reader “Lynn W.” for the heads up.]

24 Comments

    1. Wow! It didn’t take the Flashtards long to catch this story and spout the Adobe anti-HTML5 garbage.

      (Sorry to hijack your comment, RePlay. I’m just commenting on the two frothy posts below.)

  1. This is not a replacement for Flash in as much as Pixcelmator is not a replacement for Photoshop. If you need to code interactivity through Action Script, this is not the tool for you. If you need a simply animation, this is very cool and welcome solution.

    1. Absolutely correct!!! ……there are many reasons this headline is a major fallacy.
      a. Assuming that high level (HTML5) coded web pages can ever fully compete with low level Actionscript in the first place.
      b. That they seem totally unaware that Adobe has already built HTML5 coding features into their tools.
      c. That they are competing w/ a fully Cross Platform Creation Tools in Adobe’s Creative Suite that is unveiling new fully GPU accelerated 3D Molehill API’s that go beyond the power of even WebGL.
      d. HTML5 as yet has NO DRM theft or copy protection for Content Owners.
      e. Nor does it yet have Secure in App purchase abilities as yet either.
      The chance of anything from HTML5 that can actually compete one on one with FLASH w/ Full P2P connectivity, full 3D shader models, Video/Voice chat (like AOL’s new AV Web beta), Replication (in games like Facebook’s new “Idol Worship”), etc et all is indeed as asinine as thinking FLASH is dead, when they have NEW web sites, web apps n games and even more developers than any other coding platform on the Planet!!!

      1. A. Wrong. Actionscript is a JavaScript ripoff and hype allows you to control elements using js
        B. Wrong. CS 5.5 doesn’t support AS in it’s html5 export. So all you get is the basic animation.
        C. So? To use the new cs5.5 features you’d need to rewrite your flash elements anyway. None of the new features are supported on mobile devices, and flash 10.1 is a horrible android experience. Much better to rewrite with Hype and gain the desktop and a great mobile solution. Css3 even has 3d features.
        D,E. Make your html5 project into a iphone app, instant drm and in app purchases and the best market.

        iPhone development is where the money is. The Flash market is filled with “programmers” trying to make a buck working at 8$ a hour. Go to ifreelance and see the bids for flash jobs.
        You want to do ads for mobile devices, you aren’t using flash mate. Want to be part of the 1 BILLION dollars paid out to iPhone developers? You aren’t using flash mate. You want to be free of Adobe’s buggy, slow, invasive, expensive and anti mac software? Free yourself from flash mate.

        1. Wrong Wrong Wrong!!! Just admit you are a confirmed CrAppleholic drunk on all the RDF and FUD iHitler Steve has been preaching to you!

          Remember last month Android was Activating 400,000 phones a day. Now they’re Activating 500,000 a day Worldwide. Don’t tell me about that being for all the Tablets and smartphones? Because then that blows you iDiots saying no Tablet PC’s are selling. Don’t tell me about how many Apps CrApple has either, because they are about to be blowin away Android Market numbers by August. Get educated too!!! You iMORON!

          FLASH 10.3 has been out on Desktops including OS-X for ever. I have an Samsung Galaxy Tab and FLASH run awesome on it. Learn about ActionScript before making a fool of yourself too. And dude grow up and at least give FLASH 3D Molehill a chance before you start talking out your arse.

          Because FLASH is still out performing every other plugin out there and especially slapping the shizt out of HTML5 with 30% higher frame rates! FREE yourself CrApple mate!!! ;p

  2. Flash isn’t just video of course, so the key to a successful Flash replacement is the interactivity/animation component. Much of our interactive content was created in Flash in the mid-2000s, and replacing it all will be a bitch (it’s not just us–a lot of commercial online training is either Flash or has heavy Flash dependencies too).

    I will look at Hype’s interactivity/animation module more closely, but from the description it’s only capturing bitmap information and won’t scale as nicely as vector-based animations can.

    Example of a simple vector-based Flash to try and HTML5-ify from Flash, the “Scale of the Universe”: http://htwins.net/scale/

    1. Engineers don’t do websites, but are loath to outsource any “digital” production. They are probably on shoestring budget, but hopefully will wise up to the marketing side of the biz.

  3. It’s a great tool… but let’s not go declaring Flash dead. There’s a lot that Hype can’t do… yet. When they release V2, THEN we can start talking about a “Flash Killer”.

  4. This is a very sweet tool. But to say it uses primarily HTML5 is grossly misleading. It uses Javascript predominantly, to render pages – I assume using the DOM model, but being a designer rather than developer, i’m not sure about that. The point is you don’t end up with editable HTML5 but very dense Javascript. Also in this vein don’t overlook Radi and Sencha Animator.

  5. I tried it. Seems easy enough to learn. Exporting it for use in iWeb or Rapidweaver doesn’t seem to be possible yet though, so you’d need Dreamweaver or some such pro web authoring software.

    1. Use a server side include and embed the external HTML from hype that way. check out the rapidweaver docs, should have something about ssi.

      Advantage is you can still tweak the hype stuff independent of rw. Ssi’s combine 2 or more bits of HTML in the client browser.

Reader Feedback

This site uses Akismet to reduce spam. Learn how your comment data is processed.