Four-day workshop in San Francisco led by Cooper designers.

Recently my company sent me and my co-worker down to Cooper U for their Interaction Design course in San Francisco. As someone who believes learning is a lifelong activity, I was wanting to add more tools to my skill set as a user experience designer.

As with most things in life there isn’t necessarily one absolute best way to do things. And as a user experience designer I’m always finding more ways to help create better experiences for users.

Cooper’s interaction design course brought in people who were not necessarily in user experience work. There were developers, business owners, and designers attending the course which shows more and more people understand they all have a stake in creating a great user experience for their products.

Students at Cooper U come from various backgrounds but all have a stake in creating user experience.

Why this particular course? I was looking for practical tools in my work and thought Cooper would be a good place to start.

The course is not only about learning interaction design but about learning to build what should be built with user goals.

Why focus on goals? Goals are a stable target to build for instead of user tasks. Tasks can change over time. The example of travelers in the past vs ones in present day was brought up during the course. They both have the same goals of traveling quickly and comfortably but they can have very different tasks they must do in order to achieve their goals.

Their design process follows these steps: Research -> Modeling -> Requirements Definition -> Framework Definition -> Detailed Design -> Implementation Support.

Coooper's goal directed design process

The area that I found the most useful was how they used scenarios in the modeling stage to connect all the pieces together.

Part of their method is to take personas created and give them something to do in a scenario. The scenario creation process helped to tie the research with defining the requirements.

Modeling the scenarios helps a UX designer to make sense out of all the research and pull them into the requirements definition stage.

Sketching user scenarios

We use personas at my work but I found it challenging to bring that information into the design process in a more precise manner than just thinking it will happen on its own. Putting them into scenarios and giving them something to do using the future system you’re designing is brilliant.

There’s a lot more to their process of defining requirements, but their way of linking all the pieces together in user experience design stands out.

If you’re interested in taking Cooper’s interaction design course there are several opportunities throughout the year. And you can’t beat having to take a trip down to San Francisco.

For more information about their Goal Directed Design process download: Cooper-IXD-Process.pdf.

Posted in User Experience | No Comments »

Volkswagen Blue interactive touch display at 2011 Auto and Truck Show in Calgary.

Volkswagen Blue interactive touch display - cloud graphics

KIA Interactive Mosaic display - Users sign with their contact information to receive a mosaic photo of themselves.

KIA Interactive Mosaic display - Users sign with their contact information to receive a mosaic photo of themselves.

Ford 150 Towing Challenge Display - Users have to put a little more effort than a touch display.

Tags: Design
Posted in Interactive, User Experience | No Comments »

Some BMW typography Joy

Tags: Typography
Posted in Uncategorized | No Comments »

Albert Shum describes how Microsoft is moving moving mobile design forward with Metro Design Language.

The user experience around Windows Phone 7 stands to move mobile design forward based on traditional principles of modern design from transportation graphics.

“I think we’re at the forefront of something new, something more immersive,” said Albert Shum, Windows Phone Design Studio GM on their attitude towards designing Windows Phone 7.

Shum described Windows Phone 7 as an opportunity to move design forward from the old by standards of just polished icons, “It was really about the future. That’s the opportunity we have today.”

His team collaborated across Microsoft to bring all the best elements together from Xbox, Zune, Office, Internet Explorer and even Windows Messenger.

“It speaks to how design needs to work these days,” said Shum on his team being collaborative and open.

Metro Design Language is based on signs from the metro rapid transit system.

The new UI design, called Metro, was a fresh approach from Windows Mobile platform and was aimed at a consumer market.

Metro design language was used for the for the user interface in Windows Phone 7 as it was grounded in good graphic design, strong use of typography, and bold graphics from the metro rapid transit system.

As well, the designs of the metro rapid transit system from King County, Washington, which Metro is based on, were timeless and placed a large emphasis on typography.

Shum said timelessness is something you want in your UX design.

Windows Phone 7 is aimed at connecting back to the consumer market. “There was a fresh energy and fresh approach to ‘how do we reconnect the consumers?’ But not just reconnect but also move it forward.”

Shum’s design team also, took time to review the past and where they wanted to go with the user interface and incorporate design inspiration to ground themselves.

“The job at UX is no more than what we all aspire to do. Let’s make it look great but also work well. You also want to make it delightful.”

The team worked on a UX design that would applicable across other Microsoft experiences.

The the design will also be used across Microsoft, “That’s what you want from a good UX design, that is a system that is applicable across other experiences.”

