New Site - Bespoke Responsive Portfolio WP Theme

[gord]

Been working on a new theme for my portfolio site as the old one is looking a little tired. See tiredness: http://www.rcsmith.co.uk/

Also, I don't really like the structure of that site. I've rethought how I want to present my work. If I had to describe the new one, it's fairly minimalist. I've ditched the social media icons. Now the icons are all about the technologies/techniques used. Anyway, see for yourself: http://www.rcsmith.co.uk/impact/

Based on the twentytwelve theme, I ripped that apart and built myself a boilerplate for future projects. I then built what you see above on my boiler. I'm using twitter bootstrap as a framework. The various size/orientation combinations of my work always pose a challenge.

Still have some things to do. Custom 404, bit of SEO work. But it's presentable at this stage. Feel free to critique.

Oh, I've not done much old browser testing either... wouldn't hold your breath on that one.

 

[radderfire]

I like the Hey Not Too Bright video.

 

[dfarrall]

Not bad, but i hate the fact it takes up the full page width, feels un-natural.

 

[gord]

I like the Hey Not Too Bright video.

Thanks, lots of work in that.

Not bad, but i hate the fact it takes up the full page width, feels un-natural.

It's not a fluid full width design. It uses the bootstrap responsive grid so it's a fairly standard 12 column layout. Are you on a smaller desktop? Or is it the backgrounds being full width that you're not keen on?

 

[oulton]

From a non web guys point of view, it looks very nice

 

[ikillbears]

it looks a lot better when its shrunk. when its full size, as dfarrall says, feels weird. it still has a grid system but looks silly. like a jenga tower thats going to fall over. when its responsive to browser size it makes more sense as it stacks. i would design it more around that personally. that little grey box where you talk about your self. strange place to have it and the thin black bar going from edge to edge. not a fan

 

[fez]

I quite like it but the header section annoyed the hell out of me

When you flick your mouse across it you get an assault on the eyes with the search bar coming in, menu fading out and a lightshow in the background. I don't know if that annoys anyone else but if you want to change it slightly, have a look at a jquery plugin called "hoverintent". It allows you to set a delay on the hover events so you can say that a user has to hover over a section for 0.3s before the hover event is triggered. Its basically to stop unintentional animations when people are being liberal with their mouse movements.

 

[Limenote]

I think its pretty cool

 

[gord]

I quite like it but the header section annoyed the hell out of me

Someone's critiqued the old site...

Thanks for all the feedback so far. A good mix.

The jenga tower comment I'm not sure on. Which part are you referring to?

My grey box on the homepage is a little incongruous but it didn't fit anywhere else. The page needed to introduce what the site is about, and the styling. So the featured item uses the same dark band that the items use. The items use that because it's perfect for framing. Then I thought it really should have more body text for my introduction and I'll link that box over to the DNA page.

 

[dmsims]

I prefer the old site

 

[Wilkotron]

I think you've pulled off a good minimalist layout. Here's a brief rundown of what I "personally" think are positives and negatives, which I hope (on a constructive level) will help...

Positives
-------------------------------------------------------------
The logo stands out very well, without seeming too obtrusive.
The line separating the top bar with the welcome bar is brilliant and splits these two sections perfectly without any harshness- it's simple, but it works!
Like the mouseovers on the menu, they're discreet but serve their purpose
The three category boxes at the bottom look good, particularly like the shallow bands of colour used to define each categories respective colour-scheme and I like the method/languages annotations as well
- Footer is subtle, just as it needs to be- nice job
- Bytes & Canvas page's- nice, these both work well for me!
- DNA page- love the colour and what you've done with the icon rollovers

Negatives
-------------------------------------------------------------
- I think the main feature bar is too shallow- it could either do with being the same height as the other content pages or maybe pushing the Lambo picture maybe 20pixels into the welcome box and rounding the top two edges and adding a bit of shadowing under the top edge, as if it's standing up from the layer beneath it? just a suggestion!
- The text box that provides a brief description of you is fine, but it seems a bit lost or dare I say it "missable". Maybe it just needs a bit more padding?
- Nice colour on the DNA page and I really like what you've done with the icons (as above), but I can't help but wish the icons were lighter and more emphasised
- Canvas page my only critique would be to remove the third row of images and add some form of scroll functionality- there's too much black with three rows

I'll take another look through it when I get home in various browsers, see if I can help at all with browser bugs.

 

[gord]

Thanks Wilko, that's great feedback. On your negatives:

- The feature bar height is dynamic, defined by the text content so that the text doesn't float about next to the image. In order to amend that I'd need to bring in more text which I'm reluctant to do, but I can test it out. I'll think about letting the image escape the confines of the band too. That could work nicely to emphasise the featured item.
- That text box has been mentioned as odd and lost, so I need to do something with it. Considering it is about me I'm thinking I should accent it with the green, not grey. I may make the bottom row a 4 column layout.
- I had the icons as white before. I quite liked the subtlety of the darker ones, but I could try a light grey.
- The category sections will grow to 3, 4, 5 rows as I add more items. I may adjust the category to use 3 column layout for the items instead.

 

[Wilkotron]

You're welcome, anytime.

All sounds good. Look forward to seeing the changes you make!

On a separate note, how did you find Bootstrap? I've been looking at using it for a few weeks now, but haven't had time to take the plunge yet.

 

[gord]

It's so nice to work with. Quick to get up to speed because everything is documented well. I've integrated it into my boilerplate so all of my Wordpress projects will be using it. It's definitely worth checking out.

 

[helium]

Haven't got the chance to make a responsive site yet at work. Looks pretty good. Better when smaller.

Also when getting very narrow the feature image does some weird resizing / zooming. Obviously not a problem in real world where they wont be re-sizing their browsers.

Good job

 

[gord]

Cheers Helium. I thought someone would spot that here. I've used some JS trickery to make sure my preview content is aligned more centrally within its container. But I don't recalculate it when the browser changes size so you're seeing that effect. If you refresh it recalcs, but as you say you rarely resize. It does however effect orientations on devices, so I may introduce it.

 

[fez]

Someone's critiqued the old site...

Ahh, so they have. What a muppet!

The new one is very nice in my view.

 

[gord]

So I've spent my evening rejiggling that damn text box on the homepage. It's in the only place that makes sense to me. I have adjusted it's styles though, and made it a link, which gives it a better sense of place on the page.

Adjusted the spacing on the featured item bar so that it's a bit thicker. Having the item escape the bar is a no go.

Categories display smaller thumbs for desktops.