On December 21st I presented at the Twin Cities Silverlight User Group a session entitled “I’m not a Designer, but I Play one at Work”. In the presentation I showed some of the basic ways developers can simulate glass, spherical buttons, reflection, and 3-dimensional click behavior. Additionally, there are some samples of a clipping path, and partially filling an irregular path shape, similar to representing a percent full, or percent complete. Beyond basic design concepts of shading, opacity, and lighting, the concepts of developer friendly designs were included.
One such example is relationally positioning items that will resize. Text is a great example of this. While it may make sense to absolutely position graphical elements representing a lighting effect in a canvas, it will rarely make sense to do so for text, that will often change, especially in an application localized into a foreign language.
Another example of developer friendly design is the concept that colors of a control should be bound to a single color, if possible. A designer may make a red button indicating a status with many shades of red, in a gradient, to simulate a reflection and lighting effect. However, if the designer instead lays down a single color or red, then overlays many layers of white and black, in varying degrees of opacity to simulate the shading, the resulting display may be very similar, and now the developer only has one color to change (red to green) to mark the change of status.
The XAML and code that was used in the demo can be found in this download.