Two years and an half ago, when I first joined Microsoft, we were getting ready to release Expression Studio 1. Expression Blend is a key product in the studio and works closely with Visual Studio. It was a great first step to support designers with visual tools to help them build rich interactive web and client. However, both Blend1 and Blend 2 were focused on supporting the final design within the production phrase. Much of the work designers do with in the ideation and early prototyping stages were not well supported.

The figure below illustrate a typical iterative design process, and the highlighted rectangle shows the final design phrase that Blend 1 & 2 supported. Many designers I talked to have this question: Would Blend support conceptual design and interaction design in the future and would it integrate with your Office suites? The answer is YES!

Blend 3 Beta was announced at MIX this year, and the SketchFlow demo generated lots of excitement among the designer community. After MIX, I couldn’t wait to get my hands on SketchFlow, and I know a lot of you are patiently waiting the release of Blend 3 which includes SketchFlow. So, l thought to record my learning experience with Blend as mini-tutorials to show you a number of things I found very useful as a designer. Hopefully, they’ll give you a quick start.

This is the first part of the SketchFlow tutorial includes topics on:

• managing Blend workspace for SketchFlow
• creating new screens in Flow Pane and link between them
• using sketch styles and integrating your sketches
• creating component screens that can be added to each screen

You can also download the video here.

Ever since John told me about the UX Roundtable event at Redmond last month, I’ve been really curious about what designers think Microsoft can do to reach out and help support the UX community in Canada? As user experience specialists (IAS, IxDs, UI designers, web designers, etc.), we have compassion for users. Often times, in order to help the users be successful, we need to know them better than they know themselves. However, the purpose of the UX Roundtable is to explore what we as designers need to feel connected and to be successful in what we do.

I want to share with you some the comments I gathered from the UX Roundtable discussion notes. I should mention that what I refer to "community" below, I mean all the UX professionals involved in the creative design process including IxDs, IAs, visual designers, usability analysts,...)

• Showing the community more of the creative process behind UX projects such as the User-centered design for Office 2007. Jensen Harris' talk on Word 2007 design was very well received at the VanUE event in Vancouver. However. past MS product talks were focused too much on the technology and not on the design process.
• Sharing Microsoft’s design processes (e.g. activities, timeline, design documents) more and creating an open/transparent reputation in the community. For example, open APIs for design patterns for others to improve and leverage.
• Helping designers show the business value of having an elegant user experience to business decision makers (CEOs and CFOs)
• Making an effort to connect to the academic UX community such as design schools and digital design/ HCI programs at universities
• Hosting design events to share best practices in design
• Improving developers’ understanding of UX and providing tools to support designer-developer workflow

Jay Goldman from Radiant Core has a very detailed and insightful write-up of the UX Roundtable event.

Qixing

We've introduced Morten Rand-Hendriksen couple of times in this blog and followed his amazing journey from learning Expression Web to a Expression Web expert. Recently, he published his first book titled  "Sams Teach Yourself Microsoft Expression Web 2 in 24 Hours" and his article on "How to create a Pure CSS Drop-Down menu" appeared in November's Expression newsletter. Both the book and the article offers practical tips to web designers and developers on how to effectively create great websites using Expression Web. Check them out and congratulations Morten!

Sams Teach Yourself Microsoft Expression Web 2 in 24 Hours

"The book is a quick read and it gives you hour-by-hour instructions on how to create a web site from scratch with Expression Web. And once you’re done, you’ll have a fully working and standards based web site at your disposal. I wrote it as the book I wish someone had written when I started out and from the response I’ve gotten so far people are learning a lot from it. Which is what I set out to do."

Morten has also created a Reader’s Companion site along with the book where the readers can download lesson files, dive deeper into the world of Expression Web through further reading, find relevant links and interact with other readers. The site is a custom WordPress installation with a highly customized theme designed from scratch using Expression Web 2.

How to create a Pure CSS Drop-Down menu

