July, 2009

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 July 2009 is Diana Isaza Shelton! Congratulations!! Let's hear from Diana.

Who’s Diana?

I am from Colombia and I have lived in Canada for seven years. I have just completed studies in industrial design at Carleton University in Ottawa, with one semester of an Exchange Program with Monash University, in Australia. This summer I am completing my internship for graduation, and the last two courses for a minor in Business. The combination of study, work and travel has given me the opportunity to learn a range of subjects from inclusive design, perception, user interface design, human factors, user-centered design, sustainable design, among others. More interestingly, it has helped me to develop a holistic approach to design and encouraged me to explore new dimensions to enhance human interaction with the physical world.

Some facts about me: My favourite designer is Marc Newson, Nature is my main source for inspiration, I like to learn languages and learn about cultures. I am student member of Association of Chartered Industrial Designers of Ontario (ACIDO). I love model making and photography. My favourite quote is: “To laugh often and much; to win the respect of intelligent people and the affection of children; to earn the appreciation of honest critics and endure the betrayal of false friends; to appreciate beauty; to find the best in others; to leave the world a bit better, whether by a healthy child, a garden patch or a redeemed social condition; to know even one life has breathed easier because you have lived. This is to have succeeded.” Ralph Waldo Emerson.

What cool stuff is Diana doing?

In May 2009 Carleton University and Sonja Bata, widow of shoe manufacturer Thomas Bata, came together for a pilot project to design concepts that make the town of Batawa, Ontario, a model sustainable community. I led the School of Industrial Design team, along with two colleagues Michael Tomlin and Tomas Valencia, in the task of redesigning the ski hill facilities of the factory town into a year-round destination.

I was involved in the design of the recreational area at the foot of the hill, for which we proposed a cost-effective reservoir to solve issues with snowmaking and storm water management system, recreational ponds that create an ice rink and ice trails in the winter, and an entertainment stage for performances. The design focused on the innovative use of natural materials represented on snowmazes, yukigassen (an official snow fight competition) and a greenhouse-like research lab. The six-week project work was exhibited to the community in Batawa and Ottawa drawing special attention from national media. You can see the video of the project on CTV website.

Currently, I am working on a publication compiling the final projects of the industrial design 2009 class in sustainable product development. This includes my project “Clean Hands Compost”, an easy-to-use composting solution for the home, which was awarded the Michael Elmarson Memorial Award for outstanding environmental awareness.

What are Diana’s plans after graduation?

I look forward to join the corporate world, and to be able to apply my skills and creativity in providing meaningful experiences to people. Advancement opportunities in design management, human-oriented design and sustainable development are in my goals. I enjoy teamwork, learning new things and taking on new challenges. I enjoy getting involved and helping others. Some of the industries that I would like to contribute to include education, medical equipment design, exhibition and communication design. In the future, it is my intention to pursue further studies in strategic design research and design management to broaden my contribution to society through creative and responsible design.

Want to learn more about Diana?

You can see my sample work at: http://www.coroflot.com/dianaisazashelton

Hot off the presses!  Windows 7 and Server 2008 R2 have hit the RTM Milestone!  From the Windows 7 team blog…

I am pleased to announce that Windows 7 has RTM’d!

As I mentioned previously, RTM officially happens only after sign-off occurs. What happens is a build gets designated as a RTM contender after going through significant testing and meeting our quality bar for RTM. Then, it goes though all the validation checks required for RTM including having all languages of that build completed. If all the validation checks have passed – sign-off for RTM can occur. Today after all the validation checks were met, we signed off and declared build 7600 as RTM.

Continue reading…

And from the Windows Server blog…

The acronym (RTM) stands for Release to Manufacturing, and it means this latest release of Windows Server 2008 R2 is now blessed by engineering as ready for the manufacturing process. We're talking final code. Sun shining, birds singing, children dancing in the streets.

With evaluation software available for download in the first half of August and the full product available to customers with Software Assurance in the second half of August, RTM is more than just an engineering milestone. Occurring in lock-step with the release of the Windows 7 RTM, these two platforms are now ready for our partners to start testing and installing on their hardware. And that lock-step isn't a coincidence, it's a design goal.

Customers using Windows Server 2008 R2 and Windows 7 in their enterprises has been Microsoft's intent from the first day programmers touched fingers to keyboards.

Continue reading…

So with those two announcements the first question is “When and where can I get it?”

The answer.

A big thank you too all the beta testers, without your testing and feedback this would not be possible!

