a pragmatic view of ux driven development

A PRAGMATIC VIEW OF UX DRIVEN DEVELOPMENTAkshay Luther

akshayl@infragistics.com | @akshayl

Technical Evangelist, Infragistics

Agenda• About Infragistics• Challenges• The Value of Prototypes• UX Patterns• Examples

About Infragistics• Global market leader in UI development tools

• 20 year track record of success• 40,000+ customers across all verticals• 240+ awards

• UI toolkits for web, desktop and mobile applications - .NET & platform agnostic

• User Experience Consulting & Training• UDX, IXD, usability research feeds into product development

CHALLENGES

UX

DevCustomer

UX

DevCustomer

Other Challenges• Time• Budget• Developer Ability• Multiple Devices

• Desktop, web, mobile, tablet

THE VALUE OF PROTOTYPESMaximising Bang for Buck

Paper mockups

Wireframes (Balsamiq)

Interactive mockups (iRise)

Interactive mockups (SketchFlow)

Fidelity

Ease of creation

InteractiveMockups

Prototypes(Using UI Toolkits)

RequirementSpecifications

Fully FunctioningSoftware

Paper Mockups

Wireframes

Protototype (Blend)

Styling, Using sample data

Design surface on child items

Adding functionality

Prototype in action – it’s a real application!

Same project in developer’s IDE

UX PATTERNSA Common Language

EXAMPLESImplementing UI Patterns Using “Pattern Aware” Standardised UI Toolkits

Pattern: Visual Framework

Pattern: Ribbon

Pattern: Text Field Autocompletion

Pattern: Active Filtering

Patterns: Structured Format, Inline Validation

Pattern: Local Zooming

Pattern: Local Zooming

Patterns: Dashboard, Data Tips

Pattern: Treemap

Pattern: Dashboard

Resources• Mockup/Prototyping Tools

• Balsamiq (balsamiq.com)• iRise (irise.com)• Expression Blend & SketchFlow

(www.microsoft.com/expression/products/blend_overview.aspx)

• UX Pattern Libraries• Welie.com• Patternry (patternry.com)• UI Patterns (ui-patterns.com)• Quince (quince.infragistics.com)

Resources• UI Control Toolkits

• infragistics.com• jqueryui.com• sencha.com• telerik.com• devexpress.com

Thank You• akshayl@infragistics.com• superhappycoder.wordpress.com

• (slides will be posted here)