"In this tutorial you will learn to create a Pure CSS Drop-Down Menu pretty much without writing a single line of code. This is done by harnessing the power of Expression Web’s innovative and intuitive Style dialog as well as the power of CSS as a design and layout tool. What is great about the way Expression Web handles CSS is that it lowers the threshold for learning, understanding, and authoring style code and gives people with little to no experience with this code language the ability to create solid standards-based web sites. The many integrated CSS functions--including the Apply and Manage Styles task panes, the Style dialog and the CSS Properties task pane--give beginners as well as advanced users a multitude of different ways of working with this powerful code language and make it easier than ever to create compelling and functional web sites."

Yes! Windows Presentation Foundation /Everywhere (WPF/E) now has an official name - Microsoft Sliverlight.

"Microsoft Silverlight is a cross-browser, cross-platform plug-in for delivering the next generation of media experiences and rich interactive applications (RIAs) for the Web. Silverlight integrates with existing Web applications. Silverlight media capabilities include fast, cost-effective delivery of high-quality audio and video to all major browsers including Firefox, Safari and Internet Explorer running on the Mac or on Windows. By using Expression Studio and Visual Studio, designers and developers can collaborate more effectively using the skills they have today to light up the Web of tomorrow."

Check out www.microsoft.com/silverlight and top 10 reasons you might want to use Silverlight.

As I promised in one of my  earlier posts to do a tutorial on how to create a Silverlight Video Gallery, here is the mini-tutorial (about 10 mins). It has two parts:

• Use Expression Encoder 2 to create a standard Silverlight video gallery
• Customize your video gallery in Expression Blend and save it back to Encoder as a template for future use

To follow the mini-tutorial, you need the following software:

• Expression Encoder 2
• Encoder 2 SL streaming plug-in
• Expression Blend 2.5 June Preview

Watch it streaming below or download it here.

It has been three weeks since we annouced Silverlight 2 at MIX08. Many of you are excited to getting started with Silverlight 2, so I've done some research around and created the following list. I want to give special credits to Adam Kinney, Tim Sneath, Laurence Moroney, and Joshua Allen for creating great tutorials and resource lists for Silverlight 2.

Tools for Building Silverlight 2 Applications

• Silverlight 2 Beta 1 Runtime: Windows, Mac
• Expression Studio 2 Beta: the second release of Expression Studio adds a wealth of new features including support for Microsoft’s new Silverlight technology across all the tools. Enhanced designer developer workflow makes the process of building great user experience even better! You can also just download the individual components here.
• Expression Blend 2.5 Preview: use Expression Blend 2.5 to create and modify managed Silverlight 2-based applications. Expression Blend 2.5 for Silverlight 2 includes all of the features in Expression Blend 2 but has not reached the quality level of Expression Blend 2 for WPF or Silverlight 1 development. Note: here is a clear table view to help you choose which Blend version to use for your project.
• Visual Studio 2008 Professional Edition (Standard or above version will do)
• Silverlight Tools Beta 1 for Visual Studio 2008: this package is an add-on to the RTM release of Visual Studio 2008 to provide tooling for Microsoft Silverlight 2 Beta 1. It provides a Silverlight project system for developing Silverlight applications using C# or Visual Basic.  The components included are:
  • Visual Basic and C# Project templates
  • Intellisense and code generators for XAML
  • Debugging of Silverlight applications
  • Web reference support
  • Integration with Expression Blend

    Note: this will also install Silverlight 2 Beta 1, Silverlight 2 SDK Beta 1, KB949325 for Visual Studio 2008.

Tutorials

• Silverlight 2 Fundamentals by Tim Sneath: this lab takes you through the various steps of creating and packaging an application, figuring out layout and controls, all the way through to creating a mini-game using Silverlight 2. It's a good lab to get familiar with XAML, Expression and the new Visual Studio tools.
• Scott Guthrie's Silverlight 2 mini-tutorials: First Look at Silverlight 2, First Look at Using Expression Blend with Silverlight 2
• Silverlight 2 QuickStarts: includes a Silverlight Designer Preview
• Silverlight 2 Hands-on labs by Adam Kinney and Laurence Moroney: More depth tutorials for both Silverlight 2 and Expression Studio 2
• Silverlight Tutorials: the Silverlight Tutorials are designed to tell the story of Silverlight 2 with a high degree of accuracy, as it evolves during the Beta period. It is our goal to provide a compact, readable, intensive immersion into the most important new aspects of Silverlight 2. All of the tutorials (and their source code) will be available on www.Silverlight.NET and each time a tutorial is uploaded it will be announced in Jesse Liberty’s blog. You can also download Jesse’s Vista Gadget to keep up with his Blog and Tips of the day.

