Website

Believe it or not, it’s almost 2010

Laurent Bugnion — Wed, 30 Dec 2009 14:49:57 GMT

This year has been a pretty amazing year. A few weeks ago, I was writing about my first year at IdentityMine. A little more than one year ago I was closing the Siemens book (after around 13 years of working into Building Automation, but always from a software engineer perspective) and started the IdentityMine chapter of my life :). As I mention in the post in question, this first year was a very interesting and also challenging year. Interesting because I got to work with some of the best creative people and developers in the world. It’s always such a pleasure when I introduce myself to someone by saying I work at IdentityMine and to see a look of recognition on their face. This firm rocks, and I love being part of it. Challenging, because being the only European employee can be tough at times, even though the team has been amazing in making me a part of the family. To mitigate the distance, technical mediums like Twitter and Facebook, MSN and an IP phone have been super helpful. Of course nothing replaces the face-to-face contact, and my regular trips to Seattle (which will continue in 2010, I will be in Seattle again in February) make wonders to reconnect and continue the relationship. Surprisingly actually, the distance has not been as tough as I thought it might be. Of course it might not be OK for everyone to work this way, but it has been OK for me.

In the past year, I worked on multiple projects, in multiple roles

During presales, talking the the clients, identifying their needs, coming up with preliminary technical evaluations. Super interesting especially when you deal with the latest technology to do stuff that has never been done before.
Helping out for development tasks, working with a stellar team of developers and learning tons of new stuff in the process.
(my main role) Working as an integrator on various Silverlight and WPF projects. The integrator is the “missing link” between designers and developers. I take the inputs from designers and information architects (wireframes, comps) and extract the design assets to integrate them in the application. This is a great role, because you are the one who puts the final touch in the user experience, and it requires a very good knowledge of WPF, Silverlight and XAML, so it is yet another area where I have been learning tons of new things.
Consulting work, such as training clients’ teams, guiding them during the projects to make the best out of the technology, especially when designers are involved. This is a relatively new process, to have designers so involved into the application’s development, and I am lucky to have started working with designers very early on production projects. It is great to look back at this experience, analyze it, and then pass it back to clients and the community.
Talking at conferences, writing on my blog, interacting with the community and carrying proudly the name IdentityMine in front of people. I love to show what we do, and teach what I learned. I find that teaching and talking about technology is the best way to learn even more, and I love this. The highlight was of course talking at MIX09 (I had a session and took part to a half day workshop too), but all the other talks in various places in the US and in Europe were a fantastic time too.

Some of these tasks involved a lot of travelling, and it was a great year for my passport. Of all the trips, the ones I loved most were the long stay in Seattle in July, which was a great occasion to reconnect with many friends, make new ones, and then have my family join me for a vacation between Seattle, Victoria and Vancouver and then my visit to Macau and Hang Zhou in the summer, my first stay in both places, and I loved it. Of course the yearly pilgrimage to Las Vegas earlier in the year and the shorter trips to Belgium, Germany, Italy were all great times.

Private projects

I also had a few private projects going on in 2009, and had very exciting results. I published my MVVM Light Toolkit, a set of libraries and tools to make MVVM application development easier. It has encountered a great success so far, with hundreds of download (on Codeplex and on my website) and many, many interesting requests, discussions, etc. I am really excited about what is happening there, and will continue to work on it in 2010.

Of course my blog has been keeping me busy too, and I loved to wrote a few in-depth articles about Silverlight, WPF, MVVM and other topics. I saw a constant progression of subscribers this year, which is of course a great feeling, but also made me feel very humble and eager to produce quality articles.

The last big project is also one that is taking a lot of time, which is why the two other projects I mentioned here are maybe going to slow down a little in the beginning of 2010: I started working on Silverlight 4 Unleashed, the sequel to my first book Silverlight 2 Unleashed. This is a huge job, and I hesitated a lot before accepting to write it. I am now in the process of writing, and while it is really something I like to do, it is unavoidable that some things are going to suffer a little from this extra activity. So to the users of MVVM Light, and to readers of my blog, I ask you to be patient and don’t worry, normal activity will resume eventually ;)

And 2010?

2010 is going to be a great year too. My first big trip of the year is going to be to Seattle, again an occasion to meet friends from IdentityMine and from the community. Can’t wait for this trip. The next one should be to MIX10 in Vegas, and those who know me know how much I love this conference, and this year should be no exception. I am also scheduled to talk in a couple of conferences in Europe, more about this later on my blog.

It is a fantastic privilege to be involved in such a wonderful community. To all of you who make this possible, thank you thousand times. You did truly change my life. I cannot wait to see what the future has in store for us, and I am sure 2010 will be an amazing time yet again.

Happy New Year and as usual, Happy Coding!

Laurent

New intro on my website

Laurent Bugnion — Fri, 19 Jun 2009 06:02:14 GMT

