Wolseley Annual Report, 2010
I got the Wolseley Annual Report project while working at Radley Yeldar. It was my first real annual report (I have done half-reports before), and had a very talented (if not mildly insane) designer coming up with some elaborate mockups. It was my job to turn those designs into workable markup, functionality, and pizzaz.
Details…
Layout Highlights
The layout was one of the more unique ones I’ve ever worked on. There was a lot of strong lines and a lot of images that broke out of the grid that was applied to it. I was also given the green light to use some CSS3 attributes for some of the smaller styles (shadows, mostly). I’m really happy I got this design to work with, because it really gave me a challenge and something to work towards.
I’m really happy RY is willing to push things a little with some of the more forward-facing technologies that emerging, and Wolseley was the first project that I really got the go-ahead to use them.
Back-end highlights
While I am a front-end developer at RY, previous job placements have graced me with a reasonable amount of ASP.Net and C# knowledge. Because of this, I was doing double-duty for the markup as well as the beck-end functionality. While advancements have been made at RY for much of our internal framework, a lot of it was at this point untested, and I found I had to get creative with some fixes to get things going.
If that wasn’t enough, we were also using a new system of content integration that hadn’t been used before, and I wrote the whole extraction and presentation system. It as a bit rocky at first, but by the end of the project, we had a rather successful presentation system that wasn’t database-dependant or totally flat-file. Win-win for an annual report site.
Front-end highlights
As well as the back-end challenges, I was also the only developer for all of the front-end interaction. I was given a couple run of the mill tasks (sliders, accordions, etc) that I have developed into re-deployable plugins using jQuery. I also had a couple interesting challenges that took a bit longer to develop.
The first interesting portion would be the Corporate Governance page, which required me to develop a sort-of-but-not-quite a fader plugin that could swap between the different people and display their information. This proved to have some interesting complications due to image loading and how the different browsers handle that. Have a look!
The second, and by far the more complicated item I had to create was a a handle-slider with smooth transitions, transforms, and a graceful fallback. This required some hacking together of different components out there (such as the UI slider by the jQuery UI team). The end result worked out great, though it took some head-scratching on my part to figure it out. I have since been able to turn this into a re-usable jQuery plugin for use in future projects. Gander!
Overall, the client was pleased with the end result, and we were as well.
Website - http://annualreport2010.wolseleyplc.com/