Windows Presentation Foundation and User Experience … and Atlas  Paul Cross Richard Godfrey Microsoft

Agenda Aims Side-Aims Anti-Aims Suggest how we have got to ‘here’ Show where Microsoft are heading as a ‘Roadmap’ Side-Aims Provide examples and demos for illustration Anti-Aims Too much marketing  Show ‘how’ to use the technologies Dig into implementation depth

User Experience 'UX' Matters

http://www.artlebedev.com/ What is UX? VHS VCR PVR (Windows MCE)

The world we are in …

The 'Real World' Functionality traditionally comes first Little application development time for 'user experience' beyond prototypes Cost/Value justification breaks down? Developers are not designers! Except some Web developers? Tooling inadequate Flash? CSS?

Consumers and the Enterprise Consumer activity drives enterprise activity Windows Office XBox Live GPU Blogging Online Presence – Messenger, Yahoo, AOL, ICQ … …

Why does it matter now? It always mattered  Information Overload Real Business impact Faster Make business decisions faster on more data Cheaper Reduce costs Less training time (e.g. PoS operators) Reduce errors e.g. restricted UI, User self service Better Enhanced user/customer experience Data visualisation ‘Stickiness’ e.g. Making it more stylish, approachable

Is it a Client or a Server? Through the decades … White coats The 50s: Scheduling Time The 60s: Batch Processing The 70s: Timesharing & OLTP Empowering the user The 80s: PCs & Client-Server User self-service The 90s: Internet & Services Community The 00s: Users & Experiences? Observations Computing power moving to the ‘edge’ of the network E.g. CPU, GPU Mobile devices Move to user centricity BUT … Issues with deployment, manageability, security … Rhetorical Question: Is the Thin Client era a stop-gap?

Switch to Paul

Where are we now (or nearly)? 'SOA' in the Enterprise Thin client experience seen as lacking (AJAX) 'Web 2.0' and 'Mashups' in the consumer space Designers engaged in the software lifecycle Tooling directed at the User Experience domain Agile development practices

Richness vs. Complexity UX Richness Developer Productivity ASP.NET 2.0 (HTML) Windows Forms 2.0 DHTML Direct 3D v9 Availability: 1997 2005

Web Services & Offline/Online support Developer Productivity Tough to Deploy Heavy Footprint DLL Hell Network Dependency Limited User Experience Complex To Develop Rich User Experience Easy Change Management Responsive Ease of Deployment

AJAX/Atlas

AJAX is … Not a product Not a specification Not a standard Not a floor cleaning product Not the name of the son of Telamon of Salamis who fought against Troy Not an Amsterdam football team

AJAX is Asynchronous Javascript And XML A layer of abstraction between the browser and the web server Available in Internet Explorer since 1999 Improved UX through client-side interactions while data fetches are asynchronous According to some commentators, the future of all web development …

Typical Technologies for AJAX XHTML and CSS Document Object Model (DOM) XMLHttpRequest object JavaScript XML XSLT Etc.

Demo

Atlas Overview End-to-end application framework Enables building rich, interactive DHTML applications Component-oriented framework Imperative and declarative programming models Integrates with ASP.NET Extensible Application framework Custom script components, controls, behaviours Custom server controls Enables complex script-based applications Makes script development more approachable

Atlas Approach to Development Application development Simple inclusion of script-based functionality via script components, server controls Separation of UI and behaviour Component development Enables disciplined approach to scripting Framework for encapsulating data and logic Abstracts browser differences Provides building blocks for higher level development

Atlas Client Overview Collection of JavaScript (.js) files providing features for object-oriented development Browser compatibility layer Atlas core services Classes, namespaces, event handling, inheritance, data types and object serialisation Base class library String builders, debuggers, timers and tracing Networking layer Communication with web-based services and applications Management of the asynchronous remote method calls UI layer providing a number of Atlas client capabilities: Behaviours The Atlas declarative syntax UI components Data binding Controls layer that creates Atlas-specific controls Data-bound, scripted, drag and drop, auto-completion text box, ordinary form controls, data-bound listview control, navigation controls

Atlas Server Overview Includes components in ASP.NET, including web services and server controls Work in conjunction with Atlas client script libraries Leverages the following: Profiles service Membership service Roles service Personalisation services Globalisation and culture-specific services Atlas server controls that resemble ASP.NET server controls Emit Atlas client script Simplify the process of producing Atlas client script E.g. Buttons, labels, options, textboxes, check boxes, hyperlinks and validation controls Special Atlas controls that emit JavaScript to produce client behaviours HoverBehavior control, a ClickBehavior control, a Popup control and an AutocompleteBehavior control

Atlas Client Framework and Services Atlas Server Framework What is Atlas? HTML, Script, Atlas Markup Atlas Service Proxies Atlas-enabled ASP.NET Pages Web Services (ASMX or WCF) Atlas Client Script Library Controls, Components Script Core Base Class Library Component Model and UI Framework Browser Compatibility ASP.NET Atlas Server Extensions Atlas Server Controls App Services Bridge Web Services Bridge Atlas Client Application Services Local Store Browser Integration ASP.NET 2.0 Application Services Page Framework, Server Controls Atlas Client Framework and Services Atlas Server Framework

