Design Athens III workshop."It's alive".

For two days we worked with 13 young designers, attendees of renowned Design Athens III conference, on the latest animation techniques as an integral part of the design process. Part I of the workshop constituted a 3 hour presentation. 

"It's alive. Designing with interactive animation".
Summary.
"Since the beginning of time, people have attempted to capture the real world. One of the most challenging tasks has been to capture things in motion. Everything in the universe appears to be in flux, so any attempt at depicting reality inherently involves depicting moving things. Following the invention of film and later animation, this task was largely fulfilled. However with the recent advent of digital design and interaction, the focus has shifted towards designing interfaces that don't treat animation as an afterthought, but rather as an integral part of the design process. Today digital designers must also be storytellers, they must treat their designs as pieces of a seamless storyboard, much like film. Today digital designers must think more like visual information directors and less like layout designers. They must learn basic storytelling and interactive animation techniques to arrive at living pieces of design that evolve, change and morph at the hands of users. The holy grail of digital design today is to find the best ways to draw up interfaces in flux and arrive at  fulfilling seamless web sites. Pages, elements and ideas that seamlessly evolve and shapeshift as users move through them. To do that one must ask some basic questions.

1. What is an interactive idea? How does a web site's data become a source of inspiration?

2. How can we use animation as a source of inspiration and a key design process rather than an afterthought?

3. How do we master the art of designing interfaces that morph seamlessly through time?

4. When we think of how users navigate through our website are we aiming for speed or storytelling?

5. How do we "pace" our designs so that users are enticed to move from one action to another, from one page to another?

6. How do we create a seamless flow between elements and pages, so that we arrive at websites that behave more like a film and less like a set of separate pages? What are the limitations to this?

7. What is a page's idle state, what can we do to bring users back?

Looking at top web sites today we can examine and dissect the characteristics of an interactive idea, explore design layouts based on animation techniques such as masking, layering and chaptering. We may apply interactive animation schemes based on basic user actions such as scroll, drag, click, hover. Finally contemplate the use of physics in our designs in order to arrive at truly human, engaging pieces of design".

Download the full presentation "Living web design"