Pete Brown - AIS - Real World Siverlight Dev Camp DC

Pete Brown Applied Information Sciences, Inc. www.AppliedIS.com Personal Site: www.irritatedVowel.com

Balloons

Carbon Calculator Project
May to July 2007
Started on 1.0, moved to 1.1 early June
Jointly sponsored by Microsoft and AIS
Client: Conservation International
AIS Staff:
Pete Brown – PM and Silverlight code and User Experience
Steve Suing – Virtual Earth, SharePoint, and some Silverlight rough-ins
Both: zero prior Silverlight / RIA, or SharePoint experience

Carbon Calculator CO 2 CO 2

HTML
JavaScript
All hard-coded
Difficult to maintain
Works well, but not engaging
Original Carbon Calculator

Direction and Constraints
Deliver on or before 7/7/7 for the LiveEarth event
Use original calculator as starting point and keep simple
Use existing data and algorithms
Rehost / rewrite ok
Integrate Virtual Earth, Images and Video to show projects
Use MOSS 2007 lists and libraries for data store

Direction and Constraints
Keep Conservation International interaction to a minimum
Going through entire site redesign for multiple domains
Keep Silverlight Team interaction to a minimum
Preparing Silverlight 1.0 release
Use only public bits and information
Keep download size small – no bitmaps
Direction later retracted right before delivery

Our Version
Silverlight 1.1
Virtual Earth
Media
MOSS 2007

Carbon Calculator

SharePoint Integration Client Silverlight Web Site MOSS Site JSON-Enabled ASMX Silverlight 1.1 Calculator Client Impersonation Configuration MOSS Native Web Services Security, DoS Protection MOSS Lists Web Service Proxy Domain Objects (Populated with LINQ) Forms Auth Handler Document Libraries List Access Functions Host Page

Virtual Earth Integration
JavaScript integration layer
Translate points from Virtual Earth into Silverlight
Draw all vectors in Silverlight
Handle all interaction via Silverlight
Lots of examples now available

UserControls as Screens
One UserControl per screen
Wizard page
Full Screen
One XAML file per screen
Easily maintained in Blend
Provides a familiar window-like model
Optimized for bunch-of-boxes UI, but could extend to more creative UX
Named storyboards for Show and Hide
Easier to work than dynamic screens using CreateFromXaml()
Separate classes / code-behind

UserControls as Screens Main Page Page.xaml UserControl Screens FooScreen.xaml Shown/Hidden as-needed UI elements ListBox, Checkbox etc. Tip: Put semi-transparent full-screen canvas behind usercontrol for modal-like behavior

Screens in the Carbon Calculator FooPage.xaml Known Animations ControlPageBase + void Show() + void Hide() - void LogPageToHitbox() ControlBase # T FindByName<T>() FooPage … < AnimateShow /> < AnimateHide /> HitBox via Javascript Callback

UserControls As Screens

Designer – Developer Workflow
Fairly clean hand-off between designer and developer
Not as good as WPF - Yet
Example 1
Steve wrote video player functionality, left it ugly
Pete styled up the UI without affecting any code
Example 2
Pete created wireframe for Virtual Earth viewer and left it ugly
Steve worked with wireframe
Pete reworked UI without touching any code
Decide on a contract
Control names, types

What Worked Well
Basic XAML-based design
LINQ
Tools, despite being alpha/beta
Control Model
Designer / Developer Workflow
But not as well as in WPF
JSON Web Service Integration

Alpha Challenges
No in-box controls - yet
Created everything from buttons to drop-down lists
No window / screen model
Created based on a pattern I used in VB6
No concept of focus or tabbing
Poor animation performance / High CPU load
Fixed in August and September refreshes
Error handling / reporting
Only slightly better than the old Method ‘~’ of Object ‘~’ failed .

Common Stumbling Blocks
Only communicate with same server, domain, port
http://www.AppliedIS.com is not the same as http://AppliedIS.com or http://www.AppliedIS.com:8080
The most common question on the silverlight.net forums
Default file names (foo.html.js) choke AVG antivirus
Can’t click through to HTML page
Silverlight doesn’t pass clicks to underlying page
Popup Blockers don’t understand Silverlight yet
Any HTML page you pop up gets blocked
If you accept, IE7 reloads page, trashing your app’s state
Must store state at server or in isolated storage
Test Your Encoded Media Files

Changes We’d Make
Better animations now that performance has improved
Used to take 50-75% CPU for basic animation
Richer Graphics : Get outside the box/screen model
Client likes current version, but the RIA is lacking in “R” due to time / alpha / experience constraints
Still feels like a Windows application in many ways
Will be easier when layout panels included

Resources and Links
Silverlight Community Site
www.silverlight.net
Conservation International Carbon Calculator
www.biodiversityhotspots.org/CarbonCalculator/Pages/CarbonCalculator.aspx
Applied Information Sciences, Inc
www.AppliedIS.com
All links and demos available from my blog
www.irritatedVowel.com

Pete Brown - AIS - Real World Siverlight Dev Camp DC

by Psychlist1972 on Nov 04, 2007

Accessibility

Categories

Tags

Upload Details

Usage Rights

2 Embeds 3

Statistics

Pete Brown - AIS - Real World Siverlight Dev Camp DC — Presentation Transcript

http://www.socialeyes.com:8010	2
http://www.socialeyes.com:5010	1