Jose Fajardo

Friday March 28, 2008

Live Messenger - Login Screen UI

2 days ago I set myself 1 simple task, to build the UI for the Login screen of windows Live messenger!

1 day later I was done!

Equipped with the knowledge gained from my control skinning adventures I set out on creating the UI as best I could pixel for pixel. The result speaks for itself. 

I said it before and I'll say it again, Silverlight is an amazing technology. It's potential is limitless, and it really empowers the designer and makes their role in any software project critical to it's success!

 

Back to the project at hand...

 

I made extensive use of the button control, used heaps of skins to get the different button effects. I created my dropdown's using a mashup of a button and a popup control. Other controls that I used extensively were the hyperlink's and the checkboxes. No bitmap images were used, all pure xAML created in design, for the complicated ones, or blend.

Rather than write up a detailed post I've decided to create a video. I plan on doing that this weekend so please check back soon, there was so much that I learnt and I'll be dumping all that knowledge into a concise edited video.

 

Below is a snapshot of the Silverlight Messenger Application. Clicking on the picture will take you to the sample Silverlight application.

 

[Figure 1 : Silverlight version of the Windows Live Messenger]

 

Source code: LiveMessenger.zip

Demo site: Silverlight Live Messenger