Design: the story
As I said in my previous post, each step of creating this site has a story. Today I’ll show you the very first steps of it. I had in mind something very simple, clean and easy: but in time I’ve designed more and more.
These are just the pre-final sample, more others were made before this - totally different than what you’ll about to see.
The grid
First of all was the grid. I had to design everything is such way to make the .html part a breeze.
I’m using 960 grid system - one of the best; easy and very simple to use.
So, the first step:
![]()
Then I said to add some more color; to add an image or a copy. I added them both.
![]()
And I guess was too much. So, I cut the big image and decide to add more things from my portfolio. In the end, this is the main goal of this site.
So, it has 3 latest sample plus the project I’m currently working on. Also added some grungy background.
![]()
In time I decide that I need to bold even more the idea of a designer portfolio. So, I’ve added more samples in top.
Removed also some portfolio samples - I knew they were too much for the first page. Remove background too…
![]()
Then I’ve decided to take break and do something else. Like experimenting my new drawing board (Bamboo Fun); I know, it is small but just perfect (and fun) for a beginner like me. So, I start doing things.
The below design/drawing was made in .. 2 or 3 hours. I haven’t spent a lot of time thinking at it… just design. And colors.
And some effects after that. So, this way I came up with the below sketch.
![]()
The main drawing board pictures was the base for everything. From that single image everything start to build around it.
So, having this new asset, I said it is just perfect to add it to my website. And here it is:
![]()
For a few weeks I thought that will be the final form of the layout/design. But, I was wrong.
I said to make it bigger, to see what will happen if it will sit as background and no as an image.
The idea was that, if I’ll make it as an image, it will only sit on the front page.
So, one of the attempts:
![]()
And the final (as you can see it today)
![]()
I have exposed here the steps I took to this final layout. Here they are 7. In real life they were a lot more. And, because of the time
allocated for this project (weekend and late nights) it took me more than 6 months to achieve this final stage. And a lot more to prepare the content. I had time… nobody was pressing me. No deadlines were set. Not a real target to reach.
Was a real fun to delete everything after hours of work… and then start again from scratch. Again and again. So many times…
Just fun… pure fun.

