Canadian UX Blog

[Mini-Tutorial] Blend 3: Rich Interactivity with No Code

qixing — Tue, 30 Jun 2009 23:35:02 GMT

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.

Technorati Tags: Microsoft Expression,Expression Blend 3,Behaviors,Mini-Tutorial

[Mini-Tutorial] Blend 3: Visual Data Binding

qixing — Mon, 29 Jun 2009 13:27:32 GMT

As your project evolves from simple sketches to prototypes, you may want to add some real interactivity to it. There are two useful tools in Blend make this really easy: Sample Data and Behaviors. This tutorial will focus on Sample Data and how designers can bind data visually in Blend. The next tutorial will be on Behaviors.

In previous version of Blend, we introduced data binding features in Blend. However, in order to make sample data targeted to particular applications, designers had to create XML data files in Visual Studio or other editors and then import into Blend. There was no easy way in Blend to generate the sample data they need. Check out how Sample Data makes this process easy in the tutorial below!

Technorati Tags: Expression Blend 3,SampleData,Microsoft Expression,Mini-Tutorial

[Mini-Tutorial] Blend 3: SketchFlow Part II

qixing — Sun, 28 Jun 2009 14:36:35 GMT

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.

Technorati Tags: SketchFlow,Blend 3,Mini-Tutorial

[Mini-Tutorial] Blend 3: SketchFlow Part I

qixing — Sun, 28 Jun 2009 14:21:09 GMT

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

Technorati Tags: SketchFlow,Blend 3,Mini-Tutorial

SketchFlow and Blend 3 Presentation at Waterloo

qixing — Fri, 19 Jun 2009 16:47:21 GMT

So, you have a great design idea…
How do you turn your conceptual design ideas into rich prototypes ready for production?
How do you share your design ideas with others effectively at each stage?

Come and join me next Thursday at University of Waterloo Accelerator Center to learn about the answers to these questions. I’ll introduce a new component in Expression Blend 3 called, SketchFlow. It is a fun, flexible and powerful way to sketch and prototype rich and dynamic interactivity into your application. Come and learn how SketchFlow allows you to quickly iterate on your designs and share these designs with your colleagues for feedback. Previous knowledge in Expression Blend is not necessary.

In particular, I’ll cover the following topics:

create your design sketches and navigations in SketchFlow
share your design in SketchFlow player and receive feedback from others
export your design into Word as specs
create behaviors and effects Blend 3
visual data binding and sample data usage in Blend 3

Here are the event details:

From Concept to Production: Prototyping with Expression Blend 3

Time: 5:00-7:30pm, June 25
Location: Accelerator Centre Main Foyer, 295 Hagey Blvd. - Behind the Columbia Ice Fields. Food and Beverage will be served.
Registration: RSVP for this free event by registering online at http://ic.infusionangels.com

See you next Thursday!

Technorati Tags: SketchFlow,Blend 3,UX Design,UX Prototyping

Design Student of the Month – Jin Fan

qixing — Tue, 16 Jun 2009 17:36:37 GMT

There are a lot of creative students in Canada who are doing innovative work to improve people's life through interactive, visual, informational, and other aspects of User Experience Design. I invited them to introduce who they are and share their work with you. To nominate a Design Student of the Month, email us. The Design Student of the Month for June 2009 is Jin Fan! Congratulations!! Let's hear from Jin.

Who’s Jin?

I am an undergraduate honors degree candidate who is in my final year of completing my Bachelors of Science degree with a specialization in Interaction Design. I currently reside in Vancouver, British Columbia, where I study in the School of Interactive Arts and Technology (SIAT) at Simon Fraser University (SFU). I love being creative all the time and searching for new opportunities. Interaction design is such a diverse and interdisciplinary field. By studying it for more than four years, I have had experience learning a broad range of subjects from human computer interactions, usability, information visualization, design methodologies, cognitive science to communication design, human factors and so on. The collaborative learning environment in my program not only allows me to work with colleagues with different skill-sets and academic background, but also allow me to see how interaction design brings a new dimensions to benefit people’s life and the society at large.

What cool stuff is Jin doing?

Last year, my partner Kevin Muise and I attended the 2008 Microsoft Imagine Cup global final in Paris, France. Our GreeNet Facebook application design along with the proposal of re-designing an air pollution system for seniors during the 24-hours final competition made us won the 2^nd place in the Interface Design category. Kevin and I are continuing our research and study in regard to energy visualization and sustainability. Currently, we both are involved in a project of developing an adoptive living interface for a solar powered home.

