Jump to content
Sign in to follow this  

Is this the right place to show my Web App that creates CSS Animations

Recommended Posts

Greets Mographers... I used to lurk here a bit, have fond memories, etc...


Anyway, I'm here to get some motion graphics all up in your websites. As some of you may know, current versions of WebKit-powered browsers (Safari, Chrome) have shipped with support for CSS3 Animations, which defines a keyframe based approach to animating web page elements inside a browser. Combining that with the available 3d transformations, I have started to realize my dream of building a simplified adaptation of the best parts of After Effects as a web application.


So far, I've got a basic live prototype - it just does boxes and text so far, but good stuff like gradients, rounded borders, box and text shadows, fonts, and keyframing are all in there. There's much more that I haven't implemented, like easing ("freaking") keyframes, masks, images / audio / video... Those are all coming. The best thing about it that I like is the very quick and easy way you can create a layout and then get down and animate all your elements. I've designed the interface to let you focus on the design and content, with an emphasis on "getting out of your way and letting you work"


Anyway, here's the goods: http://edit-room.com


As mentioned, this crazy advanced stuff currently only works in webkit browsers, so if you click that link in Firefox or whatever, it will totally look crazy and not make any sense. That landing page animation and the button style is one good example of the kind of things that can be done...


If any of you would like to check it out, please drop feedback and questions in this thread! Putting in your email is totally optional, there are direct links on the page there to the editing screen, but if you do put your email in, you'll be among the first to know when I push new features.




Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Create New...