SlideShare une entreprise Scribd logo
1  sur  22
Wireless: extjs pw: extjsmeetup Make sure you sign in w/ Jonathan [Twitter handle] JavaScript Magazine code: UGDC Manning Code: extjs50 Ext JS Meetup
January 19, 2010 Designing for Use w/ Ext JS
RIA: Reaching the Next Plateau
Process Maturity Platform Maturity Device Maturity [+ convergence] Data visualization Grids, charts, graphs, maps User Maturity – customization and control ‘User Directed Interfaces’ as opposed to ‘design for user’ RIA: Reaching the Next Plateau
Changing frame of reference
Communication Challenges Web 2.0, 3.0, Drag-and-Drop, ZZZzzzzzz Invalidated notions of finished states Reference the way successful sites LOOK Reference the way successful sites ACT Mint.com Anything Google Anything Desktop, fat client experience Changing frame of reference
[object Object],Determining Risk and Complexity Lack of knowledge of ‘Big App’ development Lack of pattern knowledge on the infrastructure side of RIA Knowledge Gap – ‘Honest Mistakes’ Customers/Designers don’t know what is available in the toolbox Serialized analysis/ design cycles Too much customization Consistency to a fault Inconsistent business rules for a ‘consistent’ UI Where Things go Wrong
Working: Quicker Feedback/ Dev iterations Designing Focus on Interactions and re-use Design Pattern Library Design Component Library [Style Guide] Developing Custom Components Aesthetics: Renderer/ Templates/ Themes Squaring the Circle
Modals/ Error Form Validation Search/ Find / Browse Navigation vs. Action Ext JS as Design Pattern Library
Agile + Ext JS + Omnigraffle
Meeting Facilitation High resolution wireframes remove Hand Waving + Leap of Faith Constraints on Design Working ‘with’ or ‘against’ the Framework Scope/LOE Consistency Agile + Ext JS + Omnigraffle
Agile: Story Mental Model
Agile: Story Dependency
Agile: Story Dependency
Agile + Ext JS + Omnigraffle
Deliverables: Wireframes (Low-Res)
Ext JS Wireframes
Ext JS Wireframing
19 Focus on conversations not documentation January 19, 2010
Maintaining shared understanding Agile UX Prototype driven analysis Business, customer, and dev team stakeholders Text based ‘wireframes’ Ext JS Component architecture allows for meta-code descriptions TPG Envision Distributed Design Location independent teams/ interdisciplinary skills/ skill levels Process maturity, deliverables, infrastructure Distributed Design
Developers Common language for discussion w/ designers API, Docs, examples Customers Highly visual deliverables 80%/20% out of the box UX/ Interaction Designers Ext JS Designer Ext JS example site == Design Pattern Library Omnigraffle Stencil == Rapid Prototyping Ext JS Designer!! What’s in it for me?
Happy Coding!

Contenu connexe

Similaire à Three Pillar Global Design For Use

Rich User Experience Documentation - Update
Rich User Experience Documentation - UpdateRich User Experience Documentation - Update
Rich User Experience Documentation - UpdateJohn Yesko
 
Makersbay Nex-Gen Software Development Overview
Makersbay Nex-Gen Software Development OverviewMakersbay Nex-Gen Software Development Overview
Makersbay Nex-Gen Software Development Overviewslodha
 
Wireframes and UI-Prototypes
Wireframes and UI-PrototypesWireframes and UI-Prototypes
Wireframes and UI-Prototypestec
 
Application Prototyping - Pablo González - Capturing and Managing Requirements
Application Prototyping - Pablo González - Capturing and Managing RequirementsApplication Prototyping - Pablo González - Capturing and Managing Requirements
Application Prototyping - Pablo González - Capturing and Managing RequirementsVisure Solutions
 
User Experience Roles Competencies
User Experience  Roles  CompetenciesUser Experience  Roles  Competencies
User Experience Roles CompetenciesSameer Chavan
 