Last week (June 9-10), two of my projects, Bike App and The Looking Glass, were selected to showcase to the public as part of the Made in Brunel competition in London, UK. The two projects were published in the book Made in Brunel 2009: Thinking Out Loud. Bike App is a fitness iPhone application, which allows biking enthusiasts and iPhone users to enhance their workout through real time scenic and data visualization. Whether it’s hitting the trails on a sunny day or hopping on a bike at the gym for some cardio, the application uses iPhone’s built-in microphone and GPS capabilities to processes heart rate and calorie data into visually motivational and informative displays. As the lead designer of this project, I designed the graphical user interface and the navigations for the prototype.

In addition, I have also explored some other area of interaction design and its approach in terms of user-oriented design process. The design of the Droog showroom was an example of integrating interaction design approach on designing architectural environment. My team tried to explore and consider how people interact within a space and how a well designed space can enhance and encourage positive behaviour.

This short video below highlights some of the projects I have worked on at Simon Fraser University.

What are Jin's plans after graduation?

I look forward working in a creative organization and developing my specialities in the area of interaction design and user experience. I want to bring my passion in design to my future workplace and one of my goals is to contribute positively to people and society through better design and user experience.

Want to learn more about Jin?

I can be contacted via email at jfan.info@gmail.com or visit my website at www.sfu.ca/~jfa2

Technorati Tags: StudentoftheMonth,Canadian,Interaction Design,Simon Fraser University

Designers are Evangelists

qixing — Tue, 09 Jun 2009 01:53:08 GMT

Do you think designers are evangelists? Outside of the religion context, an evangelist “is a person who enthusiastically promotes or supports something” according to Wikipedia. Based on this definition, we designers are obviously User Experience evangelists. The slide below is from the training that new designers take at Microsoft, which explicitly calls designers are evangelists.

Why is important for designers to be evangelists in their teams? In addition to the reasons provided on the slide, I think it’s the best way for UX design to scale in a software development team. Think about the designer-developer ratio in any development team, most of time is 1: many. Although designers create the overall software UX design, developers build the final UX in the product. If designers can help developers understand good UX practice and the design rationales behind, it will result in an end-to-end high quality user experience. Especially when a team is working on a large product, designers usually cannot design every aspect of the product and rely on developers to make good UX design decisions.

Evangelizing UX design and Microsoft UX technologies is my daily job. I think “Influence” is the most useful skill for designers to evangelize in their teams.

Influence

The graph bellow illustrates that there are limited things we can control, but there are more things we can influence than control. The larger their sphere of influence is, the more likely someone can achieve their desired results. In the context of a software product team, maybe it’s more effective for designers to focus on influencing an experience rather than feeling the need to control it.

But how to influence others effectively? Here are my tips:

Your influence power grows when you have more people stand by your side. For example, if you have a User Researcher or a technical writer working on the team as well, then he/she could be your best ally.
Most of the time, you are influencing without authority. Maintaining a great relationship in the cross-disciplinary team is critical.
In order to influence others with your design ideas, you need to clearly and creatively communicate your ideas. If you are influencing others with your design principles, make sure the principles are easy to understand and placed in handy locations where others can review them often. Also, consider communicating your design ideas in different formats (e.g. online or offline) according to the audience you are talking to.
Build your credibility in the team by providing guidance and support to others. Don’t just focus on what you are doing and your portion of the project, providing help to others when necessary will help you grow your influence power in the long run.

Why not start practicing your influencing skills with the tips above and be the UX evangelist in your team!

Technorati Tags: UX Evangelists,designers,influence

How to Best Work and Connect with You?

qixing — Wed, 03 Jun 2009 22:12:24 GMT

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.

The Art of SEO and IIS

plaberge — Wed, 03 Jun 2009 18:55:00 GMT

If you develop/design public websites for your customers, you likely already know first-hand how important a good Search Engine Optimization (SEO) strategy is to its success. Generating traffic to a website is hard and is downright impossible to do well without making it easy for internet search engines like Bing, Google or Yahoo! to find the content on your site and index it properly for search queries.

