Presentation at Microsoft Architect Council in June 2007 - by Will Tschumy, Microsoft

1. What is
Design & User Experience?
June 19th, 2007
William Tschumy
User Experience Evangelist, Western Region
Microsoft

2. How can Microsoft help me with
User Experience?

3. Microsoft’s User Experience (UX) Offerings
Best: WPF & Desktop
Windows & Vista & XP
Better: Silverlight
Most Browsers - 1.1 MB Plugin
Richness
Good: HTML & AJAX
All Modern Browsers
Breadth

4. The Tools are only
half the conversation

5. When was the last time you ever
heard a user say…

6. “I wish I could use a SQL-based
application!”

7. Then why do we start with
technology?

8. Is there a better way?

9. Any business problem has 3 types of
constraints:
What’s
Viable?
What’s
Optimal Solution:
Possible? Balancing all 3
constraints
What’s
Desirable?

10. Any business problem has 3 types of
constraints:
Business: What can I bear?
•How much can we sell it for?
•How much can it cost?
What’s
•Is there acceptable ROI / NPV?
Viable?
What’s
Possible?
What’s
Desirable?

11. Any business problem has 3 types of
constraints:
What’s
Viable?
What’s
Possible?
What’s
Desirable?
Technology: What can I do?
•With my technology?
•Within regulatory constraints?
• Within my business environment?

12. Any business problem has 3 types of
constraints:
What’s
Viable?
What’s
Possible?
What’s
Design: What should I do?
Desirable?
•Who are my users?
•What are their needs?
•What is their mental model?

13. How does Design answer its
questions?

14. Design begins
with a deep,
empathetic
understanding of
people

15. We do this by
observing:
• What they say
• What they do
• Where they are
• How they think

16. What is the process of Design?

17. An Overview of Design
Depending on the type of problem, different techniques will be used
Observe Analyze Solution
The Bookkeepers The Strategists
Who are personal finances from the point about long-term financial
Approach Think
they? of view of monitoring the activity of their management and overall net worth.
money Think about their assets in terms of
on account summaries and paper trails liquidity, investments and liabilities.
Rely
to support purchasing and making routing on the online bank as a source of
Rely
money management decisions. data for their strategic software tools.
Not sophisticated money managers; tend to Are sophisticated users and need
shy away from programs like Quicken or strategic tools for viewing their overall
Microsoft Money financial picture.
Observations to rely on paper trails to manage their on highly personalized financial
Tend Rely
finances. tools and information, and like the idea
a lot of effort tracking down their of a central financial organizer.
Spend
transactions; feeling that they need control. enthusiastic about financial activities
Are
though they consider banking an and enjoy engaging in them.
Even
“annoyance,” they also tend to be Are very loyal and may become
emotional about their financial situations advocates of the systems they use.
(e.g. they are afraid of being overdrawn; Enjoy researching sources of investment
they are concerned about mistakes; and inspiration as well as managing net
the are excited about the possibility of worth.
making a purchase). They are open to new products,
especially those that can assist them
with their financial “big picture”.
Financial monetary activity their fortune
Monitoring Optimize
Goal
> >
Understand your Prototype to Prototype to flesh
find possible out a solution
users
solutions

18. First: Understand what type
of problem you’re solving…
Optimization Innovation
“Pattern Optimizing” “Pattern Breaking”
• Tends to be more tactical • Tends to be more strategic
• Bounded, understood problem space • Unbounded, fuzzy problem space
• We know what we don’t know • We don’t know what we don’t know
Are you trying to solve world hunger or build an improved checkout?

19. Observation
• Immersive Research
• Ethnography
• Surveys & Focus Groups
• Personas

20. Qualitative: Immersive research
What People Say and Make
Camera studies allow
people to interpret their
environment and activities
Intercept interviews on the
when we can’t be there
street…to get quick reactions to
questions
Semi-structured interviews in
customers’ workplaces to
gather information on their
daily activities and needs

21. Qualitative: Ethnography
• Ethnography is the study of customers in the
natural context of their everyday lives.
• We may meet participants at their workplace, on
the street, or in their home, combining interviews
with observation of what they normally do.
• This research captures what people actually do, not
what they say they do, or what they think they do.
• Understanding of their social environment reveals
unmet user needs, motivations, beliefs, frustrations,
and decision-making processes.
• It segments customers in those terms, evaluates
customer readiness for adoption, and offers
strategies for compelling customers to use the
eBusiness and helps to foster long-term loyalty.

