SlideShare a Scribd company logo
BETTER DESIGN, BUILT FASTER Using new UI technologies to speed development mix 06 03.21.2006
AGENDA /  INTRODUCTIONS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Mason Hale Chief Technologist frog design Austin, Texas [email_address] Nelan Schwartz Technology Manager frog design Austin, Texas [email_address]
/ UI TRENDS  / THE EARLY YEARS The first human-computer interfaces were strictly utilitarian.
/ UI TRENDS  / THE COMMAND LINE / UI TRENDS  / TEXT AND EARLY GRAPHICAL INTERFACES The next wave of computer interfaces focused on increasing productivity for expert users.
/ UI TRENDS  / DAWN OF THE GUI / UI TRENDS  / DAWN OF THE GUI Graphical User Interface (GUI)-based operating systems strived for system-wide consistency.
/ UI TRENDS  / THE WEB ..then the Web happened. In the evolutionary history of software user interfaces, the advent of the World Wide Web began a Cambrian explosion of UI diversity. Certain conventions such as:  - the shopping cart,  - tabs,  - navigation bars, and  - search boxes catch on and are nearly universally adopted.
/ UI TRENDS  / USER EXPERIENCE / UI TRENDS  / SYSTEM LEVEL USER EXPERIENCE Operating systems respond to user demand for compelling user experience.
/ UI TRENDS  / BLURRING THE WEB/DESKTOP BOUNDARY While the web was influencing operating system and application user interfaces, web applications were becoming more robust and desktop-like.
/ UI TRENDS  / WEB/DESKTOP CONVERGENCE  ,[object Object],[object Object],[object Object],[object Object]
/ UI TRENDS  / WHAT’S NEXT? enjoyable useful physical ui clui gui ? intuitive
/ UI TRENDS  / WHERE IS THIS GOING? ? web desktop robust fragile flat rich
/ UI TRENDS  / LAYERS, LANGUAGES & TOOLS Various JavaScript HTML, XHTML CSS, XSL AJAX / DHTML Visual Studio C++ C++ Win32 / MFC Visual Studio C#, VB.NET, J# (any .NET) C#, VB.NET, J# (any .NET) .NET WinForms Visual Studio “Sparkle” / “Cider” C#, VB.NET  (any .NET) XAML WPF (Avalon) Laszlo IDE plug-in JavaScript LZX OpenLaszlo FLEX Builder ActionScript 2.0 MXML, CSS FLEX Various JavaScript XUL, CSS XUL Flash ActionScript none or ActionScript Macromedia Flash Any Java IDE Java Java Java Swing / SWT Tools Logic User Interface
/ UI TRENDS  / LAYERS, LANGUAGES & TOOLS Various JavaScript HTML, XHTML CSS, XSL AJAX / DHTML Visual Studio C++ C++ Win32 / MFC Visual Studio C#, VB.NET, J# (any .NET) C#, VB.NET, J# (any .NET) .NET WinForms Visual Studio “Sparkle” / “Cider” C#, VB.NET  (any .NET) XAML WPF (Avalon) Laszlo IDE plug-in JavaScript LZX OpenLaszlo FLEX Builder ActionScript 2.0 MXML, CSS FLEX Various JavaScript XUL, CSS XUL Flash ActionScript none or ActionScript Macromedia Flash Any Java IDE Java Java Java Swing / SWT Tools Logic User Interface
/ EXAMPLES /  WEB / BLOCKBUSTER.COM
/ EXAMPLES  / WEB / TYPICAL PROCESS (SIMPLE) CSS PHP Designer / Developer Images Photoshop Text Editor Web Site
/ EXAMPLES  / WEB / TYPICAL PROCESS (COMPLEX) Designer Developer Visual Design (Comps) HTML Design Analyst Wire- frames Sitemap (IA) CSS Design Tech JAVA Photoshop Eclipse Visio / OmniGraffle Text Editor Web Site
/ EXAMPLES  / WEB / WIREFRAME
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side web browser application server
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side ASP/ C# / Java / JSP / etc web browser application server
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side <HTML> ASP/ C# / Java / JSP / etc web browser application server
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side Style Layout Data ASP/ C# / Java / JSP / etc <HTML> web browser application server
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side <HTML> CSS ASP/ C# / Java / JSP / etc web browser application server
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side <HTML> Layout Data CSS Style ASP/ C# / Java / JSP / etc web browser application server
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side <HTML> CSS ASP/ C# / Java / JSP / etc web browser application server
/ EXAMPLES  / WEB / UI SEPARATION WITH CSS client-side server-side Style Layout ASP/ C# / Java / JSP / etc <HTML> CSS Data web browser application server
/ EXAMPLES  / WEB / GENERIC CONTAINER HTML
/ EXAMPLES   /  WEB / DEMO
/ EXAMPLES  / WEB / REVISED PROCESS Designer Developer Visual Design (Comps) Design Analyst Wire- frames Sitemap (IA) CSS Design Tech JAVA Photoshop Eclipse Visio / OmniGraffle Text Editor Web Site Design Tech Text Editor HTML
/ EXAMPLES   /  WPF
/ EXAMPLES  / WPF / TYPICAL SOFTWARE PROCESS Architect Developer Functional Specification Marketing Marketing Requirements Document (MRD) C++ Code Visio / UML Word App Analyst Visual Studio Word Software Architecture
/ EXAMPLES  / WPF / TYPICAL SOFTWARE PROCESS + DESIGN Architect Developer Functional Specification Marketing Marketing Requirements Document (MRD) C++ Code Visio / UML Word App Analyst Visual Studio Word Software Architecture Designer Photoshop UI Design
/ EXAMPLES  / WPF / REDLINE DESIGN SPEC
/ EXAMPLES  / WPF / UI SEPARATION WITH XAML Style Layout Form.cs Program.cs Logic Application
/ EXAMPLES  / WPF / UI SEPARATION WITH XAML Style Layout Window.xaml Window.xaml.cs Logic Application
/ EXAMPLES  / WPF / UI SEPARATION WITH XAML Style Window.xaml Window.xaml.cs Logic Application Styles.xaml Layout
/ EXAMPLES   /  WPF / DEMO
/ EXAMPLES  / WPF / DEMO
/ EXAMPLES  / WPF / DEMO
/ EXAMPLES  / WPF / DEMO
/ EXAMPLES  / WPF / REVISED SOFTWARE PROCESS Architect Functional Specification Marketing Marketing Requirements Document (MRD) Visio / UML Word App Analyst Word Software Architecture C# Designer “ Sparkle” Developer Visual Studio + “Cider” XAML
/ CONCLUSIONS
/ CONCLUSIONS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
/ CONCLUSIONS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
QUESTIONS?
Session Evaluations We value your feedback, so please submit an online evaluation for each session you attend! To make it worth your while, we pick one evaluation from each of the ten session timeslots. If we pick your eval, you will be eligible to win a Creative  Zen MicroPhoto

