SXSWi – Where dreams are born

Moly, my head is overflowing with new ideas, concepts, and dreams from the SXSW Interactive conference this past week. This is the second time I’ve attended, and each time I am awakened with new chills down my creative spine. Here a few new products that stood out:

Um…yes please Adobe…

Adobe always delivers a great session presenting their upcoming products. This year, they demo-ed all the Adobe Edge tools. Here are the ones I’m particularly excited about, but you can learn about all of them here: http://html.adobe.com/edge/

Adobe Edge Animate

http://html.adobe.com/edge/animate/

Now that HTML5 and CSS3 are taking center stage for web animation, Edge makes it super easy to implement. In fact, you really just have to click some buttons and it spits out the code for you. Sa..weet.

You can import graphics and turn them into symbols, apply CSS styles such as text shadow and border radius, and a ton more.

The timeline is much like Flash, so if you are remotely familiar with that interface, you’ll be fine.

Adobe Edge Code

http://html.adobe.com/edge/code/

Like many web developers, I prefer to simply use a text editor to code. And also like many of you, I come to a point where I need to modify a javascript function, but can’t remember which .js file the function is housed in.  In Edge Code, just click a hotkey and you’re taken to that .js file right there in the application. So more searching your .js files!

Edge Code also has real-time edits, meaning you don’t have to continually refresh your browser each time you make an edit. While browser add ons like Chrome’s Developer Tools and Firefox’s Firebug make it easy to debug, I do find those interfaces to still be a bit clunky. Edge Code seems more seamless and smooth than the average browser debugging tool.

Need to restyle an element? Just press the hotkey and you are taken to that element’s CSS so you can modify it and see the results instantly.

Adobe Edge Inspect

http://html.adobe.com/edge/inspect/

Edge Inspect is the previous “Shadow” application. Inspect allows you to see your website on mobile devices in real-time by syncing your devices together. You can also take screenshots on each device to send to your client or whomever you wish.

Adobe PhoneGap Build

http://html.adobe.com/edge/phonegap-build/

Okay, I saved the best for last. PhoneGap Build basically builds your mobile app for you.

Wait, sorry, I temporarily hallucinated. Did you say “builds the app for you?”
Yes, I did.

All you have to do is create your code in HTML, CSS, javascript, whatever, and it drop the zip file into PhoneGap Build. It then spits out a QR code to download the app.

…AND…the app it builds is compatible with iOS, Andriod, webOS, WindowsPhone, Blackberry, and more.

Yes. “Wow” is the word you were looking for. And now I want to pass out in elation.

Leave a Reply

Your email address will not be published. Required fields are marked *