A very creative year so far …

Right Twin - week 19
Right twin at 19 weeks

In many ways 2008 has been a very odd year for me, for many reasons. Of course it opened with the IVF procedures that led to Jane discovering that she was pregnant, that led to us discovering that she was pregnant with twins.

During the last six months we’ve been filled with delight, trepidation, excitement, nervousness, wonder, a whole spectrum of emotions. And here we are now at week 27.

For those who don’t know, a full-term pregnancy is generally regarded to be 40 weeks. Twins, we’re told, generally make an appearance early, round about weeks 35-37. So we could have another 10 weeks; we could have more, we could have less. We’ll continue to trust God, and wait in quiet expectation.

I was born to reflect and not shine

It’s been a funny year where I’ve blogged a whole lot less, but gone out and done a whole lot more — but then didn’t come back here and share it with you all … sorry about that, but I guess I’ve needed that time to reflect. I’ve felt myself go deeper within myself — go into my ‘cave’, Jane might say — and reflect on where I am, who I am, and what it means to be expecting children: two, at once!

I’m not entirely sure where I am, or what to expect, it’s all a very new experience for me. But one thing I can say with certainty is that I’m really looking forward to meeting the boys now, and I’ll certainly give it my best shot.

I learned a lot of good things from my own dad, hopefully I can pass some of that love and laughter on to my own boys, and make up some weird nonsense of my own to hand on to them!

I just really wish that Dad was still here to meet them too when they arrive. (Again, for those who don’t know: my Dad had a triple brain haemorrhage in 1983, was really quite ill for about 15 years and died shortly after New Year in 1998. Ten years ago: another contribution to the oddness of 2008.)

New design

But 2008 also opened with another creative process: the redesign of the University of St Andrews website, which was launched to the public (having been in what I guess we could call ‘closed beta’ if we wanted to go all Web 2.0 with y’all) last night.

Here’s a screenshot of the external homepage:

Screenshot of University of St Andrews website
Screenshot of the new design for the University of St Andrews website.

“But… didn’t you just launch a new design last year?! Why do you need another new design?” Quite a few folk have asked us that over the course of the last few months, and it’s a good question to ask.

When we did the first relaunch of the University site it was more than just a new visual design, it was a completely new website: new design, new architecture, new way to update and manage the content, new … everything.

We designed and built the site according to the excellent wireframes that had been developed in collaboration with us by Dynamic Diagrams, an information architecture company from the States. They were great, we learned a lot from them, and for me that was one of the most exciting parts of the project.

Listening

But like any design, the then-new design was a “best bet”, it was the closest that we got to what we perceived we would need from the site. So we built it, launched it and let it settle in for six months while all the time listening for where the design wasn’t working properly, where we needed more flexibility, and crucially: what the users were asking for.

We got a little more explicit by inviting both staff and students to feedback sessions over lunch, where we bribed them with food to tell us what they really thought of the site, what they liked about the site, what they felt could be done better, and what was missing.

I went into those sessions expecting to feel very defensive, but came out of all three sessions feeling quite buoyed and encouraged. It felt good to listen to our ‘customers’, and from the feedback from those sessions mixed in with our own collation of ideas from helpdesk calls, as well as our own thoughts and observations we set about redesigning the site. And this time we didn’t touch the structure (much), we looked instead solely at the visual design and its functionality.

New design

We wanted something that was:

  • Clean, fresh and contemporary
  • Not too far from what we already had
  • Easy to maintain, and extend
  • Compatible with the most number of browsers (old and new)

The site itself is built on the Blueprint CSS framework, with a number of tweaks, which helped us address most of these requirements.

What was particularly impressive about Blueprint was how it allowed us to ‘sketch’ designs in code faster than we were able to do it with a graphic design package. And nothing looks more like a web page than a web page!

So for the last seven months or so I’ve been diligently working on the code, often times taking it home to work on in the evenings and at the weekend. I’ve working on it some nights past 01:00, and some mornings before 05:00.

It really has been a labour of love, but then … I believe in the University of St Andrews, and I love my job. St Andrews is where I did my undergraduate degree, I feel an incredible loyalty to the place and sincerely want to do the best for the University.