More Related Content

What's hot

Web Site Design Principles
Web Site Design PrinciplesWeb Site Design Principles
Web Site Design Principles
Mukesh Tekwani
 
Cloud Apache OpenOffice based on HTML5
Cloud Apache OpenOffice based on HTML5Cloud Apache OpenOffice based on HTML5
Cloud Apache OpenOffice based on HTML5
pescetti
 
Front End Development | Introduction
Front End Development | IntroductionFront End Development | Introduction
Front End Development | Introduction
JohnTaieb
 
Designing for The Modern Web
Designing for The Modern WebDesigning for The Modern Web
Designing for The Modern Web
Sara Cannon
 
Tip from ConnectED 2015: How to Use Those Cool New Frameworks in Mobile Domin...
Tip from ConnectED 2015: How to Use Those Cool New Frameworks in Mobile Domin...Tip from ConnectED 2015: How to Use Those Cool New Frameworks in Mobile Domin...
Tip from ConnectED 2015: How to Use Those Cool New Frameworks in Mobile Domin...
SocialBiz UserGroup
 
How To be a Backend developer
How To be a Backend developer    How To be a Backend developer
How To be a Backend developer
Ramy Hakam
 
Facebook on Rails
Facebook on RailsFacebook on Rails
Facebook on Rails
mc77
 
RESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web DesignRESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web Design
Dave Olsen
 
PLASTIC 2011: "Enterprise JavaScript with Jangaroo"
PLASTIC 2011: "Enterprise JavaScript with Jangaroo"PLASTIC 2011: "Enterprise JavaScript with Jangaroo"
PLASTIC 2011: "Enterprise JavaScript with Jangaroo"
Frank Wienberg
 
Difference between frontend and backend
Difference between frontend and backendDifference between frontend and backend
Difference between frontend and backend
Rahul Rana
 
Windows Presentation Foundation & XAML
Windows Presentation Foundation & XAMLWindows Presentation Foundation & XAML
Windows Presentation Foundation & XAML
Alex Sooraj
 
Getting hands on with xaml and xamarin
Getting hands on with xaml and xamarinGetting hands on with xaml and xamarin
Getting hands on with xaml and xamarin
Mitchell Muenster
 
WDN08 Silverlight
WDN08 SilverlightWDN08 Silverlight
WDN08 Silverlight
wsmith67
 
Xamarin Dev Days - Xamarin.Forms
Xamarin Dev Days -  Xamarin.FormsXamarin Dev Days -  Xamarin.Forms
Xamarin Dev Days - Xamarin.Forms
Javier Suárez Ruiz
 
Windows Presentation Foundation
Windows Presentation FoundationWindows Presentation Foundation
Windows Presentation Foundation
Tran Ngoc Son
 
Adobe Flex builder by elmagnif
Adobe Flex builder  by elmagnifAdobe Flex builder  by elmagnif
Adobe Flex builder by elmagnif
mbaye camara
 
Front end development best practices
Front end development best practicesFront end development best practices
Front end development best practices
Karolina Coates
 
Xamarin.Forms - Building Cross Platform Mobile Apps
Xamarin.Forms - Building Cross Platform Mobile AppsXamarin.Forms - Building Cross Platform Mobile Apps
Xamarin.Forms - Building Cross Platform Mobile Apps
WinWire Technologies Inc
 
Usability In Mobile Applications
Usability In Mobile ApplicationsUsability In Mobile Applications
Usability In Mobile Applications
Bruno Figueiredo
 
MSDN Unleashed: WPF Demystified
MSDN Unleashed: WPF DemystifiedMSDN Unleashed: WPF Demystified
MSDN Unleashed: WPF DemystifiedDave Bost
 

What's hot (20)

Web Site Design Principles
Web Site Design PrinciplesWeb Site Design Principles
Web Site Design Principles
 
Cloud Apache OpenOffice based on HTML5
Cloud Apache OpenOffice based on HTML5Cloud Apache OpenOffice based on HTML5
Cloud Apache OpenOffice based on HTML5
 
Front End Development | Introduction
Front End Development | IntroductionFront End Development | Introduction
Front End Development | Introduction
 
Designing for The Modern Web
Designing for The Modern WebDesigning for The Modern Web
Designing for The Modern Web
 
Tip from ConnectED 2015: How to Use Those Cool New Frameworks in Mobile Domin...
Tip from ConnectED 2015: How to Use Those Cool New Frameworks in Mobile Domin...Tip from ConnectED 2015: How to Use Those Cool New Frameworks in Mobile Domin...
Tip from ConnectED 2015: How to Use Those Cool New Frameworks in Mobile Domin...
 
How To be a Backend developer
How To be a Backend developer    How To be a Backend developer
How To be a Backend developer
 
Facebook on Rails
Facebook on RailsFacebook on Rails
Facebook on Rails
 
RESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web DesignRESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web Design
 
PLASTIC 2011: "Enterprise JavaScript with Jangaroo"
PLASTIC 2011: "Enterprise JavaScript with Jangaroo"PLASTIC 2011: "Enterprise JavaScript with Jangaroo"
PLASTIC 2011: "Enterprise JavaScript with Jangaroo"
 
Difference between frontend and backend
Difference between frontend and backendDifference between frontend and backend
Difference between frontend and backend
 
Windows Presentation Foundation & XAML
Windows Presentation Foundation & XAMLWindows Presentation Foundation & XAML
Windows Presentation Foundation & XAML
 
