MIX07 Breakout Sessions Recap #1: WPF in Real World Development

So, MIX was in April, and sometime has passed since then. However, there was so much great content presented in the conference that one needs time to go through and digest. Also, there were a few sessions that were recommended by others I couldn't go because they were conflicting interests with other parallel tracks. The good thing is all the breakout sessions are available at MIX site and there are different options to download and view.

Starting this post, I'll recap some MIX07 breakout sessions that I found most interesting. First stop is Window Presentation Foundation in Real World Development  co-presented by Frog Design and Yahoo!. 

image

Summary:

This presentation focuses on the workflow of a team of project manager, designers, and developers building a new Yahoo! Messenger for Vista desktop. The team was composed of designers (Design Analyst, Design Technologist, and Visual Design) from Frog Design and project manager and developers from Yahoo!. They had 55 days to create a "almost real" product to demo at CES. In the presentation, they shared the insights how different roles work concurrently with detailed examples and the pain points during the collaboration. Yahoo! Messenger is one of the earlier real world examples of WPF applications, so it's great to hear the team's experience working with emerging technology and tools. Everyone on the team now have more than one-year of experience working with WPF and Expression Studio.

Key Takeaways:

  • Traditionally, in Frog Design, developers mainly help designers to create high fidelity (HI-FI)prototypes. The new workflow in Expression Studio allow designers to move away from simulating design (e.g. throw away HTML and Flash code) to actually developing their designs.
  • All the team members in the project work concurrently since day 1, which was quite different from traditional workflow. The Design Analyst designed the information flow using wireframing in Visio, The Visual Designer used Photoshop to create visual assets, and the Design Technologist created working prototypes using Expression Blend. They can all work independently.
  • Some creative experience in the new Yahoo! Messenger: using multiple-column view when the messenger window is enlarged, using animated color-picker for easy user customization, "Show and Tell" feature provides great photo sharing experience (e.g. photos can be extracted from online Flickr accounts), and users can drag frequent contacts in Vista sidebar for close connection without having the main messenger window open.
  • The biggest lesson learnt for designer and developer collaboration was that the design should be modulated and save as user controls before prototyping. For example, if the designer is only working on the animated color-picker, having the whole application UI open in Expression Blend would cause a lot of overhead in terms of testing and collaboration with developers. I'm personally very interested in seeing how Expression Blend can be used for fast, rich, hi-fi prototyping. I'll try to gather some best practices on the subject along the way.

Further Reading: