Let's make a background

I have to admit I was not looking forward to creating a nice background for the Royal Hotel site, but it was necessary. I had one of two options on my plate: either I use one of the pictures of the hotel as the background or I create one. While using an existing picture may seem easy, as the whole point of a hotel company's website is to market themselves, putting the hotel in the background just sends the wrong message. And thus, creating a background becomes a necessity.

I like the royal blue color scheme and could possibly even run with it a bit more like they tried to do on the original site. Here is where I decided to gimp it up a bit. I created a 1600x1200 empty image with transparency and then used a flame filter (Filter -> Render -> Nature -> Flame). I tweaked with the color (dark blue to gray), selected a spherical type and zoomed in on the flame so you can see the circle goodness. Here is a scaled down version of the image.



When I add a nice blur effect to make sure it's not in focus and we should be good to go. Because it's transparent, I can add a gradient background that can repeat and isn't part of the image (effectively layering the background) making it quicker to load. The compressed flame image plus the compressed gradient repeat take less space than the gradient added directly to the flame image and compressed.

To do the blur I do a simple gaussian blur. Because the flames are so wispy, I had to increase the blur radius to 20 pixels. Below is the scaled version of the blurred flame background.



All done with that. The actual web development starts next. Let's see if we can get the site functional AND pretty. Well, enough. :).