Getting hands on with xaml and xamarin
Getting hands on with xaml and xamarinGetting hands on with xaml and xamarin
Getting hands on with xaml and xamarin
 
WDN08 Silverlight
WDN08 SilverlightWDN08 Silverlight
WDN08 Silverlight
 
Xamarin Dev Days - Xamarin.Forms
Xamarin Dev Days -  Xamarin.FormsXamarin Dev Days -  Xamarin.Forms
Xamarin Dev Days - Xamarin.Forms
 
Windows Presentation Foundation
Windows Presentation FoundationWindows Presentation Foundation
Windows Presentation Foundation
 
Adobe Flex builder by elmagnif
Adobe Flex builder  by elmagnifAdobe Flex builder  by elmagnif
Adobe Flex builder by elmagnif
 
Front end development best practices
Front end development best practicesFront end development best practices
Front end development best practices
 
Xamarin.Forms - Building Cross Platform Mobile Apps
Xamarin.Forms - Building Cross Platform Mobile AppsXamarin.Forms - Building Cross Platform Mobile Apps
Xamarin.Forms - Building Cross Platform Mobile Apps
 
Usability In Mobile Applications
Usability In Mobile ApplicationsUsability In Mobile Applications
Usability In Mobile Applications
 
MSDN Unleashed: WPF Demystified
MSDN Unleashed: WPF DemystifiedMSDN Unleashed: WPF Demystified
MSDN Unleashed: WPF Demystified
 

Similar to Better Design Built Faster: Using New UI Technologies to Speed Development

Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code CampDoing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code CampChris Love
 
Aspnet2.0 Introduction
Aspnet2.0 IntroductionAspnet2.0 Introduction
Aspnet2.0 IntroductionChanHan Hy
 
Architecting RIAs
Architecting RIAsArchitecting RIAs
Architecting RIAs
Mark Nankman
 
$Resume2016 edward chen
$Resume2016 edward chen$Resume2016 edward chen
$Resume2016 edward chen
ed Chen
 
$resume2016_EdwardChen
$resume2016_EdwardChen$resume2016_EdwardChen
$resume2016_EdwardChened Chen
 
Food borne human diseases
Food borne human diseasesFood borne human diseases
Food borne human diseases
AmalMohammedNasserSa
 
Web development concepts using microsoft technologies
Web development concepts using microsoft technologiesWeb development concepts using microsoft technologies
Web development concepts using microsoft technologies
Hosam Kamel
 
Visual Studio 2008 & .Net 3.5
Visual Studio 2008 & .Net 3.5Visual Studio 2008 & .Net 3.5
Visual Studio 2008 & .Net 3.5Hadi Karimi
 
Modern C&C Systems, Using New Technologies
Modern C&C Systems, Using New TechnologiesModern C&C Systems, Using New Technologies
Modern C&C Systems, Using New TechnologiesTamir Khason
 
SPCA2013 - Building Windows Client Applications for SharePoint 2013
SPCA2013 - Building Windows Client Applications for SharePoint 2013SPCA2013 - Building Windows Client Applications for SharePoint 2013
SPCA2013 - Building Windows Client Applications for SharePoint 2013
NCCOMMS
 
Front End Lecture 1.pptx
Front End Lecture 1.pptxFront End Lecture 1.pptx
Front End Lecture 1.pptx
malise2997
 
Web Development for UX Designers
Web Development for UX DesignersWeb Development for UX Designers
Web Development for UX Designers
Ashlimarie
 
EDMUG Silverlight Talk
EDMUG Silverlight TalkEDMUG Silverlight Talk
EDMUG Silverlight Talk
Mark Bennett
 
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise
Doing Modern Web, aka JavaScript and HTML5 in the EnterpriseDoing Modern Web, aka JavaScript and HTML5 in the Enterprise
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise
Chris Love
 
WPF Unleashed: Building Application with Visual Studio 2008 SP1
WPF Unleashed: Building Application with Visual Studio 2008 SP1WPF Unleashed: Building Application with Visual Studio 2008 SP1
WPF Unleashed: Building Application with Visual Studio 2008 SP1Dave Bost
 