This is a post for busy designers and developers who would like to get an overview of Accessibility design and some quick tips. Last month, two of my colleagues and I conducted an accessibility workshop to developers and designers who work on Canadian government sites. I presented on Designing for Accessibility, which I included the slides below. While preparing for the presentation, it opened my eyes to the world of disability and taught me an important lesson as a designer that: Good Design Enables and Bad Design Disables.

In particular, I’d like to share with you the following key points:

• Good design principles apply to people with or without disability. For example, providing a clear and consistent navigation structure will help people to find what they are looking for faster. This is especially important for people with motor and cognitive disability. Check out the examples in my presentation and make sure your design is usable to general public first.
• There are special design considerations you need to know to achieve great accessibility. In addition to general usability, people with disability require some additional design consideration. The high level principles are called out in WCAG. They are: Perceivable, Operable, Understandable, and Robust (i.e. the POUR principles). Details are in slide 14. For instance, for people who are blind, they can’t perceive  visual information such as graphics, layout, or color-based cues, so you need to make sure to include text description to those information. In addition, they probably can’t use mouse easily, keyboard access is critical to make your application operable. For people who are color-blind, you don’t want to make color the only way of conveying important information such as status change. Design tips for each type of disability is included in the presentation.
• Accessibility is part of usability and you don’t need a separate process to design for it. Make sure you integrate accessibility design into your current design process and make it a priority throughout the development process. For example, when you create personas for your web project, check out W3C’s accessibility personas on how disabled people user web. Include accessibility personas specifying disability conditions and Assistive Technology information for the type of personas.
• Empathy is the key to design for accessibility. If there’s one thing you remember when designing for accessibility, it is EMPATHY. We need to understand how people with disability use software and their pain points. If you haven’t used a screen reader, try it. It’s a really eye-opening experience. Listening to them, trying to experience what they are going through, and understanding their culture will help us be empathetic and put on the accessibility lenses when designing.

Here’s a list of resources where you can learn more about designing for accessibility:

• Web Accessibility in Mind: http://webaim.org/
• Personas: http://www.deyalexander.com.au/resources/uxd/personas.html
• Effective Color Contrast: http://www.lighthouse.org/accessibility/effective-color-contrast/
• Bad website design examples: http://websitesthatsuck.com/
• How People with Disability Use the Web: http://www.w3.org/WAI/EO/Drafts/PWD-Use-Web/
• Accessibility Color Wheel: http://gmazzocato.altervista.org/colorwheel/wheel.php
• Contrast Analyser: http://www.paciellogroup.com/resources/contrast-analyser.html
• Color Doctor: http://www.fujitsu.com/global/accessibility/assistance/cd/download.html
• Vischeck: http://www.vischeck.com/vischeck/vischeckURL.php

Check out my presentation and put on your accessibility lenses today!

Thinking about a color palette for your new website or application project? I’ve been using the site Colourlovers.com to get color inspirations. It’s a virtual color library where you can find thousands of color palettes, articles on color design, and follow color trends from magazine and websites.

What’s more useful about the site is that you can import the color palettes into Expression Design as swatches or add them into Expression Blend as application resources. Let me show you an example:

Summer is in the air and a mixed berry lemonade sounds good. :) I found the follow color palette on the site.

Once you registered as a site user, you can download the palette and import into Expression Design as a Swatch Library (below left).

Or, you can download the XAML file and copy the content into your Silverlight application’s App.xaml file (see below). Make sure to insert the  the code into the Application.Resource section of your App.xaml. You can see the result in Blend as the one on the right above. Simply just drag and apply brush onto the objects on canvas.

Color is an important element of graphics design. Here’s a nice article talks about the Color Basics: Do’s and Don’ts. Check out the article and have fun with color in Expression.

Great news for Microsoft partners: during WPC this week, the Surface Partner program was launched. All the Microsoft registered partners now can get access to the Microsoft Surface SDK Workstation Edition through the new QuickStart site. If you are not yet a registered partner, then become one to following the simple steps here. Many of you have been waiting to design and develop for Surface experience. I hope this program can get you started. Also, you can enter the developer challenge and become an “Interactive Superstar.”

Today is a landmark launch day for anyone building Rich Internet Applications (also known as RIAs), particularly those that build compelling web-enabled experiences on the Microsoft platform.

We launched 2 new product versions today and it’s something all of us at Microsoft are very excited about:  Silverlight 3 and Expression Studio 3.

Silverlight 3 represents a big change in how you can build RIAs in .NET.  In a nutshell, below are some of the enhancements and new features you can use with Silverlight:

