Upload
akshay-luther
View
109
Download
1
Tags:
Embed Size (px)
DESCRIPTION
This presentation shows how using UI toolkits that a) have broad and deep functionality exposed by a powerful design-time interface and b) that are "pattern aware" is a winning strategy for UX driven development. Firstly, they minimise the disconnect between the customer, UX practictioner and developer by enabling the easy creation of high-fidelity prototypes. Secondly, they address the challenges of time, budget, developer ability and the growing need to target multiple devices.
Citation preview
A PRAGMATIC VIEW OF UX DRIVEN DEVELOPMENTAkshay Luther
[email protected] | @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• [email protected]• superhappycoder.wordpress.com
• (slides will be posted here)