Evolution of the Ogvidius Website Design

If you follow me on Twitter, then you'll have probably heard a lot about the website redesign. It's still in progress and set for a new year release. But I thought in the mean time I would take a look back at all the previous designs of the website. From the initial ideas and designs to the one that I'm currently working on.



I've done a tiny bit of web design before, (mostly very simple layouts, and made in the design view of dreamweaver) but it was only at the start of 2009 that I started learning proper XHTML and CSS to design websites. I found it quite addictive, and set off designing my own portfolio website straight away. This meant that the first version wasn't that great, but it was good practise.

WEBSITE 1

My first website design was very simple, and very messy. It used tables *shudder*, rollover images and some very awkward coding. But probably the worst part of it was that, apart from the home page, no other pages actually worked.

WEBSITE 2

A slightly refined version of this design. My original layouts had the navbar at the top coming out from the 'hello' image, so I called upon the help of a friend, known to the internet as 'The Fuzzball' who is brilliant at this kind of coding stuff, and he basically showed me what to do, and did all the tough bits. I now had a website that looked like the original design.

But with no actual content. So that wasn't much use

WEBSITE 3

The first website that was actually usable, and looked quite good! I found a great article on Function called 'How to spot quality within website design' Which is a brilliant article, and was probably the first article that got me hooked on graphic and web design blogs.

I followed that article as best as I could at the time, taking care of spacing, pixel details and type, and made a much simpler, cleaner looking version of the previous website. The website was fast, simple and fully functional. But my favourite feature was the lightbox.

Lightbox let me create an efficient design page that allowed users to click a thumbnail icon and have the design pop up with a nice fancy animation, fading out the background to make it clearer. I still use it in my website now.

WEBSITE 4

I started this design shortly after the previous one went live on ogvidius.com - I wanted something a little more fancy and designy, seeing as it was a website for designs, videos and animations.

I was very happy with this design, and managed to put another fancy feature in. The slideshow on the front page. This was a great feature that meant that users could see my favourite content as soon as they arrive at the site, without scrolling or clicking. The header was fancy and gradients were used all over the place.

I kept this design for a couple of months before the itch to redesign started again.

WEBSITE 5

Being new to website designing meant that I was still enjoying it and wanting to keep going. I wasn't doing web designs for clients, so my own website became my playing grounds. It was still a brand new website at the time anyway and was only really visited by friends and family.

So this design became the result of my fiddling. A sleek blue gradient, glossy borders, a 3D icon thing, a slider, floating stickers and twitter birds, a real contact form and a nice footer too. It had quite a lot of features and looked like a lot of other websites that were around at the time. But not quite as good.

WEBSITE 6
More of a revamp than a redesign. I changed from a stripey linear gradient to a more radial light, a deeper blue background, a new logo, and a new border which was a bit more box-like and glassy.

At the time of writing this post, this is the current design. But of course, there's another one in progress.

You may be wondering why I'm doing yet another design when the currentl one works perfectly well. Well, firstly, it's fun. Secondly, the current design doesn't give me much space to do things. All the content is floating in the little box in the middle, and I want to widen the space and give me more room to play with. Thirdly, the current website is very much following current web trends, and while the new one does too, it's also much more original, with some of my own ideas. I feel like a much more capable web designer now and I want to take on bigger challenges. I'm adding more features, such as each design having it's own page, with information on the brief and the client, as well as a slideshow of all the different parts of the design. So I'll end with a couple of teasing screenshots of the current progress so you can see what it will be like when it's done.

 

 

 

Thanks for reading, and expect the new design in the new year!