22. Quantitative: Surveys & Focus Groups
• In order to validate the hypotheses we form based on ethnographic
research and/or benchmark and comparative usability tests, we may
conduct online or phone surveys, or focus groups
• Both surveys and focus groups provide self-reported qualitative
and/or quantitative data that informs market/user segmentation as
well as the business strategy
online phone
surveys surveys
focusgroups

23. Personas
Understanding your user
population is critical.
In this case, for a utility
company, understanding how
to better serve the poor.
Based on research, Personas force you to keep
the goals of the user in mind while developing
your idea

24. (Prototyping to) Analyze
• Scenario Prototyping
• Collaborative Design
• Prototyping

25. Scenario Prototyping
Scenario Prototypes refine requirements through narratives
Fictitious narratives or scenarios are developed
to illustrate key themes of user needs uncovered
in the research. They each have different key
goals and motivators.
The scenarios show how these characters may
go about doing a task typical of their role and
the challenges they face within the current
environment

26. Scenario Prototyping (cont’d)
Scenario outlines
the major
features of the
business or
application
Profiles are based off of
user research, and are
consistent with both
the value map and the
business model

27. Collaborative Design
Card sorting is useful in early stages of development
to prioritize and cluster potential content offerings,
find new content areas of value, and identify new
areas of functionality.
This technique helps identify a user-centric view of
the information architecture and nomenclature.
3. Customer 4. Services
2. Industry watch
Site Map 1. My Tools service offered
global market information product information equity execution
speaker events product demos fixed income execution
annual report online product training credit services
white papers help trusts & investments
chairman‟s viewpoint FAQ custody
publications STT associated websites securities lending
Respondents can work as
executive speeches brokerage services
press releases currency management
market data trade order management tools
webcasts (llive & archived) corporate trust
chat rooms/disc. Forums currency execution
external news feed asset servicing
teams, discussing individual
industry news cash management
President/CEOs viewpoint
views of the information
2. Performance &
3. Communication
1. Accounting
analytics
account maintenance analysis electronic messaging
manager selection
account reporting poliicy monitoring
hierarchy aloud.
portfolio management tools
portfolio accounting ER
research data
Private Edge
investment management
Securities Lending
investment mgmt. Firms
fundamental data
account information downloads
performance & analytics
Added by Chris
Chris McNiellie-- BellSouth/Atlanta-- Aug. 14 2000

28. Collaborative Design (Cont’d)
Users can voice tacit perceptions that would
otherwise not emerge in a focus group setting
through non-verbal exercises. Collaging helps to
elicit metaphorical associations or attitudes users
have with specific topic areas.
I don‟t want to be confusing, elusive,
…it should have accurate tools, be
intimidating, or complicated...
precise, knowledgeable, and intelligent...
...warm, well-managed, and
integrated...
Users make word-to-image associations
when describing their collage to the efficient
responsive
group/facilitator, and articulate what a focused confident orderly
product/brand/interface SHOULD be as
well as what it SHOULD NOT be.
experimental,,
financially sound, consistent strructure and challenging
...it should respect
mentor
complete order… to me, this is art! my time...
summary collage: image use and
image metaphor descriptions

29. Collaborative Design (Cont’d)
Rough sketches - or paper-base prototypes -
shared with customers early in the design
process to get their feedback
on various homepage concepts. The team was
able to ―test‖ the concepts while exploring their
needs and expectations in greater depth.
Collaborative sessions with constituents co-
design possible screens. Constituents provide
immediate input and feedback - developing and
revising paper-based prototypes on the fly.

30. Usability Testing
HTML-based prototype
(without final visual design) test the
navigation and site functionality. Testing
highlighted opportunities to streamline the
site structure and overall user experience.
Usability testing identifies quick fixes that could
be made before launch and those that would be
addressed in subsequent launches.

31. (Prototyping the) Solution
• Prototyping
• Interaction Design
• Information Architecture
• Content Strategy
• Visual Design

32. Information Architecture
Conceptual Model
Site Map

33. ID, IA: One experience, Many channels

34. Interaction Design: Flows
―Managing your home‖ experience
–constituent perspective
manage identify
home need
find
solution
―Edit Photo Title‖ experience
estimate/
follow-up
order
—constituent perspective share/categorize
provider
visit
34