The time was ripe for a new intro on my website www.galasoft.ch. Here it is below, posted for my blog’s readers. I hope that you find it entertaining.

----

Time sure flies when you’re busy :) Already middle of the year, summer is coming and I have been so busy with amazing projects! Yes, since last time I wrote here, much water has run under the bridges and I am loving my job.

I have taken part to an exciting series of conferences: The Microsoft Most Valuable Professional summit took place in March in Seattle. After that, back in Europe for a quick jump to Belgium where I held two talks at the TechDays conference in Antwerp. This was a fantastic experience by the way. Later, back to the US for the most exciting of all conferences, MIX in Las Vegas! And this time I was a speaker, what a thrill! I often say that MIX06 is the conference that changed my (professional) life completely, and to be accepted to speak at MIX09 was a fantastic and exciting achievement.

After my return in Switzerland, I had two more talks, one in Geneva and one in Bern. This was the same talk, but once in French and once in German. The response has been really good and it was a nice experience (even if it was a bit scary when I was preparing ;))

After this crazy travel time, I had time to work on exciting projects at IdentityMine. Silverlight and Windows Presentation Foundation are my daily bread and I love it. WPF really rocks, and the more I use it, the more I am in love with that framework. Since I have the chance to work with some of the best designers in the industry, I can really (some would say finally) create the beautiful applications I have always dreamed of, and Love my Software (which is incidentally IdentityMine’s motto). It’s really amazing to be part of that world class team of experts. What a motivation to get better. In the process, I am also learning a huge lot about interaction design, and sometimes it is tough, but it is always a passion.

One more talk took me to Belgium again, this time in Kortrijk for MultiMania 2009. It was an interesting event, with a crowd in majority favoring Adobe products, but I think my talk was well received and we had a lot of interesting discussions.

One project that has been occupying most of my “free programming time” is a toolkit to assist the implementation of Model-View-ViewModel applications in Windows Presentation Foundation and in Silverlight. After quite some time, I released the first version of the toolkit. I am still working on it and should post an installer soon (for the moment the installation is manual). I also have a couple of ideas about things I would like to add to the toolkit. Finally, the grand plan is to post everything on Codeplex and to let the community do its thing. That should be fun.

The coming weeks will be quite packed with work. I will be in Seattle from the 11th of July. I will stay a couple of weeks to work with the team (and meet tons of friends I am sure), and then my family will join me for a week of leisure between Seattle and Vancouver. This should be a lot of fun.

For more information about my whereabouts, planned talks (such as the one I will give at the SD2IG group in Seattle on the 15th of July), make sure to subscribe to my blog. Meeting you all is what is keeping my motivation high and my passion alive.

New "Welcome message" on www.galasoft.ch

Laurent Bugnion — Mon, 26 Jan 2009 10:14:43 GMT

I changed the "welcome message" on my website www.galasoft.ch and thought I would also publish it here :)

----

Update: In addition to the talks listed below, I will also talk in TechDays Geneva. More details here.

Here are some fresh news from Stäfa! With Xmas and New Year behind us, Chinese New Year around the corner, the year 2009 is well started and looking very good. I have a number of exciting events in front of me.

You might have noticed a new box titled "Sponsors" in the side bar of this page and others on the site. After a long hesitation, I finally decided to place advertisement on GalaSoft. This is not enough to make tons of money (I am not Scott Hanselman or Jeff Atwood ;)), but it will help me to keep the site entertaining and to improve services (like bandwidth or storage). I took great care of choosing an ad service that is both tasteful and totally related to the content of this site. So much so, in fact, that I joined the newly opened Silverlight room at the Lounge, a service that gathers only respected professionals and that takes great care to display ads that are especially targeted at professionals.

First you will see me in Seattle at the Microsoft Most Valuable Professional summit 2009. The summit is an exciting event, the chance for us to meet Microsoft product groups and pass them feedback, and to learn about the future of technology under Non Disclosure Agreement. And of course this is also a chance to meet old friends and to make new one. The comunity is amazing and vibrant, and this year should give me the occasion to meet people I have only met online so far. This will be in the first week of March.

During the same trip, I will be visting my friends and colleagues at IdentityMine in Seattle and Tacoma. By the way guys, we're planning a get together on Thursday night, the 5th of March 2009, so if you are in the region and want to join, contact Teresa who is organizing everything :)

The week after I come back to Europe, I will fly to Antwerp in Belgium, where I will give two talks in the Microsoft TechDays. This should be really nice. See the abstracts here. When I am there, I will also be an attendee at the local Geek Girl Dinner, thanks to Katrin who invited me to be her "sacoche" (hand bag :)) I think this should be really nice, and I am impatient to meet lots of new people there. I think that there is really a much too low number of women in our industry, which is a shame considering how creative this work is, and how well the few women who are active in the community are performing. We could really use a different, more feminine way to solve problems!

