Design for WPF

1
Design for WPF Silverlight

• Create experiences that captivate,
• not intimidate users

2
who am I?
3
im a creative
4
and a technologist
5
and my clients have to make money too
6
clients like these..
7
(No Transcript)
8
And I work on some of those, with a whole lot of
Romanians!

• Conchangos biggest
• outsource development partner is
• iQuest
• Cluj, Romania

9
and I work for Conchango(not Microsoft!)
10
But we do work a lot with Microsoft

• Gold Certified Partner in 8 disciplines
• Early adopter of WPF, Silverlight and Live
  Services

11
(No Transcript)
12
experience design
12
13
experience design is about making emotional
connections with people

• make delight, happiness and elegance part
  of your success criteria

13
14
So, why do I love
15
Maybe its because its one of the few brands that
lives out its value - fun! After all, how many
brands would sayMore experience than our name
suggests
16
Is it this guy?
17
These
18
or these?
19
http//www.v-flyer.com
Her?
20
Or her
21
Her?
22
or her?
23
Him?
24
Is it her?
25
Them?
26
Contrast them with
27
Maybe the reason I love Virgin is that while I
might be sat to one of these
28
I am just as likely to be sat next to one of these
29
Or the bar?
30
(No Transcript)
31
Even these get a splash
Meike van Schijndel - kisses
32
But when things go wrong?
33
(No Transcript)
34
(No Transcript)
35
(No Transcript)
36
(No Transcript)
37
(No Transcript)
38
(No Transcript)
39
(No Transcript)
40
So how far do people go with this love?
41
Too far?
42
flickr
43
V-flyer.com
44
How much love? Lets use a web 2.0 measure of
love
45
I love Virgin Atlantic
46
(No Transcript)
47
(No Transcript)
48
But what about creating a brand love index?

It wasnt enough for me to see them winSo I
normalised it against annual passenger
numbersBA 33,600,000Virgin 5,850,000And
what happened?
49
And the point of all of this?
At Conchango, we create the digital
experiences people love Experience
matters When price, product, delivery all
become the same, what will separate you out from
your competition?
50
Experience based differentiation

• This is what the analysts call it.
• Its the thing that makes people fall in love
  with your software, websites
• Its technologies like WPF, Silverlight Live
  Services, that give us a whole new toolkit to
  play with!

51
so whats possible?

• We have some new tools want to see them?
• Warning for those still sleeping Loud music
  coming!

52

• WPF SILVERLIGHT VIDEO

53
so what can possibly go wrong?
54
When you can do something
55
Doesnt mean you should!
56
The modern equivalent

• The feature
• News In Pictures it displays all the pictures
  in todays news!
• But it did not start out like that
• We made it 3D! Why? Because we could!
• Nobody could work out how to use it!
• The 3D didnt add anything to the experience it
  just made it a bit harder.
• (sad, but true)

57
Is this appropriate to the brand?
58
Is this?
BUNA FRUMOASO
59
In other words

• What is right for one user is not always right
  for another
• What is right for one brand is not always right
  for another
• And using features and techniques
• just because you can is not right either!

60
how do you keep your projects on track?
61
A Quick Exercise
A
B

• Q. Which is the better radio?
• Same Price, same manufacturer,
• Same components, Same build quality

62
But before you decide

• This is Jenny James
• Age 56
• Profession Retired (Marketing)
• Lives Outside London
• Statement Oh, I wont be able
• to work it out!

If you started with Jenny which radio would you
design?
63

• I just want to listen to the radio
• Use controls Im comfortable with
• Give me a quality product

It only does one thing its a radio! Knobs and
buttons Retro feel like they used to make
them!
64
But before you decide

• This is Tony Hewitt
• Age 58
• Profession Pipeline engineer
• Lives Scotland, Manchester
• Saudi Arabia
• Statement I cant live without
• my cricket!

If you started with Tony which radio would you
design?
65

• I travel a lot
• I want to listen to cricket
• Give me a quality product

Dual time zone function helps me and an alarm
clock is useful too Gets shortwave, long wave and
all sorts Lightweight and well engineered
66

• I travel a lot
• I want to listen to English football
• Give me a quality product

Its too heavy and old fashioned to be useful to
me
67
this is a user-centred approach
67
68
What is a user-centred approach?

• Observe and study real users first
• Work out what their goals are
• Design things only that meet those goals
• Dont start with a feature list
• Validation
• Test what youre doing as you go along
• Change if it could be a better experience for
  users even if it doesnt give you something YOU
  want!

69
How do you do it?

