• Like
slides from my talk
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

slides from my talk

  • 454 views
Published

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
454
On SlideShare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
1
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • User experience is more than “looks”. User experience represents the overall interaction process of the user with an object. This interaction provides the user with an added value benefit. In this case the benefit that both tools offer is “opening a can”. However it is evident that the can opener will provide the user with a better overall user experience on obtaining the benefit. It is more secure, easier to use and can achieve the benefit faster than the knife. Porsche Car, Mini Cooper,
  • User experience is more than “looks”. User experience represents the overall interaction process of the user with an object. This interaction provides the user with an added value benefit. In this case the benefit that both tools offer is “opening a can”. However it is evident that the can opener will provide the user with a better overall user experience on obtaining the benefit. It is more secure, easier to use and can achieve the benefit faster than the knife. Porsche Car, Mini Cooper,
  • Ease of Use Learn ability Performance Reliability Security Optimized form factors Legibility / Readability Relevance / Contextualization Richness Graphics & Media Data Visualization Higher Fidelity Information Globalization Accessibility Hardware & Printing Integration
  • Look Great - R Flow - R Suggest - E Immediate User Response - R Predict and cache - E Share - E Preserve State - E
  • Flow Suggest Immediate User Response Predict and cache Share Preserve State
  • After watching this great examples of what WPF can deliver let’s talk about how Microsoft is unlocking Developer and Designer collaboration and is empowering them to create successful UX software applications. 1) Traditionally designers would “mockup” the graphic design for a software application. Then by any means possible designers would deliver this “looks” to the developer… they would use JPG images, PNGs, PSDs or even Powerpoint presentations to express the designer intention. Then the developer would receive this “static images” and would try to convert that into reality. If the designer created some “non standard” controls, the developer was forced to code in GDI+ or other complex technologies to create the control raising the time and budget to such level that it was simply better to take the decision of making the UI more “standard”. The developer trying to recreate the idea of the designer would deliver something like what is shown on the right side of the screen. As you can see it represents only a tiny bit of the original vision. 2) In order to enable the collaboration between developers and designers, Microsoft has created XAML. XAML is the format which integrates the development process and is the way for both developers and designers to access the functionalities of WPF. As you can see we have no middle man anymore. XAML is generated by the designer, XAML is consumed by the developer. Further more, the workflow is now two-way meaning that the development process can also start from the developer side who creates XAML and then delivers this XAML to the designer which can take it and style it or completely redesign its appearance. 3) As a brief sample this are the tools that enable this kind of process: On the designer side we have Expression and on the Developer side we have Visual Studio.
  • And this are our Expression products. Expression Graphic Designer will help designers create vector based or bitmap based graphics, both using the same tool and in an integrated environment. Expression Interactive Designer will help designers create XAML based content and user interfaces that enjoy the best of the Windows Presentation Foundation features. Expression Web Designer will help designers create standard based websites that incorporate the best of wide adopted technologies like CSS, XHTML, XML and XSLT, and that also provides designers easy access to the robust ASP.NET technology.

Transcript

  • 1. Creating Rich User Experiences Brad Abrams Group Program Manager http:// blogs.msdn.com /BradA Arturo Toledo Product Manager
  • 2. What is user experience?
  • 3. What is user experience? Coffee? Entertainment? Consumer Goods? Windows Vista Office 2007
  • 4. ROI for UX Ease of Use Richness Success Productivity Retention Comprehension Conversion Satisfaction Excitement Repeat Use Return-on-Investment
  • 5. UX Principles for Ease of Use Share Suggest Predict Preserve
  • 6. UX Principles for Richness Look Great Immediate Response Flow
  • 7. Windows Live Demo
  • 8. ASP.NET “Atlas”
    • A framework for building next generation, cross-platform, browsing experiences
      • Ubiquitous, cross-platform, browser support
      • Most-productive framework for building AJAX-enabled web applications
      • Rich tool support for designer and developer workflow
      • No cost, free tool support, easy to use
  • 9. ASP.NET “Atlas” Web Server IE Firefox Safari Browser Clients Atlas Client JavaScript Libraries AtlasUIGlitz.js AtlasGadgets.js AtlasFX.js AtlasCompat.js AtlasRuntime.js Apache & PHP ColdFusion IIS & ASP.NET JSON Bridge Support Membership & Personalization Support ASP.NET Server Control Integration
  • 10. Unifying the Designer Developer Process Designer Emotional Connection Look, behavior, data visualization, usability, brand impact Developer Functional Capabilities Deployment, function, data connection and integrity, IT process, security JScript C# VB.NET Paper JPG / TIFF MOV / WMV PSD PPT XHTML CSS XSLT
  • 11. Microsoft Visual Web Developer Express Edition
  • 12. Expression Web Designer The DiceDepot Demo Arturo Toledo Product Manager
  • 13.  
  • 14. Atlas The DiceDepot Demo
  • 15. http://atlas.asp.net/atlastoolkit
  • 16. Squeet.com
  • 17. “ Atlas” has enabled Squeet users to have a rich user experience …You can’t ask for a more powerful and easy-to-use API. Hamed Shojaee, President, Axosoft, LLC Squeet.com
  • 18. www.TitleZ.com
  • 19. “ Considering how time-consuming traditional AJAX can be to implement, ‘Atlas’ seems almost like magic!” Arthur Wait, Dev Manager, TitleZ www.TitleZ.com
  • 20. http://blogs.msdn.com/brada/archive/2006/05/06/AtlasControlVendors.aspx
  • 21. Atlas
  • 22. But that is not all....
  • 23. Xaml
  • 24. New York Times Reader Demo Windows Presentation Foundation
  • 25. Demo Xaml in DiceDepot “ Windows Presentation Foundation Everywhere”
  • 26. How Do I Get Started?
    • Atlas Community Technology Preview
      • Install the FREE Visual Web Developer 2005
      • Go Live CTP – build live sites with Atlas today!
    • Atlas community site: http://atlas.asp.net
      • Tutorials, videos, samples, forums, resources
    • Expression Designer
      • Download the preview
      • http://www.microsoft.com/products/expression
    • Learn more about Xaml
      • http://netfx3.com
    • We’d love your feedback!
      • [email_address]
      • http:// blogs.msdn.com/brada
  • 27. © 2006 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary. Atlas: Your code. Our Passion.