The next trip will be to the USA again, Las Vegas woohoo. MIX09 is coming up, and it will be really exciting! MIX is my favourite conference, and I have been to all of them since it started in 2006. I can honestly say that this first edition truly changed my life: It made me discover WPF, motivated me to start my blog and to switch my attention from the JavaScript community to the .NET client application community. This year's MIX should be a fantastic edition if I believe what I read so far, so don't wait longer to book your places there! It's a smaller conference than PDC or TechEd, and when it's sold out, it's over!!

After my return to Switzerland, I still have one exciting event planned: TechDays in Bern, where I will be speaking on the 9th of April. I really like TechDays Switzerland and am always amazed at the number of people who show up, considering that we are a small country after all (and this is the Swiss German part of the event, another one for the French speaking part takes place in Geneva a week earlier.)

I really hope I can meet many of you at these events, and have interesting talks about all these technologies that are our passion. More than ever before, maybe, these are really exciting times to be in the business.

Happy Coding!!
Laurent, Stäfa, the 24th of January 2009

New Year's Greetings and Silverlight Greeting Card

Laurent Bugnion — Thu, 01 Jan 2009 04:51:02 GMT

Happy New Year to all. 2008 has been an amazing year, with many changes in my professional life (joining IdentityMine, publishing my first book Silverlight 2 Unleashed, etc...). It was a real pleasure to be in company of some of the brightest minds on this planet and to do my best to not seem to ridiculous next to them :) Privately, the highlight of this year has been our trip to Asia (Malaysia, Hong Kong) which will remain in our minds forever.

To celebrate the year ending today, I published a Silverlight greeting card. In fact it's more of a slideshow, a reminder of all the good things that happened to us in this fantastic year. Simply point your Silverlight-enabled browser to the following link:

http://www.galasoft.ch/NewYear