Windows Presentation Foundation

Windows Presentation Foundation Next generation framework for building smart clients That could only be built by very experienced graphic programmers previously Declarative (XAML) for designers Object-based for developers Available for Windows Vista, Windows XP and Windows Server 2003

Windows Vista Platform WinFX Data Communication Base Operating System Services Objects SQL XML WinFS … 'DLinq' (ADO.NET) 'XLinq' (System. XML) Standard Query Operators Language Integrated Query Identity and Access Services (AD-RMS, AD-STS, 'InfoCard') Collaboration Services (People Near Me, …) Windows Workflow Foundation (System.Workflow) Presentation ASP.NET Windows Forms Windows Presentation Foundation Composition Engine Visual System Elements Documents Desktop Window Manager Hardware Rendering Software UI Media Controls Designer Services App Application Controls Interop Hosting Application Services Page Server 'Atlas' Client Script Framework 'Atlas' Bridge (DB2, Oracle, Message Channel (TCP, Peer, Security, Reliability, …) Binding (WS-*, HTTP/XML, …) System.ServiceModel Windows Communication Foundation Web Services (HTTP, REST, XML-RPC, RSS, WS*, …) Protocols (Pipes, IPvX/Sec, UDP, TCP, SMTP, …) Contracts (XSL, XSD, WSDL, SDM,… ) Declarative Programming (XAML, Workflow, ASP.NET, …) Integration Transactions Storage Network Services Base Class Libraries Memory Manager Hosting Layer Code Execution Loader Security Serialization Lightweight Transaction Coordinator Kernel Transaction Manager Logging Service Kernel Hardware Abstraction Layer Process Security Reference Monitor LPC Facility Power Manager Config Manager Plug and Play Transacted NTFS Cache Universal Format Filter Engine TCP, UDP IPV4, IPV6 IPSEC QOS HTTP Listener Internet Connection Firewall Demand Activation and Protocol Health PNRP Native WiFi SIP TCP UDP IPC Network Class Library GDI/GDI+ Global Audio Direct 3D Graphics Graphics drivers DDI Input Drivers DirectX Graphics Mini port Redirectors SCSI/FC 802.3 802.11 .. Device Drivers Management (Event Logs, Tracing, Probes, Auto Update, Admin) IO Manager Application Deployment (Click-Once) Identity & System FAT 16/32 Distributed File System Virtual Shadow Copy Service File Replication Service Virtual Disk CLR

Windows Presentation Foundation (1) Full Trust or Web Browser App (.wba) Click-Once Deployment

Windows Presentation Foundation (2) Declarative XAML Tool-able Data Driven

Graphics Designer & Developer in Perfect Harmony 

Windows Presentation Foundation (3) Control Composition Unified API for UI, Documents, Media Rich Control Set

Windows Presentation Foundation (4) Rich Media Vector Raster Text 3D Video Scalable UI Animation Hardware Rendering & Composition

Windows Presentation Foundation (5) Readability Printing

What couldn’t be done easily before? 2-dimensional and 3-dimensional graphics Animation Vector-based graphics the capability to zoom without distorting the image Audio and video integration Fixed and flow format documents Easy data binding, styling, templates WYSIWYG & vector-based printing

Windows Presentation Foundation

Demo

'WPF/E' Web Architecture Browser Application / OS Content Package XAML Programming Model 'WPF/E' Runtime Plug-ins Platform Specific Hosting Model JavaScript C# / VB.NET Native API XML - Data Fonts Video/Audio Images Native 'WPF/E' API UI & Rendering Core Platform Abstraction Layer

Media Integration Layer 'WPF/E' Features Core Runtime Base Services Media Integration Layer Other Services XML/XAML Parser 2D Text Core Controls Accessibility Audio Video Container Controls Input and Eventing Imaging Animation Basic Layout Property System Composition Engine

Summary

Richness vs. Complexity ASP.NET 'Atlas' Approachable Windows Presentation Foundation Optimised Richness & Approachable UX Richness Developer Productivity ASP.NET 2.0 (HTML) Windows Forms 2.0 DHTML (AJAX) Direct 3D v10 Richness Direct 3D v9 Availability: 1997 2005 2006

What to use … and when? WPF Pros Atlas Pros Richest experience Offline capability ClickOnce deployment Text/Fonts Atlas Pros Platform reach Extends current web technology (HTML, CSS, etc.) Zero deployment WPF Cons Microsoft XP & Vista specific (for now) Client footprint required Tools lag Atlas Cons Learning curve (less with) Maintainability (less with) Requires Javascript on browser Restricted by Javascript and HTTP abilities Compatability? Tools lag

Platform Roadmap Now 2007 2006 H2 2006 H1 Expression Interactive Designer VS 'Orcas' (inc Atlas) 2006 H2 Vista Release (inc WPF) 2006 H1 WPF Beta2 Now WPF Feb CTP Atlas Mar CTP & Go Live Licence

Next Session – WRK10104 Workshop A look at Atlas and WPF in action Q&A & Debate In Conwy 2 Room