Take a look at the design of my online portfolio & blog

[sunils]

Wow a new idea. I liked the design. Its totally different for what i have seen till now..

 

[jayuk666]

how will you convert this into html!!!
you did it with photoshop right?

I have not done much with this project at the moment but I have converted this to HTML using transparent PNG's, Hotspots and rollovers. At the moment in IE 7 & 8; Firefox, Safari, Opera and Chrome it looks great. But the PNG's do not show up in IE6 so will need to input a rule for IE6. But it is looking good at the moment.

Assumably, you're looking at exporting the theme for wordpress? Draft 2.5 sure looked tediously difficult to replicate on a wordpress theme haha.

Perhaps you're going for the cluttered look, though I feel that the bkg image used is rather off. Just my opinion.

I have never dealt with WordPress before. Just standard HTML/CSS sites. I have converted this into dreamweaver successfully as I described above but I am still yet to read up on Word Press. This is for a college assignment and is my third site so still working on it at the mo

I like it, nice job.

Thank you very much

Wow a new idea. I liked the design. Its totally different for what i have seen till now..

Thanks . There a few homemade style designs out there. I got inspiration from a few so by all means, I did not come up with the 'cluttered desk' theme. But i personalised it to what my desk is like along with my items and student ID

 

[gulonline]

good

 

[freecrm]

I quite like it, although it's not radically new.

I use PS CS3 and DW and I can see that splicing that lot is not going to be easy!

If you're having problems with IE6 and .png files, why not try gif's with dithered edges?

I, like Neil, want a timestamped photo of your desk!!!

Looking at the photo you've used, I would say you've used a remote, diffused bulb setting and a long focal distance shot at high magnification to gid rid of any lens distortion. Of course, to get this degree of definition in the grain at that distance, you would also need a tripod. But of course, you knew all that anyway!! LOL

In all seriousness, I like the look and I think if you achieve it in html, you've done very well indeed.

Good luck.

 

[jayuk666]

I quite like it, although it's not radically new.

I use PS CS3 and DW and I can see that splicing that lot is not going to be easy!

If you're having problems with IE6 and .png files, why not try gif's with dithered edges?

I, like Neil, want a timestamped photo of your desk!!!

Looking at the photo you've used, I would say you've used a remote, diffused bulb setting and a long focal distance shot at high magnification to gid rid of any lens distortion. Of course, to get this degree of definition in the grain at that distance, you would also need a tripod. But of course, you knew all that anyway!! LOL

In all seriousness, I like the look and I think if you achieve it in html, you've done very well indeed.

Good luck.

Just to make it clear, I did not take any pictures of my own although my father has the equipment as he is a professional photographer. I just pinched the images from Royalty Free sites.

But all items that are in the design were on my desk at the time ;-)

This design is by far not fresh it has been done endless amounts of times. I just made i personal by using items I have and creating my ID car with me on it ;-)

It was a challenge splicing at first but I did the background separate, and the rest spliced as PNG's. Then I had to do rollover separate again. I will load the site online so it can be tested as it is far from unfinished.

But thanks for the comments ;-)

Oh and i tried Gif's but couldn't get the quality good enough and the edges were white and jagged?
Edit:
Here is a live demo of my design:

CLICKY

Issues found so far:
JQuery PNG fix for IE6;
Optimise site for faster loading times;
Create rollovers for banner;
Create rules for certain browsers so that page displays correctly.

Need to fully test in all browsers
&
Need to look into WordPress and how to make this into a live Blog!

 

[jayuk666]

UPDATE:

From some feedback I have decided to add more stuff to my design to make it more interesting. Plus this also fills the desk more

I also wanted to add a side navigation section as an extra option for those not wanting to use the top interactive navigation.

I wanted to shrink down the banner as it was a little too big and in-your-face!

Here is my latest Design:

 

[JuniorD]

What kind of idiot would tape a sticky note to an expensive gadget? Ha. Good work.

 

[jayuk666]

What kind of idiot would tape a sticky note to an expensive gadget? Ha. Good work.

Lol that would be me ;-)

 

[qouop]

:biggrin: :biggrin: :biggrin: :biggrin: :biggrin: tnx man

 

[redivy]

Wow, this is really good!

I never really did anything spectacular at webdesign :happysad:

 

[jayuk666]

Wow, this is really good!

I never really did anything spectacular at webdesign

Thanks.

I need to finish this design and get it Live! Just been busy finishing my first year at college!!!

 

[pplsearch]

It's a creative look, definitely different from about 95% of the websites out there.

However, I have an issue with the text orientation. The menu items on the top are posted onto the items, like the mouse for instance, in a crooked manner. I have to tilt my head to feel like I know where I am at. I would suggest at least rotating all the menu items so that the text is horizontal and not slanted.

 

[jayuk666]

It's a creative look, definitely different from about 95% of the websites out there.

However, I have an issue with the text orientation. The menu items on the top are posted onto the items, like the mouse for instance, in a crooked manner. I have to tilt my head to feel like I know where I am at. I would suggest at least rotating all the menu items so that the text is horizontal and not slanted.

This has been fixed and should be more eye-friendly! :drool:

 

[whizynix02]

nice job there... can i see it when it's done and uploaded ...

 

[leafypiggy]

It's much too big. The navigation takes up my entire screen (1280 x 1024).

The normal user only looks at the first screen (the page without scrolling at all), so you're just throwing away most of the people that visit your site.

I see there are still a few issues with the site, so I'd maybe go into photoshop and either re-design, or think up a new concept. It might look better if it was more of a fixed width, I'm not sure, it's just not looking good in my eyes.

 

[fraggie]

great job, looks creative.

 

[theBruney]

Looks great, now make it into HTML and powder it's nose with CSS and then we'll really have something.

 

[mjserv]

Awesome, these are very creative styles. Couldn't imagine slicing the whole thing. Sometimes slicing takes longer than the design itself.

 

[bonbon]

@Neil Hanlon, are you a we/graphic designer?

 

[bradym]

I love it! I want to do something like it for my classroom web page. I'm a 6th grade teacher who' s known for his very organized classroom, but a very unorganized desk. I never lose student papers, but I can never find my own! so I would love to make the front page of my classpage similar to what you've done. I use Dreamweaver 2004. Can you give me some tips to get me started? Thanks.