Great WPF Applications #4: Otto

Although you may not have heard of them by name, Otto Group are a huge retail conglomerate with €9b of revenues in 2005/6; they own retail outlets like Crate and Barrel in the US as well as catalog companies like Grattan and Freemans in the UK and the eponymous OTTO in Germany.

As the second largest online retailer in the world, when OTTO decided they needed a fresh new retail experience, they wanted to set a benchmark for online shopping. The result was their next generation OTTO store application, built using WPF, WCF and CardSpace and available for download today from their website using ClickOnce technologies. I'm so impressed with what they've built: it's a really attractive experience that will undoubtedly result in increased sales and improved customer satisfaction.

The first time you load the application, there's a brief wait while it downloads the product catalog and all the image assets. Rather than making you sit and wait while it all comes down, they integrate a short training video into the download screen so that you're not twiddling your thumbs and you're ready to hit the ground running when it comes up. The main screen looks something like an animated wallboard: you can scroll back and forth to see different collections in the catalog. When you click on an item, it pops to the foreground along with a stack of related items. So far, so cool.

What makes this application really stand out from anything you could easily do on the web is that if you like a couple of products but want to see how they go together, you can drag them to a "mix and match" icon on the bottom of the screen, and then you can dress a model with the items and see whether they go together in ensemble. I think even my daughter is going to enjoy this - it's the online equivalent of "dress up Barbie", even if that's not quite what they intended.

It only takes a brief glimpse at the screenshots for this application to realize that its success comes from a cross-disciplinary team of developers, designers and retail specialists. In this new world, it's going to be increasingly important for developer teams to think from the start about design in all forms. You can read a great blog post from the designer behind the OTTO application, who talks about this in more detail.

Even though I don't buy a lot of women's clothing (!), I'm excited about the vision for the future that this application demonstrates. If you're in the retail sector, you should be looking at this application and figuring out how you build something similar so that you don't wind up the last company to give your customers a high-end retail experience.

I've got to close this post by crediting Jaime Rodriguez. He's been working with OTTO as the Microsoft liaison since the start of this application, and he is one of the most underrated guys I know in the community. Subscribe to his blog: he's a smart guy who thinks hard about the real technical challenges behind implementing WPF and WPF/E and has great real-world feedback. He's going to post a follow-up entry to this blog that talks in greater detail about the technical challenges and advantages of using WPF - I'll update this entry when it becomes available.

Click here to access the OTTO Windows Vista shopping experience.

