Logged In

Introducing the Spry framework for Ajax

Over the past six months, our product design and development teams have been out on the road talking to developers about the prospect of using Ajax to build more engaging and interactive web pages and applications. During the course of these conversations, we heard concerns about how to get started and how to learn and integrate new proprietary frameworks into existing workflows.

We took this to heart and set out to create a framework that leverages Ajax to deliver great experiences while truly fitting in with your current technologies and workflows. We’re excited to announce Adobe Spry, a new Ajax framework that is now available for download on Adobe Labs. Spry was developed with the following objectives:

• Keep it open: Spry works with all HTML editors, including Dreamweaver. Anyone can download it off Adobe Labs to start building high performing interactive web pages and applications. No proprietary tags or server-side code needed.
• Make it easy to use: Spry utilizes the same technologies that you already know to build web pages (HTML, CSS and JavaScript). Include a couple of JavaScript libraries with your page and you are ready to go. Create and style dynamic regions and interactive widgets using the same techniques as any other HTML elements on your page.
• Enable innovation: At the end of the day, Spry is about delivering richer experiences for your customers. Spry provides a lightweight yet powerful model for adding data, interactivity, and rich UI widgets into your web pages while putting you in complete control of the design.

What is Spry?

Spry is a client-side framework in the form of JavaScript libraries that you can easily add to your new and existing web pages. Spry is server and tool agnostic. You can use it with Dreamweaver or your HTML editor of choice. XML is the only thing that is required to get started. Take a look at a few examples of the kind of experiences you can create with Spry. If you think the samples are interesting, check out the source code. Just a few lines of code can produce powerful results. More importantly, it should all look familiar. You should be able to jump in and be productive right away. Spry will do the heavy lifting.

The first offering of Spry on Adobe Labs is focused around data and interactivity. We're looking for your feedback to help us get the framework right. Our hope is to extend this framework into reusable behaviors and UI widgets. The Spry data library provides you with the ability to retrieve, manage, and integrate data into your content without requiring a page refresh. This creates a much more seamless and interactive experience for your users. The framework converts your XML data into a client-side table of records and fields that can be integrated into your page using simple yet powerful dynamic regions. Sorting, filtering and retrieving data in the background is made easy with simple attributes that can be placed on your HTML. Furthermore, we've included samples, documentation and tutorials to help you get started building dynamic sort-able tables, RSS readers, filtered drop-down lists, web photo galleries and anything else you can think of. Check out these additional links to learn more:

• Spry Technology Center
• Gallery Examples (with source code)
• Data Set and Dynamic Regions Overview (tutorial)
• How To: Building a Photo Album (tutorial)
• Spry FAQ

How can you help?

Our goal of putting out Spry now is to get your feedback. We want this to be a great tool for web designers and developers. Please feel free to use Spry and share your thoughts, ideas and samples with us on the forums so that we can learn how to make the framework better. Your input is greatly valued and we will all benefit from the result. Use the links below to download Spry and take it out for a spin. Be sure to let us know what you think.

• Download Spry

About the author