webdevelopmentppt-210923044639 (1).pptx
webdevelopmentppt-210923044639 (1).pptxwebdevelopmentppt-210923044639 (1).pptx
webdevelopmentppt-210923044639 (1).pptx
learnEnglish51
 
Top 10 Front End Developer Skills | How to become a Front End Developer? Edureka
Top 10 Front End Developer Skills | How to become a Front End Developer? EdurekaTop 10 Front End Developer Skills | How to become a Front End Developer? Edureka
Top 10 Front End Developer Skills | How to become a Front End Developer? Edureka
Edureka!
 
Introduction To Rich Internet Applications
Introduction To Rich Internet ApplicationsIntroduction To Rich Internet Applications
Introduction To Rich Internet Applications
Abdelmonaim Remani
 

Similar to Better Design Built Faster: Using New UI Technologies to Speed Development (20)

Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code CampDoing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise NYC Code Camp
 
Aspnet2.0 Introduction
Aspnet2.0 IntroductionAspnet2.0 Introduction
Aspnet2.0 Introduction
 
Architecting RIAs
Architecting RIAsArchitecting RIAs
Architecting RIAs
 
$Resume2016 edward chen
$Resume2016 edward chen$Resume2016 edward chen
$Resume2016 edward chen
 
$resume2016_EdwardChen
$resume2016_EdwardChen$resume2016_EdwardChen
$resume2016_EdwardChen
 
Exp Web
Exp WebExp Web
Exp Web
 
Food borne human diseases
Food borne human diseasesFood borne human diseases
Food borne human diseases
 
Web development concepts using microsoft technologies
Web development concepts using microsoft technologiesWeb development concepts using microsoft technologies
Web development concepts using microsoft technologies
 
Visual Studio 2008 & .Net 3.5
Visual Studio 2008 & .Net 3.5Visual Studio 2008 & .Net 3.5
Visual Studio 2008 & .Net 3.5
 
Modern C&C Systems, Using New Technologies
Modern C&C Systems, Using New TechnologiesModern C&C Systems, Using New Technologies
Modern C&C Systems, Using New Technologies
 
SPCA2013 - Building Windows Client Applications for SharePoint 2013
SPCA2013 - Building Windows Client Applications for SharePoint 2013SPCA2013 - Building Windows Client Applications for SharePoint 2013
SPCA2013 - Building Windows Client Applications for SharePoint 2013
 
Front End Lecture 1.pptx
Front End Lecture 1.pptxFront End Lecture 1.pptx
Front End Lecture 1.pptx
 
Web Development for UX Designers
Web Development for UX DesignersWeb Development for UX Designers
Web Development for UX Designers
 
EDMUG Silverlight Talk
EDMUG Silverlight TalkEDMUG Silverlight Talk
EDMUG Silverlight Talk
 
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise
Doing Modern Web, aka JavaScript and HTML5 in the EnterpriseDoing Modern Web, aka JavaScript and HTML5 in the Enterprise
Doing Modern Web, aka JavaScript and HTML5 in the Enterprise
 
WPF Unleashed: Building Application with Visual Studio 2008 SP1
WPF Unleashed: Building Application with Visual Studio 2008 SP1WPF Unleashed: Building Application with Visual Studio 2008 SP1
WPF Unleashed: Building Application with Visual Studio 2008 SP1
 
TRWResume-10-2016
TRWResume-10-2016TRWResume-10-2016
TRWResume-10-2016
 
webdevelopmentppt-210923044639 (1).pptx
webdevelopmentppt-210923044639 (1).pptxwebdevelopmentppt-210923044639 (1).pptx
webdevelopmentppt-210923044639 (1).pptx
 
Top 10 Front End Developer Skills | How to become a Front End Developer? Edureka
Top 10 Front End Developer Skills | How to become a Front End Developer? EdurekaTop 10 Front End Developer Skills | How to become a Front End Developer? Edureka
Top 10 Front End Developer Skills | How to become a Front End Developer? Edureka
 
Introduction To Rich Internet Applications
Introduction To Rich Internet ApplicationsIntroduction To Rich Internet Applications
Introduction To Rich Internet Applications
 