What is a pba webdeveloper?
What is a pba webdeveloper?What is a pba webdeveloper?
What is a pba webdeveloper?tiefield
 
Intro to IA/IxD/UXD in the agency world
Intro to IA/IxD/UXD in the agency worldIntro to IA/IxD/UXD in the agency world
Intro to IA/IxD/UXD in the agency worldKarri Ojanen
 
From Website To Webapp Shane Morris
From Website To Webapp   Shane MorrisFrom Website To Webapp   Shane Morris
From Website To Webapp Shane MorrisShane Morris
 
Designing Powerful Web Applications Using AJAX and Other RIAs
Designing Powerful Web Applications Using AJAX and Other RIAsDesigning Powerful Web Applications Using AJAX and Other RIAs
Designing Powerful Web Applications Using AJAX and Other RIAsDave Malouf
 
Please Define: Roles in User Experience Design
Please Define: Roles in User Experience DesignPlease Define: Roles in User Experience Design
Please Define: Roles in User Experience DesignSkye Sant
 
Better Design Built Faster: Using New UI Technologies to Speed Development
Better Design Built Faster: Using New UI Technologies to Speed DevelopmentBetter Design Built Faster: Using New UI Technologies to Speed Development
Better Design Built Faster: Using New UI Technologies to Speed Developmentgoodfriday
 
Putting the "User" back in User Experience
Putting the "User" back in User ExperiencePutting the "User" back in User Experience
Putting the "User" back in User ExperienceJeremy Johnson
 
Twitter bootstrap-101
Twitter bootstrap-101Twitter bootstrap-101
Twitter bootstrap-101Kim Hardie
 

Similaire à Three Pillar Global Design For Use (20)

Rich User Experience Documentation - Update
Rich User Experience Documentation - UpdateRich User Experience Documentation - Update
Rich User Experience Documentation - Update
 
Makersbay Nex-Gen Software Development Overview
Makersbay Nex-Gen Software Development OverviewMakersbay Nex-Gen Software Development Overview
Makersbay Nex-Gen Software Development Overview
 
Wireframes and UI-Prototypes
Wireframes and UI-PrototypesWireframes and UI-Prototypes
Wireframes and UI-Prototypes
 
Application Prototyping - Pablo González - Capturing and Managing Requirements
Application Prototyping - Pablo González - Capturing and Managing RequirementsApplication Prototyping - Pablo González - Capturing and Managing Requirements
Application Prototyping - Pablo González - Capturing and Managing Requirements
 
UXCampDC 2010 - Agile UX
UXCampDC 2010 - Agile UXUXCampDC 2010 - Agile UX
UXCampDC 2010 - Agile UX
 
User Experience Roles Competencies
User Experience  Roles  CompetenciesUser Experience  Roles  Competencies
User Experience Roles Competencies
 
What is a pba webdeveloper?
What is a pba webdeveloper?What is a pba webdeveloper?
What is a pba webdeveloper?
 
Intro to IA/IxD/UXD in the agency world
Intro to IA/IxD/UXD in the agency worldIntro to IA/IxD/UXD in the agency world
Intro to IA/IxD/UXD in the agency world
 
From Website To Webapp Shane Morris
From Website To Webapp   Shane MorrisFrom Website To Webapp   Shane Morris
From Website To Webapp Shane Morris
 
Designing Powerful Web Applications Using AJAX and Other RIAs
Designing Powerful Web Applications Using AJAX and Other RIAsDesigning Powerful Web Applications Using AJAX and Other RIAs
Designing Powerful Web Applications Using AJAX and Other RIAs
 
Java-J2ee_Resume
Java-J2ee_ResumeJava-J2ee_Resume
Java-J2ee_Resume
 
Please Define: Roles in User Experience Design
Please Define: Roles in User Experience DesignPlease Define: Roles in User Experience Design
Please Define: Roles in User Experience Design
 
