Facelift for friskdesign.com

Well it’s taken me quite a long time, but I have finally finished my re-design of friskdesign.com!

The new site has a much better portfolio than the old one. Now, the emphasis is put on my work — the homepage has a nice big slideshow and there are myriad ways of accessing the folio through various menus, options and random content in the footer. With the old site, you couldn’t really see good screenshots until at least three screens in so I’ve rectified that big time.

The structure and design came out of a lot of tinkering over the last few months. I had originally decided to take a rather classic, simple approach but upon consideration I realised this would be too much like the old site. I decided to instead go all out on a design that had a bit more visual appeal.

After a few false starts, I eventually came up with a simple layout that best presented my work. Experiments with colour schemes yielded varying results but the one I finally decided to use was this:

Frisk Design : Intermediate Homepage

Although I was quite happy with it, it still felt a little flat. It needed some ‘ooomph’, so I decided to jazz it up a bit. I opted to remove the boxy feel by introducing background imagery. Playing around with Photoshop, I came up with the colourful sweep and the sparkly dots — not something I had planned on, but I rather liked it. And once I realised it looked rather like the ocean at play, the sea theme came from there…

As for the functionality, everything you see here is done in WordPress — it powers the whole site. I wanted to use this site as a test bed for trying out some techniques using the built in functionality. Plugins are great, but some of them are quite bloated for doing simple things and I was sure that I could avoid a lot of plugins by coding my own simple functions.

With a bit of research, I got the site working exactly how I wanted. The main issue had been that I didn’t want to mess around with images too much, and it was essential to have a way of re-using the images from each folio entry, in particular within the slideshow on the homepage. That took some time to understand how WordPress Image Attachments work, but once I understood their rather odd properties, it was straightforward.

So the site is up and running and I’m pretty pleased with it. I’m going to write some entries over the coming weeks about how I achieved certain things, so if you’re interested in that, stay tuned. And it’s about time — rebuilding this site has prevented me from blogging for the last two months, so I’m keen to get back into it.

15 thoughts on “Facelift for friskdesign.com

  1. Brilliant website, really really love the “sparkles” ocean effect at the top.

    Found via CSS mania, easily the best website I’ve seen on there in a few months!

  2. Hi Alan, thanks for the comment. I do indeed have some blog posts in the works for showing how I did certain things — I’ve simply been too busy to publish them yet. :-)

  3. Hi Stephen, thanks for the nice comments — I’ve been very pleased with how quickly I’ve been linked to through the interwebs; I’ve hardly promoted the new site at all yet! :-)

  4. Hi Matt, I found your site via Google by doing some research on fellow WordPress designers.

    I really like your site – very stylish and unique, definitely the best site i’ve seen for a while.

    Keep up the great work :)

  5. Hi Will, thanks for the kind comments. Glad you’re enjoying the new look site. I’ll be getting back to blogging properly in the next few days, which will include some posts about how I went about the re-design. Stay tuned!

  6. Pingback: Frisk design : Standards Compliant Web Design » Wordpress killing my Memset Miniserver?Edit

  7. Hi Matthew. This site is really nice work; I especially like the type as well as the great background. Found your site in Web Designer Wall’s post on 80 large background websites.