Comments (20)

  1. Anonymous says:

    All these apps are cool, but they leave me a bit confused. I’ve been following WPF and XAML, but the majority of the applications I create don’t need bespoke UIs. I’m really confused as to whether WPF is only for doing this fancy stuff (and I can carry on living in the lands of Win32 and Windows Forms), or whether it’s supposed to be good for more dialogue layout and such. Microsoft have either done a really bad job of explaining how to choose between the various technologies, or they’ve done a really bad job of demonstrating how to use WPF as a better version of Windows Forms.

    The Windows SDK has lots of WPF examples. None of them are very high quality. About the only one that resembles a Windows application is WPF Notepad, but it has a lot of idiosyncrasies that stop it looking polished. I’m in the market for something a bit more like XUL: a concise XML language for  semi-data-driven UIs that’s a bit more structured than a pile of editor-generated C# code. XAML and WPF seem to provide that, except that it’s really not concise and doesn’t help me do simple native-looking things (and it’s a bit sluggish, although impressive for what it achieves particularly with regards to the over-the-top text features).

    Everyone is producing examples of how to create reflections of rotating buttons that have gradients, which is nice, but I’m over that now. I don’t want any reflections, rotations or gradients that aren’t added by the OS by default,  and I don’t want my software to look amateur either.

  2. Anonymous says:

    Credit where credit’s due: I’m one of the designers of the OTTO Store, but certainly not <em>the</em> designer of the OTTO Store. 🙂 Credit for the look goes without a doubt to Monika Oeschger, Creative Director in our company. I was sort of the liasion between the extreme developer world and the extreme designer world.

    And you’re definitely right to mention Jaime. He’s responsible for making our start in WPF a <em>running</em> start. Other than being an extremely likeable guy, Jaime impressed me by not only quite the technical genius, but also curious, open and completely non-judgemental when it came to design. There’s often a pretty big chasm between developers and designers (does it really have to be exactly <em>that</em> shade of blue? What difference does a couple of pixels make anyway?), but Jaime has clearly realised that if Vista’s going to really make some waves, it needs to not only function, but also offer the user a beautiful, thought-through and engaging experience.

    And as they say in Germany, danke für die Blumen! (Thanks for the flowers, i.e. compliment)

  3. Tim Sneath says:

    Oh, I also wanted to add that this is one of the first big Windows CardSpace implementations to go live. If you’ve not seen CardSpace, it provides a standards-based secure mechanism for the exchange of identity over the web, along with a managed implementation of that standard for Windows as part of .NET Framework 3.0. If you’re interested in finding out more about CardSpace, a good place to start is Vittorio’s blog here: – he worked with Otto on this implementation.

  4. Anonymous says:

    A couple of WPF bits that I missed. ITN (UK News) has a new Video Player for their News stories available…

  5. Anonymous says:

    If you want to see a contrasting online shopping experience to Otto , you could do worse than look at

  6. Anonymous says:

    If you are watching the Card-space, I’m sure you didn’t miss it: the Otto Store smart client application,

  7. Anonymous says:

    Nice demo of what WPF can do, however given the choose between shopping at a web site that uses simple standard HTML and a “rich” experience like this, I will always choose the simple web site.  I already know how to use a standard website, I would have to think to use this as it is different from what I am used to.

    In other words – If you want my money don’t make me think!

    However I may not be the sort of people they are aim at, as I consider the “shopping experience” to be a good reason not to go into most physical shops if I can avoid them.

  8. Anonymous says:

    Winter has finally set in with single digit temps and minus degrees wind chills but still no snow. WPF/Avalon

  9. Anonymous says:

    A showcase of what’s possible today using .NET 3.0 is the new OTTO Store that went live earlier this

  10. Anonymous says:

    Am I the only one that found this demo tediously slow?  I know I couldn’t read the German, but I was dragging clothes around and it crashed on me with some kind of message.  It looks great, but maybe I just don’t have the right kind of Cray to run this stuff.

  11. Anonymous says:

    I’m with James on this one, where does the WinForms guy go from here!

  12. Anonymous says:

    Känsliga personer varnas härmed för en låååång postning – men vill du veta mer om framtidens användargränssnitt

  13. Anonymous says:

    Under den här veckan har jag haft förmånen att få delta i TechReady, Microsofts interna motsvarighet

  14. Anonymous says:

    Frank has been blogging about Tim Sneath’s series on Great WPF Applications. Check em all out here .

  15. Anonymous says:

    the app look cool. It  will work for dumb teenagers and women who have nothing else to do. It took forever to download and run the thing. Looks like it is running an .exe ! How do I even close it. I can not understand german. I agree with James, this is an overkill example as far as most business applicatiosn are concerned.

  16. Anonymous says:

    Tried to install it, but seems it won´t work for me… 🙁

    Looks like it think I´m not running Vista ("Lieber OTTO-Kunde,

    um den OTTO-Store installieren zu können, benötigen Sie Windows Vista.")

    Running Vista, IE7 and got the 3.0 framework installed – what more do I need? (And no, I don´t speak German unfortunately)

    I know this isn´t a supportforum for Otto, but I just saw a demo and would like to show it for a couple of my collegues.

  17. Anonymous says:

    Hmmm… ignore my privious post please… 🙂

    Downloaded Fiddler to see exactly what requests I was sending to the site – and as it turns out, certain sites in our intranet are unable to handle IE7 and as such IT installs IE7 with User Agent to masqureade it as IE6…

    Problem solved. 😉

  18. Anonymous says:

    This is a nice demo, but it no longer installs and runs for me.  

    Several weeks ago it installed and ran fine on XP, but now it gives the same German error message as the previous post.  It apparently is saying: "You need Vista to run this".

    So I tried Vista.  It installed OK on Vista but when it’s starting

    it dies with an InvalidOperationException.  Exception Message: "Cannot set Visibility or call Show or ShowDialog after window has closed."

    Anyone know how to get it working?  It was quite impressive.

    Thanks, Alan

  19. Anonymous says:

    If you want to see a contrasting online shopping experience to Otto , you could do worse than look at

Skip to main content