Better Design Built Faster: Using New UI Technologies to Speed Development
Better Design Built Faster: Using New UI Technologies to Speed DevelopmentBetter Design Built Faster: Using New UI Technologies to Speed Development
Better Design Built Faster: Using New UI Technologies to Speed Development
 
Putting the "User" back in User Experience
Putting the "User" back in User ExperiencePutting the "User" back in User Experience
Putting the "User" back in User Experience
 
Resume
ResumeResume
Resume
 
Jintu_UI_CV
Jintu_UI_CVJintu_UI_CV
Jintu_UI_CV
 
Application development framework
Application development frameworkApplication development framework
Application development framework
 
Twitter bootstrap-101
Twitter bootstrap-101Twitter bootstrap-101
Twitter bootstrap-101
 
Resume - Dhanshri Kalgaonkar
Resume - Dhanshri KalgaonkarResume - Dhanshri Kalgaonkar
Resume - Dhanshri Kalgaonkar
 
UXD's process
UXD's processUXD's process
UXD's process
 

Dernier

Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native ApplicationsWSO2
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century educationjfdjdjcjdnsjd
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...apidays
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Victor Rentea
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityWSO2
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024The Digital Insurer
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodJuan lago vázquez
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamUiPathCommunity
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...apidays
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDropbox
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Angeliki Cooney
 
Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​Bhuvaneswari Subramani
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Zilliz
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...apidays
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 

Dernier (20)

Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering Developers
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 

Three Pillar Global Design For Use

  • 1. Wireless: extjs pw: extjsmeetup Make sure you sign in w/ Jonathan [Twitter handle] JavaScript Magazine code: UGDC Manning Code: extjs50 Ext JS Meetup
  • 2. January 19, 2010 Designing for Use w/ Ext JS
  • 3. RIA: Reaching the Next Plateau
  • 4. Process Maturity Platform Maturity Device Maturity [+ convergence] Data visualization Grids, charts, graphs, maps User Maturity – customization and control ‘User Directed Interfaces’ as opposed to ‘design for user’ RIA: Reaching the Next Plateau
  • 5. Changing frame of reference
  • 6. Communication Challenges Web 2.0, 3.0, Drag-and-Drop, ZZZzzzzzz Invalidated notions of finished states Reference the way successful sites LOOK Reference the way successful sites ACT Mint.com Anything Google Anything Desktop, fat client experience Changing frame of reference
  • 7.
  • 8. Working: Quicker Feedback/ Dev iterations Designing Focus on Interactions and re-use Design Pattern Library Design Component Library [Style Guide] Developing Custom Components Aesthetics: Renderer/ Templates/ Themes Squaring the Circle
  • 9. Modals/ Error Form Validation Search/ Find / Browse Navigation vs. Action Ext JS as Design Pattern Library
  • 10. Agile + Ext JS + Omnigraffle
  • 11. Meeting Facilitation High resolution wireframes remove Hand Waving + Leap of Faith Constraints on Design Working ‘with’ or ‘against’ the Framework Scope/LOE Consistency Agile + Ext JS + Omnigraffle
  • 15. Agile + Ext JS + Omnigraffle
  • 19. 19 Focus on conversations not documentation January 19, 2010
  • 20. Maintaining shared understanding Agile UX Prototype driven analysis Business, customer, and dev team stakeholders Text based ‘wireframes’ Ext JS Component architecture allows for meta-code descriptions TPG Envision Distributed Design Location independent teams/ interdisciplinary skills/ skill levels Process maturity, deliverables, infrastructure Distributed Design
  • 21. Developers Common language for discussion w/ designers API, Docs, examples Customers Highly visual deliverables 80%/20% out of the box UX/ Interaction Designers Ext JS Designer Ext JS example site == Design Pattern Library Omnigraffle Stencil == Rapid Prototyping Ext JS Designer!! What’s in it for me?