Other resources

• Building Rich Internet Applications using Silverlight 2 - MIX session presented by Joe Stegmen and Mike Harsh, Part 1, Part 2
• A Whirlwind Tour - Jesse Liberty's introduction to Silverlight 2
• Breaking Changes in Silverlight 2 - This topic discusses the changes made to the Silverlight runtime and Silverlight tools between the Microsoft Silverlight 1.1 Alpha September Refresh and the MIX 2008 release.
• Packaging and Application Startup - Pete Brown explores the new application model, read Part 1 and Part 2
• Dynamic Animation Lab - This is a simple lawn mowing simulation that exposes different techniques of leveraging the managed Animation API in Silverlight 2.

Demos

• Hard Rock Memorabilia - One of the most talked about demos at MIX08, welcome Deep Zoom!
• Pulse at SXSW - mashes up twitter, del.icio.us, Technorati and flickr in a very visual and useful way
• AOL email client - a full email client written in Silverlight 2
• NBC Olympics - can be seen in the first keynote at MIX08 around 1:17:00, an interview with Perkins Miller is also available
• Financial Demostrator: what the next rich banking application could be
• Taiwan Museum Project: view one of the most famous and longest Chinese paintings using Deep Zoom
• TextGlow - read Word 2007 documents online with Silverlight 2
• Silverlight.net Community Gallery - controls demo, RSS reader, SOAP Weather Widget and more
• Tunnel Trouble - a new Silverlight-based game from Terralever
• WeatherBug - designed for Silverlight Mobile, you can test the app running on the web.

Silverlight Controls