The design team also worked on making sure teams understood the design principles and goals upfront so that discussions could be formed around them. “You don’t want to argue about is it 12pt or is 13pt font. You want to argue about principles.”

Metro Design Language Principles:

• Clean, Light, Open, Fast
• Celebrate Typography
• Alive in Motion
• Content, Not Chrome
• Authentically Digital

Tags: Design, Mobile, UX
Posted in Mobile, User Experience | 1 Comment »

I liked how the design team focused on making the content the priority instead of the UI in Google Chrome. When you first launch Google Chrome you notice right away the minimalist interface.

At first I wasn’t sure about the UI in Chrome, but the more I use it the better the experience I’m having over other browsers such Internet Explorer 8.

Tags: UI, Usability
Posted in Usability, User Experience | No Comments »

Endloop System has released one of the first must have applications for UX designers, iMockups for the iPad.
The application allows designers to create mock-ups and wireframes rapidly. I haven’t had a chance to actually use it yet, but I will definitely make it one of my first purchases for the iPad when it arrives in Canada.
Yes, it’s true that you could easily create mock-ups and wireframes on a more powerful desktop or laptop computer, but sometimes “on paper” having all the best features doesn’t mean it’s the only way to do something.
Just having an application such as iMockups for the iPad offers an alternative way for designers to create low fidelity designs.

Tags: Apps, Design, Wireframe
Posted in User Experience | 1 Comment »

Shelley Evenson discusses service design using examples of social media such as Twitter.

Shelley Evenson participates in a questiona and answer period after her presentation on service design.

“The social is really the inevitable extension of all services that we’re all going to be participating in … businesses have to address the value exchange with constituents wherever they are,” said Shelley Evenson, Principal in user-experience design at Microsoft Start-Up Labs, at a discussion hosted by the Alberta College of Art and Design.

Comparing examples of shopping online now to ordering from a Sears catalog when she was young, Evenson described how design as a service is becoming more important for companies.

When she was young she was only able to afford a single item at a time from the Sears catalog and then had to wait six weeks for delivery. Now she could order shoes online at night and have them arrive at her doorstep the next morning.

“People’s expectations are changing,” said Evenson about rising expectations from users online.

During her trip to the Alberta College of Art and Design in Calgary she encountered several services such as Metro, Starbucks, Air Canada, etc., which helped to create a good service experience on her trip.

“The five P’s that are involved in service are people, product, place, process and performance” said Evenson. “Service designing is really addressing functionality and form.”

Evenson also brought up examples of how quick social media is today with information (i.e. Hudson airplane crash on Twitter) and it’s power to influence opinion. “Movies have been made and broken in a day. So if reviews are negative in the tweet stream the movie won’t last, it’s over in a day.”

“People are participating in more things in more ways and there’s a lot of information.”

Her past work with companies such as Apple, CIBC, Kodak, and Xerox focused on design languages, strategies, design prototyping, organizational interfaces, and service design.

Tags: Design, UX
Posted in User Experience | No Comments »

Russ Unger’s wireframing process

Todd Zaki Warfel’s wireframing process.

Will Evans’s wireframing process

As an interaction designer I’ve come to appreciate the beauty of wireframes and the amount of thought that goes into them. They are not the final product but a means or a process to get there. Websites like I ♥ wireframes or Wireframes Magazine provide plenty of great examples of what can be done.

There isn’t one best practice for producing wireframes. It seems the process can range from drawing sketches on paper to complex vector drawings using tools such as OmniGraffle.

A critical aspect of the wireframe is being able to explain the functionality of the website. It’s not meant to be a layout guide for designers but a means to focus on what’s best for the user coming to your website. It’s not so important to try and lock down every single aspect of the usability or function, but to reach about 80% of what needs to be there. The process of going through design iterations at the end can finalize the rest.

There could be better processes to reach the end, but so far this is what I’ve experienced.

Tags: Design, UX, Wireframe
Posted in User Experience, website development | No Comments »

The Web Standards Project has a list HTML and XHTML structural templates to get your website project started on the right track. The list includes HTML 4.01 and XHTML 1.0, 1.1 templates.

The website is also a great resource for learning web standards. It was started in 1998 to advocate standards and increase accessibility for the web.

Tags: Web Standards
Posted in website development | No Comments »

Users are introduced to Facebook's new home page

On the launch of Facebook’s new home page users are first given an introduction to the home page and it’s new features with simplified graphic and instructional text.

Written text simplifies the intro into three easy steps using action verbs “see”, “access”, and “manage”.

The introduction is a good way to ease the user into the new home page and it’s changes.

Tags: Usability, Users
Posted in User Experience | No Comments »