Pimp My App Shane Morris User Experience Evangelist Microsoft Australia

A little bit about me...

Why am I here?

Coders own the user experience

The final User Experience is determined by... What the coder can build in the time available What the coder can build What the coder can be bothered building What the coder understands of the spec What spec there is

What the coder can build in the time available

What the coder can build

What the coder can be bothered building

What the coder understands of the spec

What spec there is

So what I want to talk about is... What you can do about UX How to work with UX people

What you can do about UX

How to work with UX people

Why all the fuss?

User Experience

A Quick Poll For your project: No Yes Usability / User experience requirements set up-front? Individual(s) responsible for user experience? UI specified before coding time? Usability testing at end of project? Usability testing during project?

But what can I do?

What is the single most important thing you can do to improve your projects user experience?

Functionality – the natural enemy of usability

User Experience Design Process

User Experience Design Process You are here (mostly)

User-Centred Design (Methodology) Contextual Inquiry Affinity Diagramming Usability Testing Personas Paper Prototyping Collaborative Design Heuristic Evaluation Wireframing Cognitive Walkthrough Activity Scenarios Focus Groups Card Sorting Cultural Probes Analytics

User Experience Design Process You are here (mostly)

Interaction Design for Dev’s

The Blank Canvas

List everything you need to show Select the right widgets Check for standards & consistency

List everything you need to show

Select the right widgets

Check for standards & consistency

2. Map out the workflow In what order are people most likely to work?

In what order are people most likely to work?

3. Layout the elements Left-right, Top-Bottom

Left-right, Top-Bottom

3. Layout the elements

4. Check grouping Rearrange items if there are more natural groupings.

Rearrange items if there are more natural groupings.

Presentation Design for Dev’s http://elephant-photos.com/images/elephant-painting-2.jpg

Presentation Design Remove every unnecessary element Minimise variation Line stuff up Space and size things evenly Indicate grouping Adjust visual weight

Remove every unnecessary element

Minimise variation

Line stuff up

Space and size things evenly

Indicate grouping

Adjust visual weight

3. Line Stuff up

4. Space and Size Things Evenly

5. Indicate Grouping

How to indicate grouping?

6. Adjust Visual Weight

Working with UX people

UX Roles

The (most annoying) thing about design

Working with UX people Technology is boring, People are interesting They have wild ideas, be patient They change their minds “ It depends...”

Technology is boring, People are interesting

They have wild ideas, be patient

They change their minds

“ It depends...”

How to get your way with UX people When designers present their initial design concepts, say... “ How will the loosely-typed bytecode hashing algorithm perform pre-emptive third-normal form garbage collection?"

When designers present their initial design concepts, say...

Recap Interaction Design List everything you need to show Map out the workflow Layout the elements Check grouping User context (Where have they been, where are they going?) Presentation Design Remove unnecessary elements Minimise variation Line stuff up Space and size things evenly Indicate grouping Adjust visual weight Less is more!

Interaction Design

List everything you need to show

Map out the workflow

Layout the elements

Check grouping

User context

(Where have they been, where are they going?)

Presentation Design

Remove unnecessary elements

Minimise variation

Line stuff up

Space and size things evenly

Indicate grouping

Adjust visual weight

Less is more!

Prizes brought to you by... Questions REMIX 08 The Next Web Now Sydney May 20 Melbourne May 22 microsoft.com/australia/remix

Prizes brought to you by...

Thank You Shane Morris [email_address] blogs.msdn.com/shanemo www.microsoft.com/australia/remix