Rich User Experience choices for a Line of Business application

Context

SmartPoint are innovators in the CRM space, and have developed an application which is able to detect user activity in a variety of applications and send specific sets of related data (from databases, systems such as MOSS and others) back to the user. This is all done through ‘contextual intelligence’ – which means that the data presented is tailored based on what the user is currently doing, their role, and what they already have on screen.

The current iteration of SmartPoint is a simple HTML page residing within a web-browser docked to the side of the screen, and SmartPoint were looking forwards to the cutting edge of interactive user experiences for their next iteration, to provide a fuller and richer experience to their users.

 

Requirements/Problems

· Platform

o SmartPoint is generally deployed on Windows XP plus, but there are some machines still on Windows 2000 or Windows 98. Some machines also access applications through TS and Citrix. The product is unlikely to be installed on machines with administrative privileges, due to the nature of the environments into which it is sold.

· Hardware

o SmartPoint is often deployed on lower end hardware, which may not have high graphical capabilities.

· Usability

o SmartPoint will ideally be able to render itself at any point *around* an existing application (typically a CRM system) in order to be able to only pop up the most relevant information at the exact point where the user is working. It should provide a rich, interactive user experience, whilst still maintaining the feel of a ‘line of business’ application. This new iteration should improve performance and scalability, which is a potential issue with some of the current javascript code

 

Discussion

Demos

Firstly, we wanted to give the developers at SmartPoint a flavour of how Silverlight, and WPF, can look in a ‘Line of Business’ scenario. We had a few demos to show them, including the Woodgrove Bank and NHS Common User Interface, which helped to give a flavour both of the power of WPF/Silverlight, and also how concepts within the demos could be used to structure their product.

clip_image002

The ‘care pathways’ bar rises and falls as needed within the application, always keeping the doctor aware of the essentials, but allowing him to drill down into details with ease whilst preserving screen real estate.

clip_image004

In particular, SmartPoint saw the ‘Care Pathways’ from the NHS (above) and some other great demos that we were able to show them that aren’t yet released (we’ll mention them on our blog when they are!) as useful ways of displaying some of their complex data. Such demos from Microsoft are always nice for a ‘Wow’ factor, but can also be a great way to get some ideas about building your product. I find the Litware demo particularly useful when talking about new architectures, for example.

Data Access

We later discussed the roles of these high-end graphical technologies in an ISV’s ‘real world’ scenario, how they interact with databases and webservices – and most importantly for SmartPoint, how they could interact with the client machine, and the various data stores that SmartPoint would be querying.

The databinding in WPF is comparable to the power developers have already come to love from WinForms, and can be used to build robust, easily maintainable and highly performant applications – the London Underground (scroll to 45mins in) visualiser for example. Using .NET 3.5 behind WPF too, we can start incorporating LINQ into the equation (against SQL or Entities) and building up a really slick data access strategy with very little effort.

Silverlight has a subset of this, but is still aeons ahead of the javascript solutions that were currently in place, and still promised to offer performance gains in the data access arena. Of particular relief to the SmartPoint developers was the fact that Silverlight will not use the browser’s thread for processing, and thereby delay UI loading if one of the many data sources they query were to take some time to respond.

WPF comes in many forms, and I’ll discuss deployment later on, but a point was brought up during this discussion that only a fully installed WPF application could have ‘full access’ to the client machine. Silverlight and WPF XBaps are limited greatly by the internet sandbox and a ClickOnce WPF project also has certain restrictions, which I’ll mention later on.

Design

Following this discussion of the back-end story of Silverlight and WPF, it seemed logical to move on to the front end. This is a well covered topic already elsewhere on the web, but it’s worth noting the full richness available through WPF can be used to build some simply stunning applications, taking advantage of 3D and complex transforms – but that these will be automagically scaled down on lower-spec machines, to still provide a flavour of the full UI, but without the resource demands.

clip_image006

The British Library’s ‘Turning The Pages’ application is a great example of the power of WPF animations.

As other ISVs have noticed, the lack of a full set of controls in Silverlight 2.0 could be a potential issue – but plenty of ISVs are developing robust, large scale applications in Silverlight 2.0 already, and they find that the ability to customise the default controls, along with the appearance of user-created controls and third-party commercial controls can often be enough to satisfy any needs.