35. Content Strategy
A Content Matrix is an exhaustive listing of all the content
in a given product, service or business. It relates the
content between the user requirement and the position
within the product, service or business.
Vectren eEnablement Content Matrix
Audience
UI Prototype File Static Content Service Territory
Section Page ID Content Area: Page Title Content Type Description Reused Content Types Non-Authenticated User (Visitor),
Name Word Doc name Evansville, Indianapolis, Dayton
Residential, Bldr, C&I, Mktr
Global
Username and Password fields presented with instructional
Login login.html Login.doc text and link to to login help. Login fields with link to Login Help
LG 1.0 All E, I
Login Error Incorrect entry, please try again message. All All
Instructs user to enter email address and provides email
address field. Submission generates confirmation message
Forgot My Password login_help.htm Login_Help.doc and response email.
LG 1.1 All E, I
Informs user that he/she will receive an email containing
his/her username and password, and provides instructions
Login Help Response for alternatives. All E, I
System genreates email with the user's username and
Login Help Response email password. R, Bldr, C&I, Mktr
Contains a title, displays term user entered, # of searc
results found, page titles/abstracts/relevancy for the
matches, provides a Search again text field and links to
Search Results Search_Results.htm Search_Results Searh Tips.
HM 0.3.1 All
Register Contains a title and instructional content, register as
Register with Vectren Register_01.htm Register_01 residential or business user radio buttons
RG 1.0 All
Security and Privacy Link All
Contains a title, registration instructional content, and
Residential Personal Info RegisterResidential_01. RegisterResidential_ registration form.
Set up your online account htm 01 I do not want to register now link.
RG 1.1
* Help with Form - Residential R
Security and Privacy Link All
Confirmation RegisterResidential_02. RegisterResidential_ Contains a title, welcoming message and link to
Your registration is complete htm 02 Residential.Home
RG 1.2 R
Email contains welcoming message and instructions for
RegisterResidential_ loggin in to online account, presents username and
Residential Registration email 02_email password and provides customer care 800 number R
* Customer Care signature R
Contains a title and explains that online account
management is not currently available in the VEDO service
territory; Resdiplays email address from previous entry and
missing in site Rsgistration message for VEDO users RegisterResidential_ informs user that they will be emailed when new services
map Future online services 01_aVEDO become available. R, Bldr
Business Personal Info
Enter the account information for your RegisterBusiness_01.ht
business m RegisterBusiness_01 Contains a title, instructions and business registration form.
RG 1.1.1 Bldr, C&I, Mktr
* Help with Form - Residential
Security and Privacy Link
Confirmation Contains a title and sets the expectations that a Vectren rep
We received business registration RegisterBusiness_02.ht will contact them to isssue a business account user name *Case Number
information m RegisterBusiness_02 and password. Assigns a case number and 800 number. * Customer Care 800 number
RG 1.2.1
Email contains welcoming message and instructions for
Register_02_builder loggin in to online account, presents username and
Builders Registration email s_email password and provides customer care 800 number
* Customer Care signature
Email contains welcoming message and instructions for
Register_02_comme loggin in to online account, presents username and
Business Registration email rcial_email password and provides customer care 800 number
* Customer Care signature
Docs for Download
MAFL 1.0
Note: forms and docs in the Form Library still contain old
logos and company names. These should be edited to
Individual Form Pages reflect new company naming.
MAFL 1.1-1.4
Residential

36. Mood Boards: A basic vocabulary
Please rank these mood boards.
1=most favorite, 12=least favorite

37. Experience Prototypes
„living‟ identity
advertising
online
packaging
Product design

38. Usability Testing
HTML-based prototype
(without final visual design) test the
navigation and site functionality. Testing
highlighted opportunities to streamline the
site structure and overall user experience.
Usability testing identifies quick fixes that could
be made before launch and those that would be
addressed in subsequent launches.

39. What’s the result of good
design?

40. Understanding and satisfying
your users’ needs means they:
Are Happier
Are More Are More Loyal
Productive
Make Fewer Require Less
Mistakes Training

41. Most of all, understanding and
satisfying your users’ needs
means they:
Are more valuable

42. By the numbers
• A mid-western utility was able to cut average customer
support call cost from ~$10 to less that $1.00 per
incident as a result of redesigning their web presence
• A major eCommerce seller saw a 45% increase in
average order size as a result of redesigning their
shopping experience
• The same retailer saw a 10% conversion increase as a
result of better organizing product information
• Implementation costs for back office systems were cut by
40%

43. Thank You!
William Tschumy
William.tschumy@microsoft.com
415.420.3746
User Experience Evangelist, Western Region
Microsoft