I’ve been a little lax at posting, so here is the first of two updates on recent WordPress projects I’ve produced at the end of 2009.

Since 2006, I’ve maintained a WordPress site for SMASH (Solihull Methodists Acting and Singing in Harmony), an amateur dramatics group based at Solihull Methodist Church. The site contains a photo archive of past productions and a blog about the group’s activities, such as upcoming shows, rehearsal information and ticket booking.

At the end of 2009, I updated the site with a new information architecture, making better use of WordPress categories to organise content across the site.

The site also has a fresh, new look more in keeping with the world of theatre. I used Justin Tadlock’s Options theme, a magazine-style theme ideally suited for a community organisation. I then tweaked the theme’s CSS, adding a new colour palette, type scheme and background image.

Here’s the new home page:

Screenshot: updated home page design (November 2009)

View the live project at www.solihull-smash.org.uk.

Skills used on this project

• Typography
• XHTML
• CSS
• WordPress
• Content management
• Photoshop

James Wood recently set up his own business specialising in recruitment and executive search within management consultancy and professional services. He wanted a simple CV-style site that clearly explains what he does. I designed this one page, all type, site for him. View the live project at www.jameswood.eu.

I designed the layout, wrote the XHTML and CSS, then attached it all to CushyCMS so that James can make changes to the site content himself.

Screenshot: www.jameswood.eu

The idea behind the design is to communicate the information as clearly and simply as possible. It’s all about giving the visitor the key information quickly and removing the need to browse using a traditional site navigation.

To do this, I concentrated on careful typography to structure the page layout and provided jump links at the top of the page for the visitor to skip down to the relevant section within the page.

Skills used on this project

• Typography
• XHTML
• CSS

Hillu Liebelt, a London-based textile artist, has produced a new series of tapestries and textile sculptures. First exhibited at the Hishio Centre for Cultural Exchange in Katsuyama, Japan, Hillu’s new exhibition entitled ‘Delicate Matters‘ begins a new tour in the UK this month.

‘Delicate Matters’ is showing at the Platform Gallery in Clitheroe, Lancashire from 24 January to 7 March 2009. The exhibition can also be seen at Black Swan Arts in Frome, Somerset from 9 May to 13 June 2009.

To coincide with the new tour, Hillu and I have worked together to update Hillu’s portfolio website with images of her new textile artworks:

• New cuttings gallery
• Eight new tapestry works
• Two new works in sculptures and models
• Photos of Hillu’s ‘Dance’ sculpture installed at her recent exhibition in Katsuyama, Japan

I originally designed and built Hillu’s site in July 2007 using WordPress as a CMS, which I ’skinned’ with a bespoke theme. The image galleries are built using the Popup Image Gallery plugin by Andy Staines.

Updated home page design www.hilluliebelt.com (January 2009)

Updated tapestries gallery (January 2009)

Skills used on this project

• Digital photo editing
• Content management
• Graphic design
• Photoshop
• XHTML & CSS
• WordPress

Related posts

• Original website design for Hillu Liebelt
• View more projects using WordPress

Over the last few months, in between client work, I’ve been beavering away to transfer my static portfolio site over to WordPress and spruce up the visual design. At last, the new site is ready.

There are some areas that I’ll tweak further over the coming weeks, such as designing the comments in a more interesting way.

This is also an opportunity to start writing my own blog (well overdue, I know!), in addition to showing examples of my web and email design work. I’m planning to write about web and email design, tinkering with WordPress and other adventures in maintaining websites and web content.

This updated portfolio design, the fourth version, sticks with the green colour palette of version 3 yet makes heavier use of the green elements. The green and white palette is mainly taken from the British racing green Mini Cooper, with some influence drawn from the twilight woods in Guillermo del Toro’s film Pan’s Labyrinth.

Photo of Mini Cooper courtesy of Toni Viemerö

I’ve also chosen to use a dark background to provide some contrast and shape to the blog, while keeping the bulk of the actual content on a white background.

The portfolio navigation in the sidebar to browse by project type or style makes use of WordPress’ categories.

So, here it is. Time to stop the CSS tinkering — I’ve gone as far as I am prepared to in making the site compatible back to Internet Explorer 6 — and time to go live.

I’d really appreciate any feedback on the new look and navigation. Please do add a comment or get in touch.

I delivered the full website design, which was then integrated with the client’s existing content management system and vacancies database by Aim Internet. View the live site at www.mwn.co.uk.

About us page design

Skills

• Project management
• Photoshop
• XHTML & CSS
• Flash

Behind the scenes, the site is integrated with an email newsletter system and the client is using WordPress as a content management system. View the live site at www.ladderconsulting.com.

Home page design

Closeup on home page footer

Logo design

What the client said

“One of Gavin’s main strengths has been his ability to really understand, and help me clarify, what I wanted to achieve with my site and then in bringing ideas on how to achieve this. He’s very supportive and I’m looking forward to working with him on my email campaigns. Highly recommended.” Joan Henshaw, Ladder Consulting

Skills

• Project management
• Photoshop
• Illustrator
• XHTML & CSS
• WordPress
• Flash

Hillu’s site runs on WordPress, which I ’skinned’ with a custom WordPress theme. The bulk of the site content is contained within seven image galleries of Hillu’s textile work. The archive of gallery images was edited in Photoshop for levels, colour, contrast and sharpening.

View the live site at www.hilluliebelt.com.

Home page design

Gallery page design

Credits and plugs

The image galleries are built on the Popup Image Gallery WordPress plugin by Andy Staines.

Skills

• Digital photo editing
• Content management
• Graphic design
• Photoshop
• XHTML & CSS
• WordPress

View the live project at www.prweekes.co.uk.

View the live project at www.solihull-smash.org.uk.

The site contains an archive of previous shows

The SMASH site contains photo galleries of all productions to date, reaching all the way back to their first production in 1988. All of the existing digital photo files were edited in Photoshop for levels, colour, contrast and sharpening.

A photo gallery from the SMASH production of Goodnight Mr Tom in 2003

Credits and plugs

The SMASH site uses the Almost Spring WordPress theme designed by Beccar Wei. The photo galleries use Gavin Barker’s Litebox plugin. The SMASH discussion forums use Simple Forum by Yellow Swordfish.

Skills

• WordPress maintenance
• Photo editing
• Content management

View the live project at www.andrewcookson.co.uk.

Home page design

Photo gallery design

Credits and plugs

The JavaScript photo switching code is based on Craig Grannell’s case study in Foundation Dreamweaver MX 2004. The PHP form is taken from Phil Sherry’s book Foundation Mac OS X Web Development (both published by friends of ED).

Skills

• Photo editing
• Photoshop
• Fireworks
• XHTML & CSS