Windows Phone 7 Motion Design Videos

One of the things that I’m fascinated with is trying to deconstruct the motion design in Windows Phone 7. I actually came to software design out of multimedia production so I’ve always loved animations in UI design. At some point, I hope to do a series of posts overall on motion design in Windows Phone 7. Actually, I really want to do a talk about Windows Phone 7 motion design at MIX 11. Take note, powers that be.

Anyway, the first step is to get some solid video of the WP7 motion so that I can look at it closely. After 3 cameras and testing a couple different lenses, I got what I think is pretty decent video. Eventually, I’d like to pair these with the XAML necessary to recreate them, but for now I hope it helps someone.

Also, now that I’ve got this process down, if you want video of a particular animation, let me know and I’ll make it happen. Make sure you tell me exactly how to get the animation you want or I might focus on the wrong thing.

E-Mail

Animations: List Item-to-detail animation
Download higher resolution video

Video of e-mail program in Windows Phone 7 from Matthias Shapiro on Vimeo.

Marketplace

Animations: dynamic Button animation, Panorama animation, List Item-to-detail animation
Download higher resolution video

Video of Marketplace App in Windows Phone 7 for motion study from Matthias Shapiro on Vimeo.

Messaging

Animations: List Item-to-Detail animation, cascading list item swivel (in and out), main screen selection animation
Download higher resolution video

Video of Messaging Motion in Windows Phone 7 for motion study from Matthias Shapiro on Vimeo.

Main Screen

Animations: Main screen-to-application list animation
Download higher resolution video

Untitled from Matthias Shapiro on Vimeo.

Main Screen

Animations: Main Screen load in animation, application selected animation
Download higher resolution video

Opening and closing applications in Windows Phone 7 (for motion study) from Matthias Shapiro on Vimeo.