• Control Demo Page - see the controls in action
• Source code and Unit Tests for controls - download the code
• Creating Rich Dynamic User interfaces with Silverlight 2 - MIX session presented by Karen Corby
• Controls Tutorial - Another Jesse Liberty tutorial
• ListBox and ScrollViewer FAQs - all you ever wanted to know about them and more
• File Upload Component - Wilco Bauwer builds a File upload and control and shares the source
• User Controls Lab - Building Reusable Controls in Silverlight 2
• Using the Silverlight 2 Canvas - a screencast by Jesse Liberty
• Using Silverlight 2 Grids and Stack Panels - another great screencast by Jesse Liberty
• Styling Controls - another tutorial by Jesse Liberty (he's been very busy)

Hot Topics in Silverlight 2

Please refer to Adam's blog post for more developer related topics.

Silverlight on Mobile

• Mobile Devices and Microsoft Silverlight - MIX session presented by Amit Chopra and David Kline
• Using Microsoft Silverlight for Creating Rich Mobile User Experiences - MIX session presented by Giorgio Sardo
• Brad Becker interview - about the recent announcement about Silverlight Mobile.
• WeatherBug demo

Deep Zoom

• Applications = Designers + Developers - MIX session presented by Celso Gomes and Kirupa Chinnathambi , Deep Zoom heatured in the second part
• Hard Rock: Behind the Music with Deep Zoom - MIX Session presented by Scott Stanfield
• First Attempt with MultiScaleImage - Mike Taulty shows how to implement control over Deep Zoom, followed by an update
• Deep Zoom Demo - Mike Ormond shares Deep Zoom code and then adds mouse wheel support in part 2
• Deep Zoom Composer Preview
• Deep Zoom Composer Preview - User Guide

Accessibility in Silverlight 2

Accessibility has been something of a weak spot in Silverlight 1.0; with only very basic support for alt tags and default actions.  It hasn't been all bad, since this led developers to use Silverlight with "Plain Old Semantic HTML" in a progressive enhancement pattern -- which will continue to be useful in some scenarios going forward.  But the range of options for accessible development increases substantially with Silverlight 2.

Bill Buxton talks about the difference between “Sketch” and “Prototype” in this his Sketching User Experiences. (see the summary below)

I agree sketching is an important part of the design process, but often times it’s hard to share our paper and pen sketches and get feedback from others. Following Part I of the SketchFlow tutorial, this tutorial demos the SketchFlow player and different ways designers can share their design ideas.

You can also download the video here.

At WDN08, I had a chance to sit down with Indi Young, one of the founders at Adaptive Path, to chat about Mental Models. Through her talk "Innovation is Overrated," she first set the stage to understand innovation. Two of the characteristics of great innovations are that innovations come from crafting details and focusing on people. Mental Model is a great illustration of both ideas. In our conversation we chatted about what are mental models, how are they used in the design process, and different ways to collect data to form mental models. If you can’t see the audio player, it’ll prompt you to download the Silverlight plug-in once. You can also download the plug-in here.

The following is an example of the Movie Goer Mental Model Indi showed during her keynote. Check out her presentation slides.

Indi began her work in Web applications in 1995 as a consultant in interaction and navigation design. A founding partner of Adaptive Path in 2001, she has worked with an impressive collection of clients, including Visa, Charles Schwab, Sybase, Agilent, Dow Corning, Microsoft, and PeopleSoft. Since 1995, Indi has constructed over 30 interview-based research projects, 22 of which included mental model diagrams. She considers this methodology she has developed another good way to be a “problem solver.”

Indi is the author of the soon-to-be-released Rosenfeld Media book Mental Models: Aligning design strategy with human behavior

Functioning Form is one of my favorite design blogs, last Friday author Luke Wroblewski summarized Design Principles from three Microsoft products: Windows 7, Office 2007, and Surface, which I reposted below. I’ve also included the MIX sessions that talk about the design thinking behind each of these products in detail.

While Microsoft itself admits to design challenges in some of their products, the places where I saw design principles in use produced some pretty interesting product designs. In particular: Windows 7 Desktop, Office 2007, and Microsoft Surface.
For the Windows 7 desktop design, Stephan Hoefnagel showed the following principles in action:

1. Reduce concepts to increase confidence
2. Small things matter, good and bad
3. Solve distractions, not discoverability
4. Time matters, build for people on the go
5. Value the full lifecycle of the experience
6. Be great at “look” and “do”

1. A person’s focus should be on their content, not on the UI. Help people work without interference.
2. Reduce the number of choices presented at any given time.
3. Increase efficiency.
4. Embrace consistency, but not homogeneity.
5. Give features a permanent home. Prefer consistent-location UI over “smart” UI.
6. Straightforward is better than clever.

• Evocative: Principle of Performance Aesthetics
• Unmediated: Principle of Direct Manipulation
• Fast Few: Principles of Scaffolding
• Contextual: Principle of Contextual Environments
• Intuition: Principle of Super Real

• Social: multiple simultaneous users
• Seamless: digital & physical combined
• Spatial: kinesiology

Thanks for Ben's comment to my last post and a reality check! :) The new download center with Silverlight is in its beta, there are a number of usability issues we need to improve on especially that there are no accessibility features in the current version. With that said, the comment got me thinking about the real value of Silverlight from a user experience perspective. I'd like to give my 2 cents and keep the discussion flowing.

I totally agree with Ben that we shouldn't do something just because we can. In the case of Microsoft Download Center,  can we improve users' experience when they visit the center with Silverlight? First we need to understand user needs.

There are three main types of users come to use the download center:

• Searcher: know exactly what they want to download and want to find it as fast as possible
• Browser: know the general category or partial name and want to have a way to browse through and find it quickly
• Surfer: no particular target in mind and just want to find out what's new

For all three types of users, it's important to be efficient. The site needs to present the options clearly, so users know how to take the initial actions and find what they need quickly. For example, Searchers will go directly to search. With that in mind, I compared the Silverlight version (SV) with the original version (OV) of the download center to investigate what has improved and how Silverlight is and could be used.

Microsoft Download Center Silverlight Version		Microsoft Download Center Original
	VS.

Less is more - efficient navigation and better use of screen real estate with smart Silverlight widgets

• The OV has quite bit of wasted screen space such as the gray area in the image above. There's a lot of information squeezed into the narrow content column. Since the page is static, many product links are forced to be present on the page and visible all the time, making the homepage became very long. For example, a user wants to browse the products in Windows category. In OV, the user has to leave the current page and go to a new page that has the complete list of Windows products (3857 in total!) to find what they want. In SV, the user can simply click on the "Browse Download" button on the homepage. A Silverlight overlay panel will appear for the user to choose either browsing  alphabetically or browsing by categories. They can further narrow down the products they want in the category list and get a much more manageable list without leaving the homepage. See the figure below on the left.

• The site navigation on the homepage is another example of using Silverlight to hide information and reduce complexity to help users navigate more efficiently. In OV, the top and secondary navigation are listed together in the left navigation panel and people may spend more time deciding whether they want to choose from "Product Family" or "Product Categories." The two terms have minimally different, and it's confusing to me to have them in the same navigation panel. More importantly, there's no easy to way to go to other parts of Microsoft.com site from the download center. Typically, users have to leave the Download Center and then either go to Microsoft.com homepage  or go to the site map as their starting point to navigate from there. In SV, navigation options are all located at the top right Silverlight navigation panel (see top right image). Users can choose whether they want to navigate all Microsoft sites or just within the Download Center. Since the panel is collapsible, it didn't take more screen real estate to have the extra navigation options. Also, this panel exists in all parts of Microsoft.com sub sites, there's a consistent experience. Although one would argue that the overlay or collapsible panels can all be implemented in AJAX. The differences are how easy to create these elements and how reusable they are.

• With Silverlight, it's easy to create dynamic banners. Instead of having several static images of new downloads in the top banner like in the OV, we can reduce the visual clutter by using animated banners. The current SV implementation uses a slideshow view. Another option is to use carousel display to focus on one item at a time while having other items in the background.

• The overall layout in SV is much simpler and more attractive than OV. For instance, the Search option is more dominant. Since Search is probably the most important feature for the download center, it needs to be obvious. In the old design, Search is above the top banner, which is very hard to spot if you are not familiar with the site. This may have less to do with Silverlight but more to do with layout design, however, because the nature of XAML for UI mark-up. The canvas layout element allows very flexible placement for elements within. It's very easy to add and relocate elements to support updates for the site.

Take it even further - desktop like rich experience

In order for users to truly benefit from Silverlight's rich experience, we need to take the design even further than the current beta site into areas that are even harder to produce with traditional web technologies. I thought of couple of scenarios to illustrate my point:

•  Wizard guide for downloading. For users that have trouble finding what they need or don't know where to start, a on-demand wizard type of help can guide users to narrow down their choices according to what they want. There could be video tutorials as well showing how to use the site most efficiently or the download procedures. Instead of reading the "Read Me" file, they can now simply watch/listen a one-minute video.
• Support organic growth and scalability of the site. As more and more products are available for download, Silverlight could be really used for creating effective visualization to help users find what they need. For example, in the browsing Windows products example I mentioned earlier, right now the navigation list is embedded in a scrolling panel which is not efficient for navigation. Some sort of visualization techniques implemented in Silverlight such as fisheye view could help users to navigate more efficiently.

Besides the business reasons, I do see the value of using Silverlight in Microsoft Download Center from a user experience perspective.The key is to use Silverlight's rich capabilities to serve user needs not for the sake of using new technology.

The idea of creating rich interactivity without code should sound very appearing to designers, because we want to turn static UI into interactive prototypes and test out our design ideas quickly. In Blend 3, “Behaviors” are packaged, re-usable building blocks of interactivity. They can be visually applied to UI components in the application using drag and drop. No more opening up Visual Studio and writing routine code like starting an animation when a button is clicked. Blend 3 will have bunch of commonly used Behaviors shipping with the tool, but they are extensible so that you or your developers can create your customized Behaviors.

After watching Peter Blois’ MIX talk “Creating Interactivity with Microsoft Expression Blend,” I experienced the power of Behaviors myself in the tutorial below. For example, I used 3 different triggers( Mouse Click, Timer, and Mouse Gesture) to play the slideshow behavior. You can download many interesting Behaviors that the community are making at Expression Gallery page.

You can also download the video here.

I’m very happy to tell everyone that Expression Web is now available to MSDN premium subscribers. Expression Blend will become available as well once the product ships in Q2 2007. Several people asked about this on Monday night when I was attending the TechNet chalk talk on Microsoft Application Platform. During the event, I had a chance talk to a group of IT managers about Expression Web. They seemed excited to know that Expression Web is not another version of FrontPage and that it offers advanced CSS support for building standards-based websites. However, their next question is: is it going to be available for MSDN premium subscribers? Now I’m delighted to say “Yes.”

Here is a quick briefing on Expression Studio if you are not familiar with it. Expression Studio is designed to help creative professionals collaborate with developers to create rich user experience on the web, desktop, and beyond. It greatly supports designer-developer workflow in the development cycle with a family of four tools: Expression Web, Blend, Design, and Media.

Although the targeted users of Expression are designers, I think it’s a great idea to let developers access and play with these tools (at least Expression Web and Expression Blend). Once developers get familiar with the tools that designers use, they have a better understanding of what can be accomplished with these design tools without backend implementation. Many developers are designers (or vice versa), and Expression tools such as Blend allows them to create compelling designs quickly which can be easily used in development. This lets them spend more time evaluating the usability of their designs. It’s a great chance to broaden the design community and encourage more developers to care about user experience.

Other blog articles on the topic: Listening to your feedback - Expression and MSDN, Designers and Developers

Audrey Carr took some time to give great guidance on the communities expectations for the role.   As we are investing in someone right out of school these are the people you will have to work with, show your passion and connect to!  

Have a look at the post!

John

http://audreycarr.ca/?p=9

Microsoft User Experience Advisor - Where’s the User Experience?

In a move to embrace the Canadian UX and design community, Microsoft recently announced a job opening for a User Experience Advisor intern to promote it’s upcoming Expression software lineup.

But here’s my problem: as far as I can tell, none of the candidates have demonstrated any knowledge of user experience or the needs of the user experience community. Wake up! It’s not about you or your resume - I want to know that you can empathize with and understand my needs as a designer, information architect, or web developer. If you want to talk to creatives, you need to understand the design process and how Microsoft’s new tools fit in to the larger picture. For a primer on innovative and creative thinking, why not learn from the best: check out what IDEO’s Tom Kelley has written about the power of design in solving tomorrow’s business problems: The Art of Innovation and The Ten Faces of Innovation, and learn what design thinking is all about.

Where to Start?

So, if you’re thinking of applying, check out the CANUX2006 conference blog and learn about the latest issues in our community. Also, how about conducting some preliminary user research? Send a friendly email to the UXIrregulars group and ask us about our needs. We’re more than willing to help and can’t wait to hear from you!

EnergizeIT was a lot of fun and especially got the crowd energized during the demo competition after the keynote in the morning. I had the opportunity to design logos for all three demo competition teams in Expression Design 2. I've never had any graphics design training, but playing with the design ideas and drawing tools, I found myself really enjoying logo design. Although I had to keep secret about the designs before the competition, I can share my design concepts with you now and introduce my two favourite features in Design.

Team: Connected Road Warriors	Team requests for the logo: looks like a military badge reflects software + service (i.e.Windows Live) idea Design concepts: warrior holds sword, replacing sword with USB cables connects service (i.e. Windows Live) with software on the desktop highlights software + service and places warrior with simple outline in the background uses gold and blue colour and shadow to create military badge look
Team: Shell Shocked	Team requests for the logo: uses AC/DC fonts incorporates Powershell logo elements hard rock look Design concepts: a burning heart that's bleeding looks hard rock and eye catching (I found the heart illustration in Office Clip Art) places Powershell logo element (">-") in the middle of the heart to suggest "Powershell" places AC/DC signature lighting elements on the heart to reflect the "Shocked" idea vertical placement of the text is to make the look unified and unique
Team: Code Ninja	Team requests for the logo: combines the idea of "code" and "ninja simple and powerful uses Japanese Kanji for Ninja Design concepts: I had a few ideas for the design and the final logo went with the one on the right with white box outline. My favourite design is actually the one with single katana (one on the lower left). On the blade of the katana is a string of "1s" and "0s" to suggest "code." The one in the upper middle has an interesting placement of the two characters which represent "Ninja." I filled one of the character with "1s" and "0s" again to suggest "code."

Throughout my designs for these logos, I really liked the "Colour Dropper" tool in Expression Design. Not only you can drop colours with existing colour swatches but I also used it heavily for capturing colours in real photographs then drop them into my drawing shapes. It's like magic. :) The second feature I found very handy is the "Selective Export" function. I was able to compose many alternative designs on one canvas and select any one or more components on the same canvas to export into different images types. No need to turn on or off layers to make sure you export the right objects.

It’s survey time. Wait! Don’t run away yet. It’s a survey to ensure that our team correctly identifies opportunities that would be of interest to you and discover what level you would be willing to share insights and collaborate across our programs, activities and in the community.

Simply put by my college Joey DeVilla on his blog: “Microsoft Canada Wants to Pick Your Brain!” And he has great images to convince you. :) Help us to better work and connect with you by complete the short survey here.

