'Print & Pixels' possible web layout

Becky

Becky

Member
Hopefully you guys can shove me in the right direction. I really need to get together a decent portfolio site (I've got a one-page holding "site" up at the moment).

I've been fiddling around with this in Photoshop and am wondering if I'm going in the right direction.

Bear in mind, it's not a finished comp. Things like the sidebar and footers still need a ton of work and 'styling', the colours aren't set in stone, and some of the alignment might be slightly out, but it's a start.

However, I think it needs to be seen from a p.o.v. other than my own. Thanks :)


Print&PixelsWireframe01.jpg

(Full-size view here: http://www.printandpixels.co.uk/holding/Print&PixelsWireframe01.jpg)
 
i think widening the footer would help me view it better.

but what about some contrasting colours?
 
Becky, although you've used the 960 grid, you've not aligned your site to it. For example, your top two images don't align with your large image at the bottom. Your "latest post" text aligns with nothing. Your main navigation is floating. Your Twitter feed has no relationship to anything else.

The guides are there to help you line stuff up so you could follow them if using them. Sorry if that sounds patronising, but I'm just making sure you know how to use the grid system. Start by aligning the top two images with the large one at the bottom but make sure that all three images are aligned to your guides. It might be a good starting point.
 
cool :)
basically, i'd like to see the navigation underneath the logo or if at the side at all, make sure the logo is the first thing introduced, and *cleanly*

also, try spreading it out way more, and come up with some subtle gradients somwhere, maybe even keep the purple, but introduce in a calmer way...? (does that make sense)

cut the nav to a few words, you dont want one option of navigation all on it's lonesome out in the middle of nowhere.

check the padding on each h1, h2, or whateve.r...
 
the padding on headings will be sorted in the coding phase, I'm not going to religiously space them in photoshop :p

Was trying to steer clear of gradients, but I added some subtle ones and it looks ok. But I'm still not convinced on the colour. However, that's a minor issue.
Print&Pixels2.jpg

 
Hi Becky,

Try changing all your placeholder/copy text to Arial, regular, 12pt with anti-aliasing set to 'None', at the moment the placeholder text looks very heavy and is making the layout look a bit heavy (which wouldn't be the case if it was coded)

Greg
 
Print&Pixels3.jpg


better? The footer looks really bulky now though :| I think I just need to go work on what I'm going to put in it now, will probably help balance it some more
 
I'd personally lose the gradients, also look at incorporating a background so you can figure out how that will work in relation to the layout you have. Agree it's time to use some more real content, this will give you a better idea on how the layout will actually work.

With the 'Latest Post' will this just be a blog or a work updates thing? Just as you have given a lot of pixel 'real estate' to the latest post image in comparison to your featured work. Try and consider the reasons why people will be visiting your site, as a freelancer I'd say the majority will be there to see your portfolio of work :)

HTH
Greg
 
A little of both on the updates. I'm not entirely sure I'll be getting a lot of freelance work to be honest (knowing the area I live in) but that's a good point.

I'll switch the ratio a bit, going to 'sit' on the design overnight, and probably have a bit of a re-think
 
ya they're an option. early days I guess. I'll have a mess around. going back to the drawing board
 
i really like how this has improved and gone forward :)

another good example of needing to listen to people's advice!
 
Fab improvement. Nice work Becky.
I prefer the layout in this latest alignment but I would prefer the old navigation back in the sidebar. (just to be awkward)

x
 
tim said:
i really like how this has improved and gone forward :)

another good example of needing to listen to people's advice!
Click to expand...

these forums are fab :)

HippySunshine said:
Fab improvement. Nice work Becky.
I prefer the layout in this latest alignment but I would prefer the old navigation back in the sidebar. (just to be awkward)

x
Click to expand...


Tsk, there's always someone :(

Disclaimer: still not set on a colour scheme :p The one it has in the jpeg isn't what I'm really after. I'm going to have a play with kuler later as well as go and jot some ideas down for the footer, aside adding contact info of course.

Having ones work hours reduced and the house to myself for the weekend is a bit of a blessing in disguise :D

Print&Pixels4.jpg



(just noticed that the colours are very similar to hippy's pixel boutique, it's non intentional, I assure you :p.)
 
I have taken alot of feedback of this site, so time to give some back

Firstly I love the logo and your branding, love the grid system and new alignment, and colours!

My only really issue is the 2 nav sections, I think they are so close to each other, that its overkill...

Other than that, if you could clear up the pixelated effect on the end of the bars, you will be on to a winner...

Just my opinion...
 
Thanks for the comments. I've been playing with it some more. I'm not really sure I want a background to be honest and I've yet to clean up the pixelated nav bar. going to stick it in illustrator during the week and make it a bit cleaner and more subtle.
Also the footer still needs work, but it's getting there, I'm not in a huge hurry to get this up, so I can afford to keep tweaking it. :)

w/o background
Print&Pixels5.jpg


w/ background
Print&Pixels5b.jpg
 
Honestly I prefer the pink to the green. I also don't like the pattern behind the text area. As to the background how about a halftone gradient so it has that 'pixel' feel, might need to get the scaling right on it though. But I'd keep the pixelated bar plain if you go this route as it could be overkill
 
You must log in or register to reply here.
Back
Top