• Out-of-Browser Experience:  Build RIA applications that don’t require a browser to run.  This is a big deal as it means that you can use Silverlight to create connected desktop experiences that run on any Silverlight 3-supported platform.
• GPU Acceleration:  One of the hurdles many Silverlight developers and designers needed to overcome in prior versions of the platform was dealing with (or rather “faking” or “hacking”) 3D support within Silverlight.  This was due to the fact you couldn’t take advantage of the GPU hardware on the PC to deliver the 3D experiences you wanted to build.  With Silverlight 3, now you can leverage the PC’s GPU.
• Smooth Streaming Video:  Everyone is familiar with the experience of choppy video online.  Smooth HD Streaming has been incorporated into Silverlight 3 to help alleviate that problem.  In essence, Smooth Streaming allows the streaming server and the Silverlight plugin to determine your bandwidth and adjust the quality of the stream to best fit your bandwidth restrictions.  There is a good demo of this here.
• Development and Design Support:  The Silverlight 3 SDK provides over 100 new UI controls that Designers and Developers can use out of the box in their Silverlight apps.  It also provides a newly introduced navigation framework that helps with deep-linking and back/forward browser control.  It also provides much richer network support.
• Developer Tools:  With the launch of Silverlight 3, we also provide the tools for building Silverlight 3 applications in Visual Studio.  It’s also your choice where to get these tools.  You can get them using the Web Platform Installer or through the traditional channel at the Silverlight Dev Site.

You may have noticed I talked about developer tool support but I didn’t spend any time on Designer tools.  That’s because I want to focus a bit on the design tools in the section below.  Expression Studio 3 has been launched (although Expression Blend, the interactive design tool has been launched in RC form for now).  There is several cool things we have added into the Expression suite of tools for Version 3 (including full support for Silverlight 3).  I want to highlight the new features of two of the tools here, namely Expression Blend and Expression Web:

• Expression Blend 3 RC (Download Here) 
  • SketchFlow:  This is a huge productivity gainer for developers.  Remember the days of sketching a screen design and app workflow on a napkin to show to the client?  Now you can do the same thing with Expression Blend without having to do manual sketches, wireframes and then build the actual app.  You can do this as one step now.
  • Intellisense support:  If you like to get into the code while using Expression Blend, you now have Intellisense support within the tool (including intellisense for C#, VB and XAML).
  • TFS Integration:  “Does Expression Blend support for code repositories (including check-in and check-out)?”  I have been asked this question many times and the answer was always a let down.  My answer was basically “save the work you did in Blend, go back to Visual Studio and check in the code assets from there”.  Well, no more – I’m happy to say that Blend now supports the ability to check your project assets into Team Foundation Server, Microsoft’s code repository tool.

Check out Qixing’s 4-part mini-tutorials on Blend 3!

• Expression Web 3
  • SuperPreview:  If you design websites, you are probably acutely aware of the pain that is testing your web application for rendering in multiple browsers.  Your process for this testing likely included multiple machines, constant flipping back and forth between browser windows and you still ended up missing incompatibilities.  SuperPreview fixes a lot of this pain by providing you with a way to look at how your website will render in multiple browsers, side-by-side with tools that help you identify inconsistencies.
  • New User Interface:  Expression Web is no longer “the tool in Expression that doesn’t look like the other tools”.  In keeping with design consistency, Expression Web now sports the slick, dark grey IDE UI that the rest of the tools do.
  • Auto-Hide Panels:  Screen real estate is valuable as a website designer.  You usually need to use most of the space on the screen to see how the website looks, viewing the actual code and the like.  Tool panels often get in the way.  With Expression Web 3, you have the ability to hide these panels as you see fit, which is very helpful when all you want to do is look at the code!

This is just a very quick summary of some of the things we have delivered in Silverlight 3 and Expression 3.  For more detailed info on these items, I encourage you to take a look at the following resources:

• Silverlight 3
  • The Silverlight 3 Launch Site
  • Scott Guthrie’s Blog
  • Tim Heuer’s Blog
• Expression 3
  • Scott Guthrie’s Blog
  • Morten Rand-Hendriksen’s Blog
  • Christian Schormann’s Blog

-Paul

Our friends at ObjectSharp are putting on an exciting show at the Paramount Theatre this Thursday, July 9. It’s titled “Silverlight on the Silver Screen.” If you want to know more about Silverlight 3, Expression Blend 3, and Windows 7 Touch Technology, it’s a show you don’t want to miss. Check out the event details and register for the free event here.

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.