• Get out there... spy on people!
• (guerilla ethnography)
• Develop personas
• Make everyone in the team responsible for user
  happiness!
• Make delight a key performance indicator

70
Why is it better? (how to sell this approach)

• Your software will be more effective
• You will focus more on the 20 that users
  actually use!
• For users this means
• They are more efficient and make less mistakes
• They are happier
• They are more likely to buy more
• They will be happy to use your application again
• For you this means
• Fewer support issues
• Your company makes more money
• Your boss will like you
• You will get a pay rise
• You will sleep better at night
• Your family will see more of you

71
but users have changedlets understand a bit
more about them
72
Her Social Network

• Its very tightly integrated to messenger so
  its easy to fall into
• It starts as uploading a photo or two to show her
  friend in New Zealand
• Then writing some comments on the photos
• Now its the hub of communicating news about her
  family to her remote friends and family
• Other ways to do the same thing Flickr,
  MySpace, Bebo

73
Her Start Page

• Has all she needs in it
• More revealing and diverse than just The BBC
  news
• Faster to get the stuff she wants
• Alternatives Google Start page Page-flakes

74
And Facebook is hurting Instant Messaging 39 of
the Facebook users we surveyed, use IM less after
joining Facebook
75
Shes got higher expectations now

• Whats with the blank space and small text?
• If I dont know what to look for, Im stuck
• I want to know whats the latest thing
• The interaction is rubbish, the images are
  rubbish if I want to shop Next, Ill get the
  Catalogue

76
Shes got higher expectations now

• Thats better!
• Helps me work out what I want
• Gives me something more
• Is reality, not just marketing hype

77
Web 2 Social Evolution Crystallised

• The web is now mainstream
• 75 of UK households connected
• 2 in 3 are on broadband
• Increased social use of the internet
• Photo sharing not sending
• Instant messaging blogging, not only email
• People want to cut out the rubbish (snack
  culture)
• RSS feeds / Start Pages eliminate the noise
• People are disbelieving the marketing hype
• Wanting to know what real people think what
  shes not being told
• The PC is no longer in the study

78

• Search without the text box
• Advanced search without the drop-down!

79
Kayak.com

• Users now adjust they dont really understand
  filtering

80
just watch this
81
Applications like this are setting the standard

• Although broadband and internet penetration is
  high in many countries, we are still only just
  entering the late majority
• People of all ages, and backgrounds will begin
  using the internet, and they will start with
  applications like the ones youve seen
• These applications will set their expectation for
  what you have to design build

82
working together
82
83

• what people
• will use
• (desire)

what you can build (feasibility)
not cost justified
what we want!
cant be built
nobody uses it
what the business can support (viability)
84
Development
Design
Visual designer
Interaction designer
Developer

• Branding
• Animation

• Usability
• Ergonomics

• Code!

85
The Waterfall
You want what?
86
The tight team
87
The Interactive Designer
88
The Producer
89
User Interface Development Workflow
90
A Great Integrator

• Preserves design integrity
• Not his day job to design
• Knows when a design is on, but can fill in the
  gaps
• Preserves code integrity
• Doesnt break functioning code
• Lives in XAML and does things right
• Understand development environment and tools

91
Ways of working
Most Risk

• Traditional waterfall
• Designer JPEG
• Developer Translates to XAML
• The Interactive Designer
• Designer Design Tools XAML
• Developer XAML C
• The Producer
• Designers Design Tools only, or XAML
• The Producer Design Tools, XAML C
• Developers XAML C

Least Risk
92
Even more tips!

• Dont make designers a bottleneck
• Train developers in image manipulation in
  Photoshop
• (cut, crop, resize, output)
• Design comes from everyone
• Trust your developers to participate in design
  decisions
• You can start the design on paper, in code, or in
  mockups

93
Be Agile!

• Do NOT spend an eternity in a design phase
• Pick one thing to do, and get going as fast as
  you can
• Stop and test with users
• Adapt what youve done, and take on something new
• Dont wait more than 4 weeks until the client
  sees something working

94
Final tips

• DO spend time drawing and brainstorming
• DO spend time working things out in code
• DO try to be original - invent something new...
• But DONT be too proud to use things you know
  work already!

95
The results
If you get it right? 1 AJAX
But first if you dont
96
If you get it right?2 Flash Silverlight of
course!
ETOnline
Or this one
96
97
Talk to mepaul.dawson_at_conchango.comTalk to
a great Romanian companyhttp//www.iquestint.com
Find out more about Silverlight, WPF and
Windows Livehttp//www.microsoft.com/silverlight
http//dev.live.com
Merci
97