IMG - big company, worst website ever

IMG eCommerce is a part of IMG, "the world's premier and most diversified sports, entertainment and media company"... too bad all that money can't do any better than produce a product like clubsONLINE, the worse website ever.

Think I'm exaggerating? Here are some screenshots from their 'online payment wizard'...

Let's start with a pretty simple form... it's not just the layout that is screwed up... how about allowing the 'Enter' key to submit the form (maybe a visual indicator on the button too); and what does that red diamond mean?


Ever heard of radiobuttons; even a DDLB would do. Is capitalization really important?


Hmmm, the "wizard"-type UI normally guides us through the steps. How about a hint on which button you'd like pressed?


Saving the best until "last" - you've GOT to be kidding. No, seriously, two buttons [Submit Payment] and [Payment]? Is one of these really meant to be 'cancel' or 'back'?


I 'transact' quite a bit on the web - and this is the first time since about 1994 that I can recall a payment process quite so unwieldy!

Loose Xaml (WPF and data binding)

Inspired by a no-longer-working (?) demo of Avalon Xaml (from 2004/05) by Joe Marini, I've put together this Loose Xaml sample blog reader with an RSS.XML feed from this blog.

It works in a browser, if you download the files (Xaml & rss) and run locally, or just check the screenshot:


The code is only 43 lines of markup (with breaks for readability!) - no C# or VB in sight.

I think exercises like this serve two purposes:

Firstly, helps to understand the databinding concepts in WPF

  <Canvas.Resources>
    <XmlDataProvider x:Key="NewsData" Source="rss.xml" XPath="rss/channel" />
  </Canvas.Resources>
  <Canvas.DataContext>
    <Binding Source="NewsData" XPath="rss/channel" />
  </Canvas.DataContext>

also

Text="{Binding Source={StaticResource NewsData},XPath=description}"

and

    <StackPanel Margin="5" Width="500"
                DataContext="{Binding ElementName=NewsList,Path=SelectedItem}">
      <TextBlock DockPanel.Dock="Top"  Text="Article Description:"/>
      <TextBlock Margin="10" TextWrapping="Wrap"  Name="SelectedItemDetails"
             Text="{Binding XPath=description}" />
    </StackPanel>

Secondly, helps structure your thinking around a UI that sits atop 'data services'
Quite a lot can be accomplished with Xaml markup - I think it would be interesting to see just how complex an 'application' could be created in a single Xaml file, using only databinding (and whatever server-side services you needed). WCF/REST could play a role (Syndication services... where's that link?).

The sandbox that loose Xaml sits in does present some problems... you can only load files from the origin, so no referencing RSS feeds from other servers. A middle-man pass-through (or other side-step) could get around that, however. It would seem trivial to create a fairly neat Gmail (or other service) reader; basically anything that publishes RSS (or any Xml, really). What is not clear to me just yet is whether it would be do-able to write a complete mail client, for example, following the same principles...


p.s. It's interesting to see how the databinding syntax changed, from "*Bind(XPath=author)" to "{Binding XPath=description}". Notice also how
TextContent → Text
XmlDataSource → XmlDataProvider
ID → Name
FlowPanel → FlowDocument (?)
Text → TextBlock
I think it's kinda cool to see the tools evolve like that - same now with Silverlight...

UPDATE: If you are wanting to use a datasource from ASMX or SVC, this post on XmlNamespaceManager will be useful. Once you start adding namespaces, the SelectedItem method I've used will break, and you'll want to read this post explaining the intricacies of {Binding} to Xml and the selected item.