Add a New Experience to Your Ecommerce Site

August 03, 2009 · by Adobe

Written by Ryan Stewart, Flash Platform Evangelist for Adobe Systems.

There is a new tool available targeted directly at interaction designers and other creative designers who want to create interactive content but don't want to get into coding – it’s called Flash Catalyst. There are three core areas of Flash Catalyst that are going to both enable a much improved design-develop workflow for teams as well as let designers who are familiar with tools like Photoshop, Illustrator, and Fireworks move into the interactive space. This is going to allow teams to reuse resources, cut down on costs, and lower the barrier to entry for eCommerce sites that want to make use of Flash.

The first area of Flash Catalyst is the interaction design tools. For eCommerce sites that want to stand out, good interaction design is a must. We've all seen plenty of bad Flash out there that turns off visitors. The key is to create compelling experiences that use interaction and design to support what's happening across the rest of the site. Flash Catalyst puts that interaction in the hands of the designers instead of the developers. Flash Catalyst has a panel for pages and "states,” which lets designers see a visual representation of how their interactive content will look as the user moves through it.

To make the experience more sophisticated, Flash Catalyst includes a timeline. Using the timeline, a designer can create the transitions and movement between states or just add bits of animation. The animation and movement is what can draw in customers and highlight certain parts of a site. With the interaction design tools of Catalyst it's very easy to start to build complex sites with smooth interactions and transitions.

For any complex site a lot of time will be spent prototyping and wireframing before any design work is done. For eCommerce sites where usability is hugely important, this is an even more essential step. With the drawing tools in Flash Catalyst, designers can quickly and easily prototype the site so they can focus on user experience first and design later. Catalyst comes with a set of basic drawing tools that let designers create shapes to wireframe parts of a site. Like other design tools, there is also a layers panel and an art board so that any designer will be comfortable starting from scratch in Catalyst.

The third and arguably most important area is the integration that Catalyst has with the other tools designers and developers use. Designers: you can do all of your design in tools like Photoshop, Illustrator, and Fireworks, and then bring those designs into Catalyst and add the interaction and final user experience. Catalyst also supports round tripping between the tools. That means that designers can choose to edit and change designs in Photoshop, Illustrator and Fireworks, instead of having to use only the tools in Catalyst. That means Catalyst lets designers focus on what they know inside of tools they feel comfortable with. And Flash Catalyst also brings along the strength of the Flash Platform. If you are working on a complex project, and this will be very common in eCommerce, you can take a project right from Flash Catalyst and open it up in Adobe's design tools. There the developer can hook the project up to a database and bring in dynamic data while the designer’s design remains completely intact. And because all of this runs on the Flash Platform, customers and users will have the exact same pixel perfect experience on Mac, Windows, or Linux.

It's clear that experience has become incredibly important. One look at the success of the iPhone shows how lucrative focusing on a good user experience can be. On top of that, the entire Web is becoming more interactive. People expect to see great design, great user experience, and get data in near real time. Standing out and getting customers means you need to push the envelope. Catalyst makes it easy to do that by putting all of the user experience and interaction in the hands of designers. Until now, the Web has been ruled by developers. Designers could create static designs but ultimately had to hand most of the experience off to Web developers. With this tool, anyone with design skills can start to create interactive content that provides that excellent user experience. It's going to much cheaper and easier to find designers who can do that than developers, and at the end of the day, you'll stand out from your competitors and create a link that will keep users coming back.

Category: Developers' Corner | Tags: Development, design