Product Feature Highlight: Expression Blend 3 – Behaviors
The problem
Creating a rich interactive application today is generally a time consuming and manual process with little opportunity to streamline and simplify the workflow across a team. Expression Blend 3 is tackling this problem and allowing UX specialists to apply, experiment, and finesse the application’s interaction model in a more obvious and visual way—without having to resort to code for even the smallest change. This is being achieved through a powerful addition to Expression Blend called Behaviors.
What is a Behavior?
A Behavior is in essence a reusable piece of interactivity that can be applied directly to user interface elements in Expression Blend. Reusable libraries of Behaviors can be created and shared within a team allowing interactivity to be applied in a coherent and robust way across a project. Whether a Behavior is simple, such as playing and stopping an animation, or complex, such as applying a realistic physics effect to an object or validating data entry in a form – the way the Behavior is created and applied remains the same.
How do Behaviors benefit you?
A successful application today not only needs to be rich and engaging but must also allow users to succeed in the task they are trying to achieve – simply, quickly and effectively. Users today have higher expectations than ever when it comes to the quality of experience they expect to receive from an application.
As expectations have risen regarding the quality of experience, so has the cost and pressure of building this new breed of richer applications. Often, the responsibility falls on the shoulders of the designers and developers building the application, to create the extra level of engagement that gives an application an edge, making it more appealing to its core audience.
One area that can have a huge impact in how people perceive an application is how the user interface moves and responds to user input and, following that, how the application transitions from one state to another. Interactivity and transitions that reinforce and enhance the overall user experience, rather than gratuitous eye candy, become more critical in making a powerful, positive first impression that keep the customer engaged longer.
Building this type of interactivity consistently across a project, or multiple projects, with multiple designers and developers is generally hard, requiring custom code and a lot of experimentation to create something that is successful.
Adding interactivity to a project involves lots of time writing code, creating the transitions, and then wiring up the different objects and elements of the user interface to perform the desired action. Over time, this becomes even more frustrating when you realize that a lot of this interactivity is built with code that is very generic and should, by its very nature, be reusable.
In Expression Blend 3 we’ve taken a fresh look at this problem and we now have a flexible new way to add interactivity to your applications – Behaviors.
Behaviors allow interactivity to be added to elements directly on the design surface without having to write additional code. This enables work to be split much more logically amongst a project team. For example, a designer and developer can work together to define the type of interactions they need for the application—iterating quickly on their concepts. The developer then turns their ideas into encapsulated Behaviors that the designer can apply to objects on the design surface quickly and easily via drag and drop. The designer can then visually tweak and finesse the detail of the interactions through properties the developer has made available.
The same Behavior can be applied to multiple objects allowing for the rapid addition of interactivity to a project. Behaviors can also be easily shared amongst a team which allows for consistency across different designers, developers and projects, while still maintaining the flexibility of individually being able to tweak the interaction of each UI element.
Behaviors enable the developer to concentrate on writing robust, production ready code while the designer is able to concentrate on refining the final interaction rather than wasting time simply trying to get the many UI interactions simply working.
Next steps
Expression Blend 3 will install with an initial set of Behaviors including the ability to control a storyboard, change between visual states, and perform other common interface actions.
The Expression Blend SDK installs with Expression Blend 3 and provides all the information you or your development team needs to develop your own Behaviors. When completed, these can be used immediately within Expression Blend 3, shared amongst your team, or shared with the whole Expression Community at the Expression Gallery (https://gallery.expression.microsoft.com).
The Expression Gallery is a great place to start for inspiration with Behaviors and there are already some great samples to download and get you thinking about what Behaviors would be useful for you.
Learn more about Behaviors using these resources below:
For more in-depth coverage Christian Schormann and Kirupa Chinnathambi from the Expression Blend team have posted a number of posts that explore the topic of Behaviors.
Kirupa contrasts the workflow of a DeepZoom project between one that uses Behaviors and one that doesn’t. (Behaviors : Making Interactivity Easy (and Fun!); he explores how you would use Behaviors in your general workflow. (Using Behaviors : A Quick Walkthrough); lifts the lid on writing your own Triggers. (Behaviors : Writing Your Own Triggers) and in his latest post gives a detailed overview of Triggers and Actions. (Looking at Triggers and Actions)
Christian has been looking in-depth at Behaviors. His posts cover a thorough overview of Behaviors (Blend 3 Behaviors: Interactivity Without Code); followed by an exploration of the major concepts used in the creation of Behaviors including the differences between Actions, Triggers, and Behaviors (Blend 3: Triggers, Actions, Behaviors); and in his third post Christian delves into code to build a sample Action and demonstrates how this can be applied. (Blend 3 Behaviors: A Sample Action).