Have you done something different with the place?

By John Faulds

Why yes we have, thanks for noticing. After about six years, several attempts including a couple of false starts, and some that only got part of the job done, this site has finally been redesigned. Tyssen Design is now in its third incarnation since having first launched in 2005 (you can see screenshots of the previous two versions below), and the biggest changes are making the site mobile friendly (which has come to be known as Responsive Web Design), completely overhauling and enhacing the portfolio, pushing the boundaries of what can be done with CSS instead of images, and finally making the whole thing run on ExpressionEngine (EE).

It is said that the old saying ‘the cobbler's children have no shoes’ is often quite relevant for web designers/developers and their sites, with those in the business either being too busy working on other people's websites to have time for their own, or being too critical of their own work to ever be satisfied when they do find some time, and that's certainly been the case here too.

After having thought about it for some time, the first tentative steps towards actually doing something began in January 2010. That first step was to install ExpressionEngine. I'd already been using EE for several years by then, using it for the majority of the work that I do for clients, but the site was still running on Wordpress which was introduced at the time of the previous redesign in 2006.

Screenshot of version 1 of the Tyssen Design website
Version 1 of this website from 2005
Screenshot of version 2 of the Tyssen Design website
Version 2 of this website from 2006 which was powered by Wordpress initially

The story over the next two and a half years (with numerous periods when I was too busy with client work to do anything on it) went something like this:

  • Analyse the site content to see what should stay, go or be rewritten.
  • Create site wireframes.
  • Don't get anything done for seven months.
  • Upgrade EE to version 2 (a major process since version 2 was a complete rewrite of the CMS).
  • Update HTML for some pages including HTML5 tags that weren't around when the previous design was done, and toss around a lot of different ideas about what I wanted to do with the site and how it should work.
  • Start work on some designs, but get discouraged by nothing coming out right and put it aside for a while.
  • Take a completely different tack to blow out the design cobwebs, and start work on my personal blog instead.
  • Update most of this site to work with EE first (except for the blog which remained on Wordpress because there was a lot of content to import and convert) so that both the new blog and this site could be run from the same installation of EE using the Multi-Site Manager.
  • The new blog goes live in June last year.
  • A busy period of publishing articles on the new site follows.
  • Don't get anything done for another seven months.
  • Import the rest of the blog content from Wordpress into ExpressionEngine and also migrate comments to Disqus.
  • Redesign the logo for the site.
  • Send out a survey to clients asking for feedback on their experience in dealing with us in the past. Some of this would find its way into a second rewriting of the site content that would soon follow.
  • Redo site wireframes.
  • Finally come up with the basis for a design of the site that I'm happy with (just header and footer).
  • Work out grids and code up foundational HTML and CSS.
  • Design the rest of the sections of the site one by one in the browser.
  • Browser testing including mobiles and informal user testing.

And so that brings us to today with the public launch of the new design. I hope you like it. If you don't, or have noticed something that doesn't work quite right or that could be improved, please let me know in the comments (oh, feel free to let me know if you like/love it too ;)

I hope to write one or two more articles detailing some more of the specifics involved in different aspects of the redesign process, so if you have an interest in design and development sort of topics, subscribe to the feed or follow me on Twitter for updates.