Barry Thomson Guitarist & Singer Website

Although the domain www.barrythomson.com was registered a couple of years ago despite a fair bit of nagging it was only when Barry was due to appear in the 10 year anniversary restaging of the 'The Guitar that rocked the world' show that he decided it was time to setup a website. With the show due to start in just a couple of days and Barry tied up in final rehersals there was not much of a brief in terms of the design requirements of the site. Initially due to time constraints the site was only going to include basic overview information about Barry Thomson but more of the cms features are being implimented as additional information becomes available.

From the outset I had the idea of having an almost full size guitar running the length of the site so that the fretboard became a feature down the left side of the pages of the site. Obviously it is highly unlikely that many, if any, of the pages of the site would be as long as a full size guitar and it would look silly having a long page with a full size guitar image running down the side of it if there was only going to be a small amount of content on the pages. The site utilizes our content management system which means that the amount of content on various pages could vary. The effect that I wanted to attain was for the amount of guitar revealed was dependedant on the length of the page as determined by the amount of content on the page. Fortunately I managed to find a suitable almost full size photo of a Gibson Guitar that is very similar to the Gibson guitar that Barry actually owns. The trick was is in using some cunning CSS layering and design techhniques to achieve this. By using css layout and transparent png images the effect of the guitar revealing itself as the length of the page grows was achieved, including a gradient fade that fades out the hidden area of the guitar image instead of having a sharp transition. The effect is exactly what I had in mind.

The graphics at the top of the page are also quite cunningly achieved using javascript to scroll the images of Barry across the top of the page. Layering was also used here to enable the images to pass behind the head of the almost full size Gibson guitar. These types of graphics have been easy to achieve with flash but with the disadvantage that flash files can take some time to download before displaying and often an effect can be achieved using clever use of javascript.