My first experience with “Web Design” was around 1997. the DotCom thing was heating up and a client wanted to host a web site that was “Designed” by a “Internet Design Company” (that I swear was not in business even 10 days before).

The problem was that the “page was taking too long to load”. I looked at what they did, and saw that while it was a beautiful page (yes, the “site” was only one page!), it was one big .gif file (and this is in the age of 2800 baud modems).

What I did, was break up the parts of the image, into separate images laid out using tables (again this is before the .css gurus told us how evil that was). The “Site” loaded in a tenth of the time and I learned that “Designers are only good for making mock-ups, and only programmers know how to properly make web applications”.

I hate to admit that this has been my attitude until this year. The year I ran into Alan Beasley. Without intending to, he made a Programmer admit that Programmers are not in charge of the most important aspects of building truly great web applications, the Designers are.

The Silverlight Buttons

It all started with a simple article Alan wrote on CodeProject.com: Building Better Buttons in Expression Blend & Silverlight. The point is that these were “just buttons”, but they were fun to press. I started to use his buttons in my articles, and I noticed that people were more impressed with pressing the buttons than they were with my code examples.

I started to collaborate with Alan, and I watched people play with the PopUp in our Popup article over and over again.

I would ask them “why do you like this so much?”, and they would respond, “I like the way it smoothly slides between yes and No”.

It then hit me that Silverlight allows us to make applications that people find enjoyable to use. Perhaps it is the way a driver enjoys driving a finely crafted automobile. It doesn’t matter where you are going, it is just fun to drive.

I was particularly taken by a small detail that Alan put into a File Manager application that I Programmed and he Designed.

In that one, the slider in the middle “pulses” when you hover over it. It practically begs you to slide it smoothly left and right. It is a small detail, but it says to the user “we know you exist, and we care about your experience”.

Designers Are A Pain!

All this comes at a price. Alan is a great guy, but he is after the best user experience, period. On a Windows Phone 7 tutorial, we spent two weeks, after I had completed all the coding, emailing back and forth resolving issues such a how he can transition from the list box to the video the way he wants.

Actually, every single project runs into the same design related issues:

• “I want to be able to use a slider here…”
• “I need the ability to trigger an animation on this panel…”

It’s funny how I seem to be able  to create applications that work just fine, and there are only “issues” after he gets a hold of it!

But, that the point, there IS a problem with the application. HE is the person who can SEE the problem. A single minded attention to the Design of an application, allows the application to be better Designed. After each “issue” is resolved, I have to admit that he is right.

Look at my version of the File Manager:

And look at his:

The code is exactly the same!

But, it’s not just about “look”, it’s about “Design”. Look at my version of the Windows Phone application:

Now look at his (again, the code is exactly the same):

His design not only looks better, it makes more sense. He addresses important issues, such as the spacing between the buttons, so people don’t accidently press the wrong button.

Don’t get me started on how much agony he gave me over the issue with hooking up his version of the volume control. The entire time I am asking myself “WHY ME??”, until I see the final product and realize once again why it’s always worth it.

View Model / MVVM Is The Answer

Everything that Alan Beasley and I have done would not be possible without View Model. View Model, is basically MVVM without any of the “you should not do that”. View Model is about Designer Developer interaction, period.

Silverlight allows Alan and I to have a separation of responsibilities. He is in charge of anything that ends with .xaml (the UI) and I am in charge of anything that ends with .cs (the code). He never messes up anything that I am doing, and don’t mess up his stuff. We can actually email files to each other that the other person can simply drop into their project and it just works.

I feel that, the fact that a Designer can have complete control over the UI, means that Designers will work in Silverlight rather than another medium such as Flash. What artist wants to see their work “cut up” by some Programmer?

It’s is not enough to teach Programmers how to do better Design. We need to give Designers “an equal place at the table”. Great applications will be created because we have “Diversity”. It’s not a “Team” if the Programmer is able to overrule everyone else, because every aspect of the application must go through the Programmer.

When my programmer friends and I discuss different techniques to build Silverlight applications, the conversation usually gets to the “what would Alan Beasly think?” question. If he is not able to completely Design the UI with no coding, you lose your Designer. So unless we think Alan would “sign off on the solution”, we find another one.

The Programmers And The Chairs

Design is nice, but the most important thing? What about good architecture that is scalable and easily refactored ? These things are important, but the most important thing about any program, is the people who use it. A poorly designed application that has a great back end, is of little use if it does not perform the functions that the human being using it needs done.

Let me illustrate my point with a story I call “The Programmers and the Chairs”:

The requirements were  clear. We only have trees to work with, and we have a lot of people, and they need something to sit on, because they get tired if they are standing up all the time.

The first time the problem was solved, it was solved only by Programmers. Programmers are really smart people, and they figured out how to cut down trees, and they created tools to create chairs. And that is it, they created one type of chair. It met the requirement.

The next time, a team of Programmers and Designers was used. The Designers realized that sometimes chairs were needed that needed to be moved a lot, so they designed them to be lightweight. Other times the person using the chair needed to sit in it for long hours, so they made it adjustable to support their back.

Please note that each time the Programmers were required to make these “Designs” actually work! “You want the chair the same size but lighter?” Whyyy meeee?? Hmm perhaps we can make the legs thinner…

And sometimes they wanted a chair so they can rock a nursing baby to sleep. This chair can also be easily rocked when they are older and want to watch their grandkids play in the yard. The Designers added contoured armrests and attractive patterns in the wood. Things that would appear to serve no purpose, other than the fact that this is a chair that a person will use as a cherished possession for decades.

This is the kind of application that I want to create.