More from goodfriday

Narine Presentations 20051021 134052
Narine Presentations 20051021 134052Narine Presentations 20051021 134052
Narine Presentations 20051021 134052goodfriday
 
09 03 22 easter
09 03 22 easter09 03 22 easter
09 03 22 eastergoodfriday
 
Holy Week Easter 2009
Holy Week Easter 2009Holy Week Easter 2009
Holy Week Easter 2009goodfriday
 
Holt Park Easter 09 Swim
Holt Park Easter 09 SwimHolt Park Easter 09 Swim
Holt Park Easter 09 Swimgoodfriday
 
Swarthmore Lentbrochure20092
Swarthmore Lentbrochure20092Swarthmore Lentbrochure20092
Swarthmore Lentbrochure20092goodfriday
 
Eastercard2009
Eastercard2009Eastercard2009
Eastercard2009goodfriday
 
Easterservices2009
Easterservices2009Easterservices2009
Easterservices2009goodfriday
 
Bulletin Current
Bulletin CurrentBulletin Current
Bulletin Currentgoodfriday
 
March 2009 Newsletter
March 2009 NewsletterMarch 2009 Newsletter
March 2009 Newslettergoodfriday
 
Lent Easter 2009
Lent Easter 2009Lent Easter 2009
Lent Easter 2009goodfriday
 
Easterpowersports09
Easterpowersports09Easterpowersports09
Easterpowersports09goodfriday
 
Easter Trading 09
Easter Trading 09Easter Trading 09
Easter Trading 09goodfriday
 
Easter Brochure 2009
Easter Brochure 2009Easter Brochure 2009
Easter Brochure 2009goodfriday
 
March April 2009 Calendar
March April 2009 CalendarMarch April 2009 Calendar
March April 2009 Calendargoodfriday
 

More from goodfriday (20)

Narine Presentations 20051021 134052
Narine Presentations 20051021 134052Narine Presentations 20051021 134052
Narine Presentations 20051021 134052
 
Triunemar05
Triunemar05Triunemar05
Triunemar05
 
09 03 22 easter
09 03 22 easter09 03 22 easter
09 03 22 easter
 
Holy Week Easter 2009
Holy Week Easter 2009Holy Week Easter 2009
Holy Week Easter 2009
 
Holt Park Easter 09 Swim
Holt Park Easter 09 SwimHolt Park Easter 09 Swim
Holt Park Easter 09 Swim
 
Easter Letter
Easter LetterEaster Letter
Easter Letter
 
April2009
April2009April2009
April2009
 
Swarthmore Lentbrochure20092
Swarthmore Lentbrochure20092Swarthmore Lentbrochure20092
Swarthmore Lentbrochure20092
 
Eastercard2009
Eastercard2009Eastercard2009
Eastercard2009
 
Easterservices2009
Easterservices2009Easterservices2009
Easterservices2009
 
Bulletin Current
Bulletin CurrentBulletin Current
Bulletin Current
 
Easter2009
Easter2009Easter2009
Easter2009
 
Bulletin
BulletinBulletin
Bulletin
 
March 2009 Newsletter
March 2009 NewsletterMarch 2009 Newsletter
March 2009 Newsletter
 
Mar 29 2009
Mar 29 2009Mar 29 2009
Mar 29 2009
 
Lent Easter 2009
Lent Easter 2009Lent Easter 2009
Lent Easter 2009
 
Easterpowersports09
Easterpowersports09Easterpowersports09
Easterpowersports09
 
Easter Trading 09
Easter Trading 09Easter Trading 09
Easter Trading 09
 
Easter Brochure 2009
Easter Brochure 2009Easter Brochure 2009
Easter Brochure 2009
 
March April 2009 Calendar
March April 2009 CalendarMarch April 2009 Calendar
March April 2009 Calendar
 

Recently uploaded

Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Product School
 
Elevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object CalisthenicsElevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object Calisthenics
Dorra BARTAGUIZ
 
By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024
Pierluigi Pugliese
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance
 
Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfObservability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Paige Cruz
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
Alan Dix
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
Kari Kakkonen
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
DanBrown980551
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
UiPathCommunity
 
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Thierry Lestable
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
Product School
 
Quantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIsQuantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIs
Vlad Stirbu
 
Welocme to ViralQR, your best QR code generator.
Welocme to ViralQR, your best QR code generator.Welocme to ViralQR, your best QR code generator.
Welocme to ViralQR, your best QR code generator.
ViralQR
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance
 
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Albert Hoitingh
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
BookNet Canada
 
PCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase TeamPCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase Team
ControlCase
 
Free Complete Python - A step towards Data Science
Free Complete Python - A step towards Data ScienceFree Complete Python - A step towards Data Science
Free Complete Python - A step towards Data Science
RinaMondal9
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance
 

Recently uploaded (20)

Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
 
Elevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object CalisthenicsElevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object Calisthenics
 
By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
 
Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
 
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfObservability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
 
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
 
Quantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIsQuantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIs
 
Welocme to ViralQR, your best QR code generator.
Welocme to ViralQR, your best QR code generator.Welocme to ViralQR, your best QR code generator.
Welocme to ViralQR, your best QR code generator.
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
 
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
 
PCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase TeamPCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase Team
 
Free Complete Python - A step towards Data Science
Free Complete Python - A step towards Data ScienceFree Complete Python - A step towards Data Science
Free Complete Python - A step towards Data Science
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
 

Better Design Built Faster: Using New UI Technologies to Speed Development

  • 1. BETTER DESIGN, BUILT FASTER Using new UI technologies to speed development mix 06 03.21.2006
  • 2.
  • 3. / UI TRENDS / THE EARLY YEARS The first human-computer interfaces were strictly utilitarian.
  • 4. / UI TRENDS / THE COMMAND LINE / UI TRENDS / TEXT AND EARLY GRAPHICAL INTERFACES The next wave of computer interfaces focused on increasing productivity for expert users.
  • 5. / UI TRENDS / DAWN OF THE GUI / UI TRENDS / DAWN OF THE GUI Graphical User Interface (GUI)-based operating systems strived for system-wide consistency.
  • 6. / UI TRENDS / THE WEB ..then the Web happened. In the evolutionary history of software user interfaces, the advent of the World Wide Web began a Cambrian explosion of UI diversity. Certain conventions such as: - the shopping cart, - tabs, - navigation bars, and - search boxes catch on and are nearly universally adopted.
  • 7. / UI TRENDS / USER EXPERIENCE / UI TRENDS / SYSTEM LEVEL USER EXPERIENCE Operating systems respond to user demand for compelling user experience.
  • 8. / UI TRENDS / BLURRING THE WEB/DESKTOP BOUNDARY While the web was influencing operating system and application user interfaces, web applications were becoming more robust and desktop-like.
  • 9.
  • 10. / UI TRENDS / WHAT’S NEXT? enjoyable useful physical ui clui gui ? intuitive
  • 11. / UI TRENDS / WHERE IS THIS GOING? ? web desktop robust fragile flat rich
  • 12. / UI TRENDS / LAYERS, LANGUAGES & TOOLS Various JavaScript HTML, XHTML CSS, XSL AJAX / DHTML Visual Studio C++ C++ Win32 / MFC Visual Studio C#, VB.NET, J# (any .NET) C#, VB.NET, J# (any .NET) .NET WinForms Visual Studio “Sparkle” / “Cider” C#, VB.NET (any .NET) XAML WPF (Avalon) Laszlo IDE plug-in JavaScript LZX OpenLaszlo FLEX Builder ActionScript 2.0 MXML, CSS FLEX Various JavaScript XUL, CSS XUL Flash ActionScript none or ActionScript Macromedia Flash Any Java IDE Java Java Java Swing / SWT Tools Logic User Interface
  • 13. / UI TRENDS / LAYERS, LANGUAGES & TOOLS Various JavaScript HTML, XHTML CSS, XSL AJAX / DHTML Visual Studio C++ C++ Win32 / MFC Visual Studio C#, VB.NET, J# (any .NET) C#, VB.NET, J# (any .NET) .NET WinForms Visual Studio “Sparkle” / “Cider” C#, VB.NET (any .NET) XAML WPF (Avalon) Laszlo IDE plug-in JavaScript LZX OpenLaszlo FLEX Builder ActionScript 2.0 MXML, CSS FLEX Various JavaScript XUL, CSS XUL Flash ActionScript none or ActionScript Macromedia Flash Any Java IDE Java Java Java Swing / SWT Tools Logic User Interface
  • 14. / EXAMPLES / WEB / BLOCKBUSTER.COM
  • 15. / EXAMPLES / WEB / TYPICAL PROCESS (SIMPLE) CSS PHP Designer / Developer Images Photoshop Text Editor Web Site
  • 16. / EXAMPLES / WEB / TYPICAL PROCESS (COMPLEX) Designer Developer Visual Design (Comps) HTML Design Analyst Wire- frames Sitemap (IA) CSS Design Tech JAVA Photoshop Eclipse Visio / OmniGraffle Text Editor Web Site
  • 17. / EXAMPLES / WEB / WIREFRAME
  • 18. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side
  • 19. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side web browser application server
  • 20. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side ASP/ C# / Java / JSP / etc web browser application server
  • 21. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side <HTML> ASP/ C# / Java / JSP / etc web browser application server
  • 22. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side Style Layout Data ASP/ C# / Java / JSP / etc <HTML> web browser application server
  • 23. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side <HTML> CSS ASP/ C# / Java / JSP / etc web browser application server
  • 24. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side <HTML> Layout Data CSS Style ASP/ C# / Java / JSP / etc web browser application server
  • 25. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side <HTML> CSS ASP/ C# / Java / JSP / etc web browser application server
  • 26. / EXAMPLES / WEB / UI SEPARATION WITH CSS client-side server-side Style Layout ASP/ C# / Java / JSP / etc <HTML> CSS Data web browser application server
  • 27. / EXAMPLES / WEB / GENERIC CONTAINER HTML
  • 28. / EXAMPLES / WEB / DEMO
  • 29. / EXAMPLES / WEB / REVISED PROCESS Designer Developer Visual Design (Comps) Design Analyst Wire- frames Sitemap (IA) CSS Design Tech JAVA Photoshop Eclipse Visio / OmniGraffle Text Editor Web Site Design Tech Text Editor HTML
  • 30. / EXAMPLES / WPF
  • 31. / EXAMPLES / WPF / TYPICAL SOFTWARE PROCESS Architect Developer Functional Specification Marketing Marketing Requirements Document (MRD) C++ Code Visio / UML Word App Analyst Visual Studio Word Software Architecture
  • 32. / EXAMPLES / WPF / TYPICAL SOFTWARE PROCESS + DESIGN Architect Developer Functional Specification Marketing Marketing Requirements Document (MRD) C++ Code Visio / UML Word App Analyst Visual Studio Word Software Architecture Designer Photoshop UI Design
  • 33. / EXAMPLES / WPF / REDLINE DESIGN SPEC
  • 34. / EXAMPLES / WPF / UI SEPARATION WITH XAML Style Layout Form.cs Program.cs Logic Application
  • 35. / EXAMPLES / WPF / UI SEPARATION WITH XAML Style Layout Window.xaml Window.xaml.cs Logic Application
  • 36. / EXAMPLES / WPF / UI SEPARATION WITH XAML Style Window.xaml Window.xaml.cs Logic Application Styles.xaml Layout
  • 37. / EXAMPLES / WPF / DEMO
  • 38. / EXAMPLES / WPF / DEMO
  • 39. / EXAMPLES / WPF / DEMO
  • 40. / EXAMPLES / WPF / DEMO
  • 41. / EXAMPLES / WPF / REVISED SOFTWARE PROCESS Architect Functional Specification Marketing Marketing Requirements Document (MRD) Visio / UML Word App Analyst Word Software Architecture C# Designer “ Sparkle” Developer Visual Studio + “Cider” XAML
  • 43.
  • 44.
  • 46. Session Evaluations We value your feedback, so please submit an online evaluation for each session you attend! To make it worth your while, we pick one evaluation from each of the ten session timeslots. If we pick your eval, you will be eligible to win a Creative Zen MicroPhoto