Launch

So at five pm last night we scheduled the new site to launch … and ran away!

At home we waited with baited breath while the new design for the University of St Andrews website was published to the public web server, and then breathed a sigh of relief that we’d got most of the planning right.

There were a couple of sections (sport, music, UTREC) that we’d overlooked and had published out with the wrong design, but on the whole it went without a hitch.

… until there was a serious power outage in St Andrews during the afternoon today and all our systems (including the web server) went down! You can’t have everything … like a new design and the ability to look at it!

And relax!

Flight of the navigator

Today’s big task at work will be to keep working on coding the left-hand navigation for our new website design.

Disappointingly I don’t appear to be able to acheive the design that I want using CSS alone, due to the extraneous code that our content management system software adds to the unordered-list — it throws in a span tag with a class of “current<whatever>” between the li and a, which just throws my design by about 2 pixels, but enough to notice.

I’m loathe to use JavaScript to achieve the result, so I’m going back to the drawing board … [puts on thinking cap] … hmmm.

Navigation

Compass
Photo by CanadianSc at stock.xchng.

Today was one of those days where you know that you need to get something done, you know that it’s important, you know that it really needs to be done as soon as possible but … well, it’s like going on a journey where you’re not entirely certain of the destination or how you’ll get there, but you’ll know you’re there when you arrive.

That image of navigation was quite a useful one to have in mind because the task in hand was to redesign the left-hand navigation on our new redesign of the University website.

Current

At the moment we employ a navigation design that relies on left-hand markers to indicate at which level you are in the site hierarchy. It looks like this:

Example of left-hand navigation

The main criticism that we’ve had about this design is that there’s not enough contrast between the text and the background, which is a fair comment.

We also feel that there is not enough indentation between the different levels of hierarchy to make it absolutely clear which level belongs with which, especially when you get down to the 4th or 5th tier.

And the whole sorry mess takes up too much room.

Work in progress

So today I’ve been working on a new design, based on the navigation designed by my colleague Steve for the University’s sport website.

This is as far as I’ve got — it’s a work in progress, hence the non-sense text and random labels.

Work-in-progress example of navigation

The miracle is that by the end of the day I had something that works down to four levels, and works in Firefox 2, IE6 and IE7.

Tomorrow will be a day of tweaking, and testing it down to six levels … not that we really want six levels of site hierarchy. I sense a rearchitecting of bits of the website coming on!

That and bed!

Book on WordPress theme design

Packt Publishing have a new book on WordPress theme design:

“This book walks through clear, step-by-step instructions to build a custom theme for the WordPress open-source blog engine.

The author provides design tips and suggestions and covers setting up your WordPress sandbox, and reviews the best practices from setting up your theme’s template structure, through coding markup, testing, and debugging, to taking it live.

The last three chapters cover additional tips, tricks, and various cookbook recipes for adding popular site enhancements to your WordPress theme designs using 3rd-party plugins as well as creating API hooks to add your own custom plugins.

Whether you’re working with a pre-existing theme or creating a new one from the ground up, WordPress Theme Design will give you the know-how to effectively understand how themes work within the WordPress blog system enabling you to have full control over your site’s design and branding.”

Gloucestershire Zeitgeist

Crisp on cheese on plate

So there I was, playing with my food at lunch and I appear to have accidentally created the next Turner Prize.

For those who might not know about the Turner Prize:

The Turner Prize is a contemporary art award that was set up in 1984 to celebrate new developments in contemporary art.

The prize is awarded each year to: ‘a British artist under fifty for an outstanding exhibition or other presentation of their work in the twelve months preceding’.

Explanation

My piece is entitled Gloucestershire Zeitgeist.

The piece of cheese (Gloucestershire with herbs) is fashioned (by biting into it) into the shape of a saddled horse; it represents nature.

The potato crisp (an original Pringle) represents a sail, capturing the spirit of the age, the zeitgeist. It reminds us of man’s creativity through technology. Not always a good thing.

Together they represent humanity’s mistreatment of nature: like attaching a sail to a horse, which is clearly wrong.

The blue plate represents my desire not to get cheese on the table.