Upload
josh-holmes
View
5.404
Download
1
Embed Size (px)
DESCRIPTION
This is the deck that I used in my European Silverlight Tour in Spain, Switzerland, Denmark, Sweden, Bengium, Netherlands and Ireland. It\'s about architecting Rich Internet Applications with Silverlight 2.0.
Citation preview
Architecting
RIAwith
Contact
Josh HolmesUX Architect [email protected]
What is
by Kushal Das
Is it…Rural Inoculation Association?Rare Isotope Accelerator?Royal Institute of ActingRampantly Inept Alien?Royally Idiotic Annoyance?Really Inane Acronym?Rich Internet Application?
What is a Rich Internet Application?
RIA for me is all about expanding the experience for the user. Those "gray beards" amongst us remember the old days of just being happy seeing plain, static text show up in the browser. We've come a long way since then. While dynamic web sites have pushed us way beyond the simple pages of the old days, RIA is helping us now provide the same level of dynamic interaction on the client side as well. I think this is wonderful as it improves the entire process (server and client)!
While we have a great opportunity here to help users, the challenge is to not actually make things more difficult. Like any new feature, the web is rife with examples of poorly designed and hard to use applications. It is not enough to learn how to make HTTP requests and change content dynamically, but rather how to do it well in ways that help the user and not scare them off.
Raymond Camdenhttp://www.insideria.com/2008/01/what-is-ria-
1.html
But the term still begs the question: Rich in what sense? Responsiveness, immediacy, convenience? production values, chrome, animation?
http://www.insideria.com/2008/01/what-is-ria-1.html
Christian Crumlish
Rich Internet applications (RIA) are web applications that have the features and functionality of traditional desktop applications. RIAs typically transfer the processing necessary for the user interface to the web client but keep the bulk of the data (i.e., maintaining the state of the program, the data, etc.) back on the application server.
RIAs typically:•run in a web browser, or do not require software installation•run locally in a secure environment called a sandbox
http://en.wikipedia.org/wiki/Rich_Internet_application
Back Button and Refresh Visual VocabularyState management
Browser Sandbox Business Logic in UI
Component Level Logic
Animation
new for Desktop Developers
new for Web Developer
What’s different with RIA?
Limited Runtime
Service Orientation
Non-text based layoutHype
Ubiquity Richness Next Generation
SharePoint ASP.NET+AJAX Gadgets Silverlight Infopath OBA Winforms WPF XNA
Ubiquity Richness Next Generation
cross-browser, cross-platform, cross-device
for building and delivering the next generation of
.NET basedmedia experiences and rich interactive applications
for the Web
Legend
V2Legend
V1.0
CLR Execution Engine
Framework
HTML DOMIntegration
XAML
Networking
JSONREST POXRSS
DataLIN QXLINQ
DLRRubyPython
WPFExtensible
ControlsBCL
Generics Collections
InputsKeyboard
Mouse InkMedia
VC1 WMA MP3
Browser Host
IntegratedNetworking
Stack
Installer
ApplicationServices
MS AJAXLibrary
UI Core
Vector TextAnimation
Images
DRM
MediaControls
Layout Editing
Whether you are designing rich standards-based websites, ultimate experiences on the desktop, or managing digital assets and content, Expression professional design tools give you the flexibility and freedom to bring your vision to reality.
The professional
Webdesign tool
The professional Interactive design tool
The professional
Media Encoding tool
The professionalAsset
Managementtool
2
+ Silverlight tools for Visual Studio
Usable Useful
Adaptive
Reliable Cost-effective
Desirable
User NeedsInteraction DesignInformation DesignVisual Design
Experiences that create value!
++
+
Taliesin West: Drafting Studio
MVP Pattern View is more loosely
coupled to the model Easier to unit test Usually view to
presenter map one to one
Complex views may have multi presenters
MVC Pattern Controller are
based on behaviors and can be shared across views
Can be responsible for determining which view to display (Front Controller Pattern)
• Uses tiled image pyramids
• The overhead of pyramids is 33%:
• Preprocessing tool breaks image into 256 x 256 tiles
• Then generates pyramids of tiles at lower resolutions
• When the image is displayed on the client the lowest resolution tiles are shown first
• Then as the higher quality tiles are downloaded, they are smoothly blended in
• When the image is displayed on the client the lowest resolution tiles are shown first
• Then as the higher quality tiles are downloaded, they are smoothly blended in
• When the image is displayed on the client the lowest resolution tiles are shown first
• Then as the higher quality tiles are downloaded, they are smoothly blended in
..but don’t forget the power users
70 20 10
with usability
• Cookies are on a domain level• bar.com cannot access foo.com cookies…• Same domain - http://foo.com is different
than http://bar.foo.com or http://www.foo.com • Same protocol - http://foo.com is different
than https://foo.com • Same port - http://foo.com is
different than http://foo.com:8080
• foo.com should feel securestoring user data in cookies
• Prevent cross-site forgery• Exploits a sites trust for a user
• “Private” services (for your own app)• DO use browser-based authentication • Cookies, HTTP Auth, etc. • DO NOT enable public access via cross-domain policy file
• “Public” services (for 3rd-party apps)• DO NOT use browser-based authentication • DO publish cross-domain policy files • DO use “cross-domain-safe” authentication • E.g. URL signatures
• DO separate public services in their own domain• E.g. api.flickr.com vs. www.flickr.com
1.0 minimal Accessibility support We only provide some root “alt” information No focus and keyboard support
2.0 Accessibility greatly improved Full keyboard support Decorate XAML UI elements with Accessibility info Add accessibility to custom controls Accessibility reader support (AT) Accessibility tree exposition for UIA
Note - UIA on Windows, OS X does not support accessible plug-ins
by Caution Mike
private void Application_Startup(object sender, StartupEventArgs e){string startPageParameter = "/StartPage"; if (!e.InitParams.ContainsKey(startPageParameter)) { this.RootVisual = new DefaultStartPage(); } else { switch (e.InitParams[startPageParameter]) { case "DefaultStartPage": this.RootVisual = new DefaultStartPage(); break; case "NonDefaultStartPage": this.RootVisual = new NonDefaultStartPage(); break; default: throw new Exception(
"/StartPage must be 'DefaultStartPage' or 'NonDefaultStartPage'."); } }}
by billaday
by joeltelling
by mikeyexists
Who is using Silverlight now?
France Internet Marketing
Japan Great UX
Rich Internet Applications are meant to enhance user experience
Architecture of the client matters Use good development practices Leverage the framework Build for the user Don’t get religious
Take-aways
http://silverlight.net/getstarted http://www.joshholmes.com
Take the Next Step
Architecting
RIAwith
Contact
Josh HolmesUX Architect [email protected]