Microsoft Canada and our corporate head office will be opening a software development centre in Greater Vancouver, BC. The Microsoft Canada Development Centre will open in the Fall of 2007 and will be home to software developers from around the world.

This fantastic news was announced earlier today. I think this is such a great move for the company and for the Vancouver Hi-Tech industry. Vancouver has always been branded as one of the best places to live on earth. The living environment will definitely attract a lot of IT workers. At the same time, Vancouver is very multicultural, a true global gateway. Thus, the development center will attract international talents as well. International students can also leverage the BC Provincial Nominee program to become Canadian Permanent Resident and work and live  in Canada for long term. EA, IBM, and Nokia (see David's list for more) all have development or R&D centers in Greater Vancouver area already. I'm happy to see MCDC is one of the handful development centers outside of the States.

Cheers, Qixing

I went to the season kick-off of Waterloo User Experience Group meeting last night. The session is called "UX ChitChat" - cute! One topic we chitchatted was what takes someone to be a UX designer? This is a popular question and have been asked by people not only try to get into the field but also asked by people who have been doing UX design for years. The latter takes one step further and asks the question: what does it take to be a great UX designer.

This is certainly a topic that closes my heart. I'll link my opinion with some inspiring resources on the topic. The most important trait (or UXNA) I think for a UX designer to have is compassion for users.  You need to be the advocate for users and it comes very naturally. For example, if you hit a confusing road sign, a hard to navigate website, or even those teapots in Chinese restaurants that are so hard to pour out tea without spilling it, you think about the poor experience users suffer. You also feel strongly that there should be a better design for this! Richard Ziade describes very nicely in his post (i.e. Design is...) about what separates a good design from a bad design.

Everyone is a designer in a sense. But what separates good design from bad design?...Good design is about taking the time and energy to see through another's eyes and create something that sympathizes with how they think. At the risk of sounding hokey: Good design is thoughtful and compassionate. The beneficiary of a good design experiences something very unique. A good interaction experience creates an emotional bond and loyalty to the creation that is really, if you stop and think about, a bond with it's creator. "Someone took the time to think about what I need and worry about how I think."

With the UXNA, you also need proper training and experience to be a UX designer. Dan Saffer from Adaptive Path has a great article on how to be an interaction designer. It gives an overview of the profession, necessary training and experience you need with lots of great resources listed in the article. I think there are three skill areas for UX design:

• User research: researching both users and markets through focused groups, interviews, filed investigation, scenario analysis, problem definition, brainstorming, requirements gathering
• Interaction design: storyboarding, wireframing, prototyping, visual design
• Usability testing: designing usability tests, data gathering and analysis, reporting testing results and design recommendation

A good designer will have experience in all these areas and is an expert in one or two areas. Many UX designer job posts list these similar skills. Form my experience, in grad level CS Human-Computer Interaction (HCI) field, we are trained in all these skill areas but focusing less on how to use different design tools in the Interaction Design phrase. Whereas college/university level multimedia design programs have more hands-on practice on tools such as Adobe CS3. However, they usually don't teach various user research methods and how to conduct formal usability study. The missing skills can be learnt from either taking a specialized course or on job training.

Here are some of my favorite UX blogs: