I had provisioned in my wireframe design (page3) for the banner to be a horizontal one, and on looking at the banner sizes available throughout the web found the biggest to be a leaderboard (728x90) but this isn't available in Flash, so it leads me to think that could be an American sized banner.
The next available one is called a 'full' banner but I think that term should be applied loosely as it's only 468x60. I understand that most people don't want adverts to take over the content space for normal websites, but in our context, the banners feed into the main piece. It seems a shame to have to use such a minimal sized horizontal banner.
Soooo, I decided that the only way to progress was to alter the wireframe. The wide skyscraper banner is quite a decent size at 160x600 and therefore wouldn't look too much out of place on the html page.
The altered wireframe can now be seen below:
With this vertical portrait-like set up, I started creating in Flash.
--
Initially I had visioned a banner in colour, with red triangle warning signs, yellow hazard ones, for example. Also, being a fan of web2.0 visuals, I was keen to use gradients as I feel they just look nicer on the eye rather than a flat colour.
However, on producing this first mock-up, I noticed it just wasn't in keeping with the site. The brief is clear in mentioning that the banners should be cohesive with the rest of the site's design and so this particular banner wouldn't really fit in terms of that.
As a result, I started from scratch again and instead opted for a greyscale colour palette. This consisted of white, black and grey!
It was much easier to recognise this variation would gel with the rest of the site that will be surrounding it. I like the variation in the shapes, we have boxes, circles, hexagons, triangles. Furthermore, the addition of the red beacon (coloured to signify it's importance, just as Frank Miller did in Sin City) gives it quite an arty/sophisticated feel, I think due to it's limited colour palette.
The next decision I had to determine was how to animate the button so as to be noticeable.
This first one I changed in it's brightness setting. However, I discarded this idea as it appeared too washed out. The next one I tried to incorporate Miller's specific choice of yellow, but such a colour didn't seem to fit in the with the red and greyscale as well. Henceforth, I decided to tone the button to change between a normal red and a much more rich one. It is a subtle animation but I think aesthetically it all looks very pleasing. (I think I was again subliminally persuaded, this time by the Film 4 banner!)
Overall, I particularly like the humourous side to this piece. The 'push the button', 'do no push' signs at the start seems akin to comic book jokes. Another typical comic book feature is the ka-boom explosion which I tried to replicate, however the motion tweening did prove slightly difficult to get to sync together well.
@
No comments:
Post a Comment