I took this opportunity to offer the advice that if SmartPoint were planning to deviate from the ‘norm’ laid out in design through the constraints of technologies of Winforms, and to take advantage of these infinitely malleable XAML-based frameworks, then they should seriously consider hiring in a dedicated designer for their interfaces.

Much like when multi-font documents and the dreaded <marquee> tag arrived, the plethora of choices given by WPF and Silverlight can be potentially dangerous to a developer who’s just putting together somewhere to surface his results. I’ve seen some awful designs put together by developers demonstrating the developer side of these technologies, and I’d hate to see anything similar going into production and actually being sold. So please, get someone with digi-artistic talent (not myself certainly!) in if you’re planning on doing anything fancy with WPF or Silverlight.

clip_image008

Don’t laugh too much, we all made web design mistakes in the 90’s...

The great advantage of WPF/Silverlight from a design point of view is that a designer working in Expression can generate not just images, but actual workable XAML code which developers can then program against. Gone are the days of trying to hack together something that ‘kind of looks like’ the .psd or .jpg which was emailed across from a design agency.

Deployment

An oft understated offering of .NET applications is that of ClickOnce deployment, which allows the distribution of desktop applications onto machines without the need for administrative privileges – a windfall for the SmartPoint chaps who find it hard to get such permissions in the environments they typically deploy to.

Even Silverlight currently requires one admin install – that of the browser plugin, although this install is typically a much easier ‘sell’ to the IT departments ISVs deal with, as it comes straight from Microsoft.

ClickOnce does have its limitations though, in that it’s unable to interact with other currently running applications on the desktop – something SmartPoint would ideally be able to do from the client side, and something I see many ISV products that wish to tie in with existing offerings from other companies also hoping to do. As such, this may not always be a perfect solution.

Decision

Once the talking was over, the whiteboards were rubbed clean and the coffee cups stacked high upon the table, SmartPoint had a pretty clear idea of where their future lay. “We came here fully expecting to walk away ready to start using Silverlight 2.0” said Smartpoint’s Product Marketing Director, “but now we’re sure WPF is going to be the right route for us, which is great news”.

The power of Silverlight was certainly impressive, but with the fact that SmartPoint could almost guarantee they’d be deploying to a Windows environment, the need for Silverlight’s cross-platform abilities was not needed. Silverlight would also be constrained within a web browser, which unfortunately conflicted with SmartPoint’s desire to have their application ‘pop out anywhere’, without obscuring the main part of the user’s screen real estate.

The graphical richness of WPF, combined with its increased abilities to deal with multiple complex data sources with relative ease was what won the day, and is where SmartPoint see the next iteration of their product. I’ll be catching up with them later to see how everything turned out – but for now, good luck guys, and happy devving!

Technical Comparison

Silverlight vs WPF vs WPF ClickOnce vs WPF XBap

This article has talked a lot about the differences between the various UI technologies available from Microsoft, and I’ve aimed to keep it on a level where technical decision makers and architects can gain the most value. However, I realise that all true geeks will want to know exactly what’s what, and it will hopefully be useful to have this quick reference guide to navigate through the choices.

 

  Silverlight WPF XBap WPF Clickonce WPF desktop
Deployment Admin install of Silverlight browser plugin Admin install of .NET 3.0 Admin install of .NET 3.0 Admin install of .NET 3.0.
Admin install of application
Platform Apple Mac, Microsoft Windows, some Linux support, Firefox, Safari, IE...and on. Windows XP SP2 & above, Internet Explorer or Firefox Windows XP SP2 and above, Internet Explorer, Firefox – or anywhere you can host an installer Windows XP SP2, anywhere you can host an installer
Permissions Browser sandbox* Browser sandbox* Slightly less permissions than a full install. See this comparison table for more Full application permissions as requested
Graphics Less graphical capability than WPF (no real 3D for example) Full 3D support and next-generation graphics Full 3D support and next-generation graphics Full 3D support and next-generation graphics
Tools Expression and Visual Studio Expression and Visual Studio Expression and Visual Studio Expression and Visual Studio

 

* With a few extras, but don’t count on having any more than browser permissions.