Anybody that has been following most of the events I have been presenting of late knows that I think the Microsoft Web Platform Installer (WPI) is kind of a big thing. If you’ve seen or played with the WPI, you know how useful it can be for laying the groundwork for you to build your web solution on top of. If you haven’t seen it yet, it may interest you to watch my webcast on the WPI on-demand here. You may be wondering how the WPI and SEO are linked. Well, today, Microsoft announced a new feature added to the WPI called the IIS Search Engine Optimization Toolkit. You can download the SEO toolkit on its own from the link, but most web developers/designers building a site hosted on IIS will use the WPI to install it.

The initial announcement of this new feature of IIS came from the blog of Microsoft’s corporate VP for the .NET Developer Platform and serious technical wizard, Scott Guthrie. He gives a very detailed tour of the IIS SEO Toolkit in that post so if you want to know the nitty gritty details, I would invite you to take a look at the post.

In a nutshell, the IIS7 SEO Toolkit can:

Improve the volume and quality of traffic to your website from search engines
Control how search engines access and display your web content
Tell search engines about locations on your site available for indexing

The IIS7 SEO Toolkit contains:

Site Analysis tools to help you identify and fix SEO-related issues on your site
User friendly tools to manage robot and spider exclusions
A user interface for sitemaps and managing sitemap indices

Below are important links for the IIS7 SEO Toolkit:

So if you’re building public websites where traffic is an important consideration, you may want to check this tool out.

-Paul

Search It with Bing

qixing — Mon, 01 Jun 2009 22:26:05 GMT

Bing is the new Microsoft search experience and it’s live now for Canada! I’ve been using it for a while internally as Kumo. There’s already very lively conversation on Twitter about Bing. Some people like it after giving it a try and see the improvements we are making in search experience. Others are very skeptical about the new brand. I have to say I wasn’t sure about the name Bing at first, but then I got to know the reasoning behind, it suddenly made a lot of sense.

Why called Bing?

Bing is the ringing of a bell that signals the “aha” moment when a search leads to an answer. It’s the “sound of found” – short and simple, which functions well as a URL. In China, we added two Chinese characters to the name “必应 Bing.” The Chinese character 必应 is pronounced “bee-ying” and its meaning is derived from the last two characters of a Chinese proverb “有求必应,” which means - Ask and you shall find – very fitting :-).

Why new search UX?

As a UX designer, I used to think search experience should be as simple as possible because you want users spend less time on your search page but more time on the destination pages, there’s not much innovation space in search UX. However, Bing changed my opinion. There’s so much more we can innovate to help users in the “Search, Find, Decide” workflow cycle. Here are some examples:

1. Many people set their browser homepage to be a search page (e.g. google.com) because the most frequent task they do when opening a browser is to search. Why not make the homepage experience more pleasant and dynamic by showing a different background picture everyday?

2. The search result page layout - think about this page as the hub for everything related to a particular search query. In this case, the common user activities when search for “Toronto blue jays” should be present on this page. For example, a user may want to see when is the next game or go to the blue jays ticket page. The goal is that users shouldn’t need to conduct another related search query to find what they need.

3. Instead of searching for Air Canada and then searching for the flight number on the Air Canada website, finding a flight status by searching it directly on Bing. Help users to find the information they need with the least amount of search.

4. Help users make better decision after searching by providing contextual reviews. In the example below, I searched for a Sushi restaurant in Vancouver and was able to preview the exact location and customer reviews of the restaurant.

5. Search within Search -this feature is not yet available in Canada, but I hope soon. Most people go to Amazon.com to search for things to buy. Why not make this easier by letting users to search directly on the search result page?

Now I think sky is the limit for search experience. There’s plenty of room for innovation around how we can connect search with other related user activities such as decision making, how we can support search experience based on people’s preference and intension, and how we can make search a connected experience on web, desktop, and devices.

Search it with Bing and let me know what you think. Let’s improve our search experience together.

Other suggested readings for Bing:

How Microsoft's Bing came to be
Behind Stories of Bing at DiscoverBing.com: there’s a video on Designing the UX of Bing
An Inside Look at Bing by Canadian MVP Miguel Carrasco
WATCH: Steve Ballmer Unveils 'Bing' Microsoft's New Search Engine

Technorati Tags: Bing,Search User Experience

TechDays Expands to Another city in 2009!!

qixing — Mon, 01 Jun 2009 20:58:08 GMT

TechDays 2008 was such a success that we had many comments and feedback that we should expand it to more cities. Given our goal to support your development with skills growth, connecting you with your peers and experts to share insights and lessons learned, as well as helping your continued learning journey with the learning kit, it made sense to listen to this opportunity. We have been planning TechDays 2009 since January and as part of the planning process, we also did a capacity review. Going through the capacity review we realized that we could grow and support up to 8 or 9 cites with a limit of only adding one per year. As soon as we found this out, we reviewed all your emails and comments around this area….and there were lots.

Personally, I received over 1000 emails. From the review, it was clear that the two cities with the loudest voices were Edmonton and Halifax. As an FYI other cities for which we received feedback included Quebec City, Moncton, Victoria, Saskatoon, Waterloo

and Regina. I then directed our team on two paths to find out which city was going to be added this year. Barnaby Jeans lead the data and analytics with John Bristowe, Damir Bersinic and Rick Claus leading the community outreach.

I never thought that this outreach would go to the levels that it did. From the passionate emails, support from local venues to the broad social media groundswell - it was amazing. I wish that I could choose both, yet we just can’t support adding two cities this year. There was passion from both cites and with the data and analytics correctly hitting the numbers, we needed to go forward with the only differentiator -- the community voice.

The city that won started out behind and surpassed the other with their connected community outreach. They went past the city perspective and rallied as a larger entity…..The Maritimes. Yes, I’m proud to announce that on November 2 & 3, 2009, TechDays 2009 will be in Halifax.

Both cities were represented very well! As a result of the great community response, I feel that everyone who took the time to raise their voice should be recognized for their efforts! You know who you are, and in addition to our thanks, please reach out to Rick, Damir or John and they’ll extend to you a special Directors TechDays discount offer to attend TechDays 2009. Please note the offer will be valid during the pre-registration period from June 15 until July 1.

Thanks again for all your feedback and support for TechDays. Stay tuned for more information for early bird registration coming in July! For those that attended last year watch your inbox mid to late June for a special thanks for your loyalty!

John

John Oxley

Director Technical Audience Marketing and ICT Evangelism
Microsoft Canada | Direct (905) 363- 8589|Messenger joxley@microsoft.com | twitter:joxley

Vancouver / Toronto Event: Make Web, Not War Episode 2009

plaberge — Mon, 01 Jun 2009 11:42:51 GMT

As a solution provider, the web presents an ever increasing opportunity to grow your business. As more and more customers (and potential customers!) look to the web as a way to broaden their message, increase their own revenue and lower their cost of doing business in general, you have the opportunity to make a real impact to those businesses with the skills you have in building web solutions.

It is for this reason that Microsoft Canada has created the Make Web, Not War Episode 2009 in-person event. We know that Microsoft technologies are only part of a larger ecosystem of web platform technologies out there. What many people may not realize is that Microsoft is playing an ever increasing role in reaching out to web solution providers that aren’t traditionally building web software on Windows.

Make Web, Not War Episode 2009 is a 2-city tour reaching out to web solution enthusiasts, whether you build your solutions on Windows or not. The Vancouver stop is on Tuesday, June 2nd and the Toronto stop is on Wednesday, June 10. For details on the specific agenda items for each of these cities, please visit the website but in a nutshell, we have a number of speakers from both enterprise and open source communities speaking about how Windows is a great platform to build web solutions on. It will certainly not be the only platform you will likely build web solutions on, but you may very well find that expanding your skillsets to include providing Windows-based web solutions may well be worth your while.

Value Proposition:

Hear from other Web Partners who build on Open Source & Microsoft technologies
Network with fellow members of the Web Community
Learn about the latest Microsoft technologies & how they work with Open Source
Get technical training to build your Web Development portfolio
Win prizes & get your Web Warrior DVD of all the latest Microsoft Web Resources

Some of the topics we’ll be covering between Vancouver and Toronto:

Building great WordPress sites with Expression Web (Vancouver)
How DigiTweet (an open source WPF-based Twitter client) was built (Toronto)
The business opportunity on the web (Vancouver and Toronto)
How Windows Hosting can help you build web solutions and your web business (Vancouver and Toronto

There is still limited seating available for both Vancouver and Toronto, so if you’re interested please register online at Make Web, Not War Episode 2009!

Opportunity Rings – WIT Event

qixing — Tue, 26 May 2009 23:59:20 GMT

Continuing connecting with women in IT, we have a joint event next month with IAMCP's Women in Leadership and Technology and CATA Women in Technology groups. We intend this to be a fun evening of networking, empowerment and finding the courage to follow your own dreams.

The evening will include a light snack and will feature a book reading from Sheryl Steinberg, journalist and author of the novel "Opportunity Rings", a light-hearted look at finding our strengths through our adversities.

This is Sheryl's first book and came to life in spite of many people discouraging her from continuing with the project. We are pleased to be part of promoting a Canadian author with her debut novel.

In small break-out sessions, we will each have a chance to explore our own personal goals and to discuss and share with others what (if anything) is holding us back from living our personal dream. You will walk away with at least one idea of how to make your own dream a reality.

Come and join us!

When: Tuesday, June 16th

Time: 5:30pm to 8:00 pm

Where: Microsoft Corporation, 1950 Meadowvale Blvd., Mississauga, ON L5N 8L9 (driving directions)

Register here.

[Podcast] Microsoft Designer: Aaron Woo from Windows Mobile Team

qixing — Mon, 25 May 2009 22:15:55 GMT

There are about 750 UX designers and researchers working at Microsoft. People in the UX community are often very surprised to hear about it. I think part of it is we haven't given our designers enough opportunities to talk about what they do and what's it like to work as designers at Microsoft. During my spare time when visiting Redmond, I try to talk to as many designers as possible from different product teams and share with you their stories.

In this episode, I chatted with Aaron Woo, who is a UX Designer at the Windows Mobile Design Team. In our 15 minutes conversation below, we talked about the following topics:

What’s your role and responsibilities?
Why did you decide to join Microsoft as a UX Designer?
What are some design challenges for designing mobile interfaces?
What’s it like to work at Microsoft as a designer?
What’s the collaboration like within the design team?
What contributes to a great designer?

Aaron’s Bio:

Aaron Woo is an Interaction Designer on the Windows Mobile design team working on the next version of Windows Mobile. Before coming to Microsoft he graduated from the University of Washington with a BFA in visual communication design. He is currently entering his second year working full-time at Microsoft.

Technorati Tags: Microsoft Designer,UX Design,Windows Mobile

Design Student of the Month - Salpy Elizabeth Kelian

qixing — Wed, 20 May 2009 16:00:35 GMT

There are a lot of creative students in Canada who are doing innovative work to improve people's life through interactive, visual, informational, and other aspects of User Experience Design. I invited them to introduce who they are and share their work with you. To nominate a Design Student of the Month, email us. The Design Student of the Month for May 2009 is Salpy Elizabeth Kelian! Congratulations!! Let's hear from Salpy.

Who’s Salpy?

Hi, I’m Salpy and I live in Toronto. For the past eight months I have attended Sheridan College’s Interactive Multimedia Program (IMM). I decided to go back to school for IMM after working as an instructional designer as I wanted to learn a lot more about programming for interactive multimedia. Though I had taken computer science as an elective during my undergraduate degree, I found IMM a lot more hands on and applicable to online material. Interestingly, this isn’t my first career. I’ve also worked as a researcher, and am a certified secondary school science teacher.

What cool stuff is Salpy doing?

The largest project I worked on during this school year was my second term client project. It was a group project in which I was the project manager. Our challenge was to create a Microsoft Surface mock up in Flash for Royal Caribbean International (RCI). It was up to us to research RCI in order to create an application for Microsoft Surface that would attract cruisers to choose RCI over its competition.

We decided on creating a Virtual Concierge that featured many of the key attributes of Microsoft Surface such as object recognition, multi-user and direct interaction. As it was a Flash mockup, we couldn’t quite emulate the multi-touch aspect. In order to compensate, we still had the scaling and rotational features of each window in place to emulate the feel of a Surface application. For user testing, we had members of the class along with the client try out the application as the work progressed. It was extremely helpful having class members try the application as they had no idea as to what the application was for. Having them use it intuitively and be able to figure out the purpose behind it quickly let us know that our application met its goal of intuitive user interface.

For an overview of the project please see http://imminfusion.wordpress.com/about/. To see the Flash mockup in action http://www.salpy.ca/content/infusion/index.html.

What are Salpy’s plans after graduation?

My goal is to learn a lot more about creating functionality that provides users with a great interactive multimedia experience. As the newest member of Jam3Media (Jam3Media.com), I’ll definitely be meeting my goal of working on highly interactive, multimedia rich sites that feature an excellent user experience.

Technorati Tags: StudentoftheMonth,Canadian,UX Design,Sheridan College