I will try and write more about this application next year :) It was really fun to program, and I attempted to follow the principles of Model-View-ViewModel pattern applied to Silverlight as well as I could. There are a couple of things I could have done even cleaner (for example using my friend Josh Smith's Silverlight RelayCommand class which I totally love) but I didn't have time.

I also learned a lot in the process of writing this application, so it's only natural that I share the code with you now. I am always really interested in any comments you might have, don't hesitate!! Note that this application uses the WPF Toolkit and the Silverlight Toolkit.

Thank you all for your friendship and your support. 2009 is going to be awesome.

New design for GalaSoft website

Laurent Bugnion — Sat, 08 Nov 2008 11:16:58 GMT

It's with great pleasure that I am publishing the new and improved GalaSoft website today. After updating my blog's look and feel to a much better and more modern them, it's now my website's turn. www.galasoft.ch is the place on the web where I post articles and resources in relationship with my work. Historically, it has been my main "home" on the web. Nowadays, things changed and my blog is really where people discover me first. Nonetheless, I want the site to be a great complement to the blog. The first phase was the new theme. In a second phase, I want to convert the site to ASP.NET MVC, mostly because I really want to learn this technology based on a real life application and not just demos. It will also give me more freedom to add new features to the site.

I hope you like the new theme, and if you do (or don't), please leave me a message and let me know about it. As I said earlier, I am eager to learn and always ready to improve my skills.

Silverlight 2 Unleashed Online Content

Laurent Bugnion — Thu, 23 Oct 2008 23:31:05 GMT

There is a lot of online content available for Silverlight 2 Unleashed!

Errata

One thing that I am particularly sensitive to is the correctness of the information I put in the book. Because of time constraints, some *very* last minute changes by Microsoft didn't make it to the book. Other minor errors managed to slip through multiple review rounds (and believe me, many people did review this book with utter care and attention). I listed the Errata (a dozen so far) on my site, and the list will also be made available on the book's official site.

I encourage my readers to send me any error they will find at laurent@galasoft.ch. I take any constructive criticism very seriously and positively, so don't hesitate to send me your messages!!

Side note: I will however ignore any Tweet with the word "fail" or "FTL" without additional explanation. :)

Source code

It took me quite a lot of time, but I make (almost) every snippet of code available for download. Even small snippets not directly included in an application are copied to a project named "SampleCode". In addition, for most examples, I created a working application demonstrating the effect of the code, and allowing the reader to modify it and study the effects live.

I am also very sensitive to the fact that some readers are more fluent in VB.NET than C#, and we try to provide every sample in this language as well. This takes time, and my technical editor J Boyd Nolan is in the course of translating the code. I will give more information on the code download page and on this blog when more VB.NET content is available.

Question and Answers, Activities

For each chapter, you will find questions and answers allowing you to review and consolidate your understanding of the chapter. The page also proposes activities related to the chapter. This material will help you to "dig further" and deepen your knowledge of Silverlight 2.

I think that this page has a huge value for the reader, and I really encourage you to take a good look at the Q&A and to try your hand at the activities. For some of them I also provide an implementation of the solution. The reader should be able, not only to understand the material in the chapters, but also to modify it, and to build on that foundation. This is exactly the purpose of the activities proposed.

Redesigning my website with the help of Expression Blend

Laurent Bugnion — Mon, 20 Oct 2008 09:53:50 GMT

I decided to completely redesign my website www.galasoft.ch (yes, it's about time, I know). For this process, I decided to inspire myself (loosely) from my good friend Robby Ingebretsen's site, which is both simple and beautiful.

In order to get a better idea of what I want to reach, I decided to work like most web designers and to create a mockup first. Instead of creating a static picture, however, I used Expression Blend, a tool I am fairly proficient in, to create a WPF application demonstrating not only the new website's look&feel, but also "faking" some of the dynamic behaviours, such as what happens when a window gets resized, or when the mouse hovers over links. Blend also allowed me to test various color themes and to understand how they react together when the user works with the page.

An advantage of mocking up the pages before implementing them is to get feedback. Because I am not a web designer, I am sometimes struggling to improve the site's conformance to standards and best practices, its overall beauty and of course the user experience. However, this is a profession that requires a lot of experience and talent. Let's face it, many web developers nowadays are just downloading an existing template somewhere on the web, tweaking it (and often breaking it) and then thinking what the heck. Because I want to learn from the best, however, I am publishing the "mockup" application as a ClickOnce WPF application, and looking for feedback. Simply click here, install the application and start playing.

When you use the application, you can change the color themes by clicking on the buttons on the bottom-right. The default color theme is the one I prefer, and the one I am also implementing in CSS at the moment.

Principles and ideas

I want the site to be cleaner and easier to use than now.
I want to do my best to respect current best practices in HTML, CSS and JavaScript.
I want to avoid hacks as much as possible (such as CSS hacks).
I want each page to be linkable with a unique link.
When server-side code must be generated, I want to use ASP.NET MVC and stay clear of web forms.
I want to reduce the usage of client-side JavaScript, and start using 3rd party libraries, especially jQuery.
I want to use Silverlight to enhance the website only, but not to replace functionality.

These principles I want to follow have two purposes:

It will make the site nicer and easier to use.
It will allow me to learn new technologies that I deem important in the moment.

This last goal has always been a major driver for all my private projects, and this one is no exception.

Designing in Blend

Designing in Blend presents a learning curve, especially for developers who don't have a background using Adobe products (though Expression Blend is made by Microsoft, its usage inspires itself from Adobe Illustrator (such as for keyboard shortcuts and overall user philosophy). Because it is also a development environment, it can compile .NET code and even execute it, both "statically" (for example loading design-time data when a Window is opened on the design area) and "dynamically" (press F5 to test your latest changes and run the real application).

Once you master the basics of Blend (and my good friend Brennon Williams' book "Expression Blend Unleashed" will help you there), it is faster to mock the web page up rather than with trial and errors in CSS (even with the support of the "design view" and the 3 CSS helper dialogs in Visual Studio ("CSS Properties", "Manage Styles" and "Apply Styles"). I found however that a good basic knowledge of CSS helps tremendously, especially in deciding what can be implemented in CSS and what cannot. Knowing the limitations of the target technology speeds things up (not all effects of WPF can be achieved in CSS), even though the "designer" (yeah, me) should not let this be a brake to creativity.

After writing 642-825 and 642-845, those professionals who are interested in EX0-101 or 642-552 decide to move on with 70-294 or 70-647 so that more certifications can be achieved in less time.

Choosing colors

The color palette I use for the new design has 4 background colors, one "standard" font color and one "active" font color.

The font color was easy to choose, since I simply "stole" Robby's gorgeous #3A3A3A. It's a very dark gray, but is not as hard on the eyes as a plain black.

The 3 basic colors brown, black and white are preserved from the original Gala head. The black and white are straightforward, and the brown was actually taken from the picture of my cat shown below. I still needed a background color for the header. I wanted something very light and bright, derived from the brown color. This is where I used a really cool tool for designers: Adobe Kuler. This tool allows you to enter keywords and will present you with a choice of color palettes uploaded by the community. In my case, I entered the words "brown cat" and was served with 5 palettes. I took a few light browns from these palettes, and put them in the file "HeaderBackgroundBrushes.xml". In my opinion, the clear winner is a light brown which is much brighter than all others, and very soothing: #F9E4B3.

All these light browns can be seen in action in the page mockup, as well as in color palettes, as described below in the section titled "The test application in short".

As for the active link colors, I started with a bright orange (which was not very well legible in my opinion) and tested many variations. The winner in my opinion is a color between orange and brown, which is less aggressive than a bright orange, and still contrasts enough with darker and lighter colors: #D98000

Choosing font

The font is also stolen (I mean, inspired) from Robby's website: It is a gorgeous Verdana (a Sans Serif font), which I find particularly legible. I also followed Robby for the line height and set it to a whooping 165%. This separates the lines very nicely.

I tried to follow best practices (as I understand them) to set the font size in the body selector and then to work with "em" units everywhere else. This is a place where I am sure that I can improve my CSS, so if you have a better suggestion, please let me know!!

The WPF application allows switching between fonts for the H1 and H2 headers. I started making these headers in Verdana too, but after talking with Nas Khan, I decided to follow Robby again and to use Georgia (a Serif font) for the headers. I think it's a winner, and it clearly differentiates between header and paragraph text. Of course I have fallback fonts for the computers where Verdana and Georgia are not installed.

Redesigning logos

I thought long about it, and decided to keep the cat's head as my main logo for my site. First, I like it a lot. It's been my companion since I started publishing about software engineering back in 1997 (more or less, I don't remember exactly when). It's simple and easy to recognize.

Short historical intermission

The name GalaSoft comes from my cat Gala, who unfortunately is not with us anymore. Gala was a farm kitten, a merciless hunter who could also turn into a huge fur ball of tenderness when she felt like it. I went through highs and lows with her until she one day decided to walk the road and disappeared (after 9 years living with us, and after my second daughter Laeticia was born). The brown color I used in the logo comes in fact from a picture of Gala, and is as close as possible from her original colors (black, brown, white).

The name Gala itself has two origins: I chose it to honor Gala Dali, Salvador Dali's wife. Salvador has always been a source of inspiration for my work. It is also a reference to Galadriel from the Lord of the Rings (a book I have been avidly reading and re-resing since I was 15). I thought that an elven princess' name fitted that cat very well, and I was right.

End of historical intermission

Because I didn't want to be limited by the format of the logo, I redrew it in Expression Design, and then exported it in XAML. Being vector oriented, this format allows me to seamlessly resize the images. Of course I am forced to choose a raster format for the web (I choose PNG), so after sizing the logo to the right dimensions, I take snapshots of it and save these as a collection of images.

I also took a shot at redesigning the site's logo, and created two versions for now. I still didn't decide which one I prefer, and it's possible that it changes after feedback. To have the same ease in resizing as with the cat's head, I also made the logo in Expression Design and exported it to a XAML resource dictionary (Expression Design exports as a DrawingBrush, which you can use to "paint" a Rectangle, for example).

The logo is inspired by the following idea:

The mix of a "brush" font (STXingkai) and a "coding" font (Consolas, the most beautiful monospace font currently available) is representing the mix of art and technology that software development is made of. I strongly believe that a good software developer is at a crossroad between an artist and an engineer, and I like my logo to be an affirmation of this.

The logo is not definitive, and will probably evolve a little more. I want to put a few ideas to the test and see how they look.

The test application in short

I made the application to allow studying variations in colors and fonts without having to go through a process of modify/start/dislike/end/modify etc... but instead being able to just click some buttons. First I designed the layout in Expression Blend. Of course this requires a good idea of what design you want to achieve, but since Blend is a visual design tool, it makes it really easy to modify the layout without having to bang your head over CSS too much.

Caution: WPF layout is much more flexible that HTML/CSS layout. You need to be aware of CSS limitations before you start doing crazy stuff in Blend. A prior knowledge of CSS is required before you start designing your mockup in Blend. This would be true of any mockup technology anyway.

I created a few XML files containing various colors for the header background, the page background and the active links. I chose XML as a format so that I can add, remove or modify some colors without having to rebuild or even restart the application. The XML files' build action is set as "Content". Once the application is running, it is able to locate the XML files and display them to the user who can edit and reload them to see the changes (see below how to do that).

Thanks to WPF and its ability to do data binding, the amount of code needed to load the XML files (I used LINQ to XML) and display all the elements in a ListBox is really minimal. In addition, I am able to retemplate the ListBox to make it look exactly like I want (in this case, a thin horizontal list of items that the user can select).

The application has 3 such listboxes, each corresponding to an XML file: Header Background (from the XML file "HeaderBackgroundBrushes.xml"), Page Background ("PageBackgroundBrushes.xml"), Active Link color ("LinksForegroundBrushes.xml"). These listboxes are displayed by the buttons "1" to "3". The button "4" allows to choose a different font for the headers H1 and H2 (from the file "Fonts.xml").

To edit the XML files and reload them during runtime, use the buttons labeled "O" (for "open") and "R" (for "reload" after you edited the XML file). The files can be edited in any text editor and are very simple. Note that for colors, you can use the color name (such as "Red" or "Yellow"), the HTML code (such as #FF0000) or the WPF code including the alpha channel (such as #FFFF0000). Once the edit has been done, reload the file with the "R" button, and you should see the new, deleted or modified items appear in the corresponding listbox. The page's look and feel will also be updated automatically.

Once the application starts, a thin window is displayed with a number of buttons.

The button marked "GalaSoft Head" opens a window with the head logo in full width and height. This is the logo exported from Expression Design as XAML DrawingBrush, so the resize is seamless.
"Logo Choices" shows two versions of the logo I work on. These can also be resized, in order to check the effect at various sizes.
"Color Palettes" opens a window showing the 4 base colors side by side. On the bottom of this window, you'll find the buttons I mentioned earlier in this article. Note that some of these buttons are not active in this particular window. The button labeled "1" allows you to change the 4th color (Light Brown). The button "3" allows to change the text color (including the "hover" color for the label "Big Text", simulating a a:hover CSS effect. The other settings have no effect in this window.
"Mock With Resize" shows a window with a mockup HTML page. Using the buttons at the bottom, you can change the Header Background color, the Page Background color, the Active Links color, and the fonts for the H1 and H2 headers. Remember that you can edit these colors and fonts using the "O" and "R" buttons.
"Mock Firefox" shows the same pseudo HTML page as it would appear in Firefox. Read more about this below.
"Shutdown" will close all the windows and shut the application down.

Mocking up Firefox

I am very visual and I find that the header with the navigation bar and all the tabs in Firefox influences the way I perceive the page's look and feel. I wanted to have a way to see the page with all this additional chrome (pun intended). To simulate this, I made a screenshot of the top of a Firefox window and added this as an image to a WPF Grid. To make it more realistic, I made the WPF window chromeless, which means that it doesn't have any title bar. The title bar is simulated by the Firefox screenshot. To make it a bit more user friendly, I added two invisible rectangles (note: to make them invisible but still let them react to mouse input, set the Visibility property to Hidden): One of them on top of the title bar takes click and drag mouse events, and moves the WPF window accordingly. This allows dragging the window to another location. The other smaller invisible rectangle is located on top of the Firefox screenshot, where the "close" button (the one with an X) is located on the picture. When this invisible rectangle is clicked, the window is closed. This simulates the behavior of a "real" Firefox window. I didn't implement any resize, minimize or maximize action, but it would be possible too.

Even though I didn't implement this, it would be easy to switch between Firefox, IE, Opera and any other browser to compare the page's perceived look and feel.

Publishing as ClickOnce

To gather comments from as many people as possible, the easiest way is to publish the mockup as a ClickOnce application. ClickOnce is a not very well known way to deploy a .NET application (not just WPF, any .NET app) over a website. Personally I love ClickOnce, even though it has limitations: The install is on a per-user basis (can't install for all users of a PC), you cannot access the registry (so it is impossible to register COM components, for example), and you cannot specify in which folder the application will be installed. On the other hand, it is really easy to publish and install a ClickOnce application and it has a built-in version check allowing you to push newer versions of your application to every connected user.

To publish the application as ClickOnce, right click on your .NET client application and select Publish in the Solution Explorer. This opens a wizard where you can specify the destination folder on your website (I usually publish my ClickOnce applications over FTP to my web server, but you can also publish to the local file system (for example to burn on a CD), or to the local IIS (for example to test the deployment). You can also specify if an entry should be added to the Start menu, in order for the user to be able to start the application just like she would start Word or Firefox. This is a nice touch.

Note that more advanced settings can be found by right clicking on the project you want to deploy, selecting Properties from the context menu, and then choosing the tab Publish. These settings allow to specify exactly which files must be marked as pre-requisite, which files must be deployed (for example, you don't want to deploy the .NET framework, but marking it as prerequisite will trigger a check of the client machine, and the user will be asked to install .NET if it's not already present). You can also specify the auto-update mechanism for your application.

Once all the settings have been set, publish your ClickOnce application to the web server. Depending on your settings, a file named "publish.htm" will be created. This is the URL you want to give to your users.

The file publish.htm

By clicking on the Install button, the ClickOnce deployment will be triggered. After installation, the application will be started. Because I set the version check to occur before each start (which is a bit annoying, but since the design might change often in the consulting phase, it is needed), every time that the user starts the application, it will connect to my web server and check if a newer version is available.

Note: The version being checked here is the ClickOnce manifest version, which is not the same as the assembly version. The ClickOnce version can be set manually when you publish the application, or it can be incremented automatically every time that you publish a newer version.

Auto-increment the ClickOnce version (in the project properties)

One important caveat is that the XML files used for configuration must be explicitly marked as Included. Because they are built as Content, they will not be included in the assembly (this way they are available for modifications during runtime). To include these files explicitly in the deplyoment, click the Application Files button in the project properties (tab Publish) and then change the Publish Status for the XML files to Include.

Including files built as Content

What did I learn?

- Typography in "basic" WPF is not as flexible and advanced as in CSS. This might sound surprising, but remember that WPF has a whole "flow document" set of features which I chose not to use in this application, for simplicity sake. Remember: I am not trying to make a new WPF application to display content here. The final application will be HTML and CSS based, and this is where I should refine the styles. (For example, I couldn't modify the line height in my TextBlocks, but I am using a line height of 165% in CSS, which gives a much neater and clearer impression). Also, ClearType is... well, the anti aliasing of fonts that were clearly not made with anti aliasing in mind is disturbing.

- Designers are really cool: The site was inspired and reviewed by some of my designers and artist friends: Robby Ingebretsen, Corrina Barber, Nas Khan, Brennon Williams, Gigi Lee. All gave me really valuable feedback.

- A nice design is a simple design: Even though Expression Blend and WPF allow for crazy stuff, the best is to keep it clean and simple. The content is at the center (that's a programming website!). Also, CSS is more limited than WPF, so having a good prior knowledge of CSS (or at least of its capacities and limitations) is really necessary before starting creating in Blend.

- Variations between browsers suck - nuff said. One more reason to keep the design simple and clean.

Next steps

The very next step in this process is to put up a first live page with the new design. This will happen very soon and will be related to my book Silverlight 2 Unleashed. Since I plan to put some material online in relation with the book, this will be a great occasion to test the new look and feel.

After that, I want to gradually convert the whole site. This will be a relatively long work, because I want to convert the structure of the site (to an ASP.NET MVC application) and the design (the new style discussed here), and at the same time try to preserve the legacy URLs to avoid breaking existing links as much as possible. I don't have everything figured out at the moment, but I will blog about it when the time comes.

I also want to redesign my blog to stay in line with the site's design. The good people at GeeksWithBlogs host my blog but I am able to use my own subdomain blog.galasoft.ch, so it makes sense to have a blog looking very consistent with the site galasoft.ch.

Download

In case someone is interested to take a look, I provide the following code:

Various pieces of news

Laurent Bugnion — Wed, 01 Oct 2008 09:30:06 GMT

Now that the book is finished writing, reality is catching up with me and I am finally able to work on the backlog of ideas and projects that has accumulated in the last months. Time to give an update of stuff I do or will do soon.

Silverlight 2 Unleashed status

On my side, the work is done and I delivered my copy to the editor. We had a small bunch of last minute corrections when Silverlight 2 RC0 made it to the web, and I am happy the good people at Sams gave me some time to clean up a few kinks. I think we're in pretty good shape now. It was not too bad, but it's even better now :)

On Silverlight side, as all of you know by now, Silverlight 2 RC0 was released for developers, which can mean only one thing: We're coming very close to the release date. Most changes to Silverlight now will be bug corrections, and the interfaces should not change any more. Stay tuned for new about that.

One funny thing I noticed as I was surfing Amazon is that people who bought Jesse Liberty's Silverlight book also bought my book and... Death Magnetic by Metallica! My kind of people, digging Silverlight and banging heads as they code :)

On my blog

Some of you reported that my posts were duplicated in the RSS feed. I am not sure what the problem is and I contacted GWB's support team about it. Waiting to hear from them. I did something that might have corrected the problem though: I am now burning the feed through Feedburner. It's one of those things I wanted to do for a really long time, but couldn't afford because of too much to do. That's done now. Thanks to the amazing work of the team at GWB, you shouldn't need to change anything to your settings, the old feed is redirected to the new one automatically. Just in case you need it, the new feed is at http://feeds.feedburner.com/galasoft.

I decided to review all my Silverlight posts and to deliver updated code where needed. In the very worst case where updated information doesn't exist (because things changed too much between the post and now), I will add a warning box to the post. With my blog being pretty well visited through Google, I'd like things to be very clear about what is old and what is current. I already selected all the posts that need updates, and will post the updates gradually.

With more free time now, I will be able to resume blogging on a more regular schedule, yay!

On my site

My site got some heat lately because (and I am the first to admit it) it's not really representing the quintessence of technology anymore. In clear, it's time for a face lift. Because I am painfully aware of my limits as a designer, I decided to partner with a talented person with very artistic skill, and she will provide guidance and help me with this work. I am really happy that she accepted, because I am sure that I will really learn a lot in the process. This will also allow me to try some new technology (such as ASP.NET MVC) as well as some not-so-new technology which today became a must-learn (jQuery and al). Actually, my presence on the web changed a lot since I started blogging. Before that, my site was the main point of entry to my own world wide web. Since then, my blog really became the major point of entry, with the site being a repository of source code, more "in depth" articles, various resources and archives. I want to simplfy the navigation and make it much slicker than it is now. I also want to have a better way to track what's downloaded, but without disrupting the user experience. And finally I want to be able to control my markup completely and to use a better URL mechanism, which of course talks for the ASP.NET MVC. It will be really nice doing some web development again for a while.

RIA podcast hosted by Josh Holmes and Mike Labriola

I met Josh Holmes face to face for the first time at MIX08 but I had been following his work for quite some time before that. Josh is a great guy. I really like his take on RIA development and the world of software in general. I love the way he keeps a cool head even in heated discussions. And it's really nice to hang out with him as I was able to find out last Thursday. Josh was in town on a tour of Europe (I think he said 7 countries, what a cool job) and stopped by at Microsoft Switzerland for a briefing about Silverlight in front of a small panel of Microsoft partners. The talk was really nice and we went to dinner after that and exchanged war stories with Atif Aziz (also a really good guy and the president of the .NET User Group of Switzerland DotMugs.ch (which we really want to animate more soon, so stay posted too).

After the dinner, Josh invited me to talk on his new podcast about RIAs, called Wire Side Chat, that he hosts together with Mike Labriola, an Adobe Expert. I think that having a Microsoft evangelist and an Adobe expert talk about RIAs is really a great idea, and I was delighted to take part to that experience. It was really a great 20 minutes (the podcast is kept short on purpose, and the 20 minutes are timed), and I loved that experience. Mike is a really nice guy to talk to (unfortunately he was not on site, based that he is in Chicago, but we had crystal clear audio over Skype). Overall it was really cool. The podcast will be posted at the WireSideChat site in a few weeks, and I will of course report here when it's done.

By the way, Atif also talked to Josh, not about RIA but about his experience with Python. It's a really entertaining 20 minutes and was posted on the "hacker" site of Wire Side Chat.

My next project

On the private development side, I've been starting a new project that I have been thinking about for more than a year now. It's a revamp of my old PhotoAlbum, which has served me well but really needs a whole new engine and UI. In this project, I will also work with a lot of new technologies, and I already have a good idea of where I want it to go. This will be a great project, with lots of components that I will develop and integrate gradually. The very first component I am working on now is a Script Engine, able to decode and execute actions coming from different sources (a URL query string, an XML file, or a web wervice). I need that component as the first stone in direction of a multi file upload tool I want to develop with a Silverlight front end. I know that other Silverlight file uploaders are available, but I have a very clear idea of where I want this one to go, and I think it should be fun developing it. It willnot be strictly tied to the PhotoAlbum, and will be available as a separate install for those of you who are interested to use it. More on this later.

I will post more information about the PhotoAlbum later. I already have a list of requirements that I want to implement, and that should be my pet project for quite a long time. I started working on the very first version of the PhotoAlbum really long ago, and this will be V3 (V2 was really just a clean up of V1, which was working with a Java applet querying the list of pictures on the web server, fun times). As usual when I develop, I want to use this as a showcase and a way to learn new technologies.

Next trips

I still have one big trip in front of me before I leave Siemens, and this will be a roundtrip across the USA, with Los Angeles CA where I will be attending the Professional Developer Conference 2008, and Princeton NJ where I will be involved for the last time in a design workshop for the big project I have been working on since 2006.

PDC will be great, I am sure, and will be packed with information. I will arrive in LA on the 25th of October, and will attend the pre-conference on the 26th. Expect some live blogging there, which lots of readers enjoyed, if I believe the feedback after MIX. I plan to repeat the same experience. The conference itself will be so packed with sessions that it's almost discouraging, but as usual at a Microsoft conference we will be able to catch up using video archives after the sessions, so it's all good. I will stay a little longer in LA and leave on the 2nd of November to Princeton NJ, and then on the 6th to Switzerland.

I should be really busy at PDC but I always find time to meet old and new friends. Keep in touch and notify me if you are there!

2 years and 266 posts later...

Laurent Bugnion — Thu, 12 Jun 2008 03:05:21 GMT

2 years ago, on a Sunday, I posted my first blog post. Since then so many amazing things happened, partly due to this blog: I got the MVP status, I got a better recognition in my firm for my expert knowledge on some topics (such as WPF, Silverlight, ASP.NET and C#), I started speaking in conferences... One year later, I got a book deal (more on this soon). I met amazing people, and made a lot of new friends in the industry. I went to Redmond a few times and had the chance to talk to some really amazing talents in the software field. More importantly, I really had the feeling that my contributions were acknowledged, and valued. It's really been 2 amazing years.

To all of you reading these lines, thank you. You make my life as a software engineer better, more interesting, and you really help become a better developer.

GalaSoft "TweetMyPage" released for tests

Laurent Bugnion — Thu, 29 May 2008 09:54:38 GMT

GalaSoft "TweetMyPage" is a web application allowing you to post to Twitter what you're currently reading in your web browser, on a simple button click.

After you install the small "scriptlet" button in your web browser's "bookmarks toolbar" (Firefox) or "Links toolbar" (IE), any time you want to share what you're reading with the world, you can simply click on the "TweetMyPage" button.

If it's the first time in this session that you are posting, you will be asked to enter your Twitter user name and password. After that first time, you will not be asked for it anymore, not until you close your web browser.

As a result, a message will be sent in your name to Twitter, for example:

When you create the "Bookmark button" in the Settings page, you can customize the "Reading" prefix that will be posted, as well as a couple of other settings.

TweetMyPage is in beta for the moment, and if you want to try it, I'll be happy to send you an invite (just leave a comment down here or send me an email. If all goes well, I will make TweetMyPage public next week or so.