Wednesday, June 2, 2010

Flex Glass Headers

When i first started to work in Flex almost a year back, I was so eagerly looking to grab as much goodies as possible and make my application look spiffy. I remember staying all night long at work so many times, just to explore options by visiting many sites and applications built using Flex, primarily to get sources of inspiration.

One such application was the Flex Style Explorer. The one thing that I loved the most was the mild glossy look it had on its title; Luckily it had the view source enabled and I went on to see how the guys had done that.

It was a mere reference to a transparent flash sprite compiled into a swiff file and was referred from inside the CSS - set as the backgroundImage of the panel.

I went on to build my own header using flash in the next few minutes and added my own version of the glossy look to my application.

Click here to see the image of my app title before and after.

It was such a mild difference, people could hardly notice it; but it hugely enhanced the overall aesthetics of my application. People LOVED the look and feel but no one guessed it. I went on to use this header smartly across the application onto different controls wherever possible.

No comments: