Huge portfolio update, new idea!

Nadril · June 5, 2010

NEW!

[hide=IMAGE][/hide]

Alright. I think I'm starting to get onto something here. I've made some major changes in the way I'm doing things:

1) I'm using the 960 Grid system. I expanded the image it's self to 1680x1050 because I find it easier to visualize it but rest-assured all of the content is fitting within the 960grid template.

2) I've decided to go with a layout I've seen on a lot of portfolios and the like and adding my own thing to it. I'm sticking with the same idea as my last with the "3 thumbnails" deal where I'll allow the viewer to look through my portfolio collection and the like.

3) If I can I'm keeping this a single page website. I just really love the idea to be honest of one.

4) I'm not sure what that gray content box is going to be used for yet. A header type thing maybe or maybe something else. I don't really know yet.

5) I'm not sure if I am keeping the color or not. it's pretty easy to change anyways.

6) Still debating the kind of "style" I want to go with this. Like if I want it to be more sleek and technical looking or what. I love that eurostile font so I'll continue to use it.

7) Not sure if I'm going to use "hard" or "soft" edges. Basically what it is now vs rounded edges.

So yeah, comments and stuff as always guys! I'm still in the "making it look pretty" phase but I've just about nailed the layout I want.

[hide]

Hey guys.

As you all may know it is summer for a large part of the world. What you may not know is that during the summer I generally have jack-[cabbage]-nothing to do which makes me turn to design and do all the stuff I didn't have time to do during the school year. My focus earlier on was Terragen 2, and I posted a bunch of that and such. My new focus is my portfolio which I, honestly, have never been satisfied with. Hell, I haven't even reupped my domain name because I'm kind of ashamed of the POS that is my current portfolio.

For the past week or so I have been going through constant ideas in a (rather large) psd file. They started off rather [cabbage]ty, I really have had a lack of some decent ideas recently. I do feel that, however, they are getting better. Each idea has been in a various states from just a bunch of boxes representing content areas to actually trying some photos in it. I'm making this thread mostly just because I feel like with all this stuff I'm doing I should post it. That way I can at least get some ideas of direction on how I'm doing.

So! after much thought my goal for this website is as follows:

I want it to be a single page site. This is mostly just for design purposes, as I dislike people having to look all over to find out what I'm about.
I was thinking about having some blog capabilities but I think I will scratch that idea. I suck at blogging anyways.
I want it to be interesting to look at but not be cluttered. I don't want it to become another "thumbnails on black BG" site.

Oh and before I show my latest idea THANKS TO HUMUS FOR THE EXCELLENT TEXTURE PACK. (seriously, it's awesome)

[hide][/hide]

The idea is I have 3 main "thumbnails" of sort which are my 3 catagories, 3D, 2D and web. I'll have some sort of "arrows" on it (don't yet) to let you go back and forth between the images in the queue. Maybe I'll just do the pure lightbox support and have it done through that way (which sounds a bit easier on my end).

I'm debating what to do with some of the empty space. I'm making this with the intention of being left-side adjusted fitting on a 1280x1024 monitor (well it's 1200 pix wide.) while still possibly looking cool enough on a larger resolution. I don't really want to add a ton more content boxes although I could add some small ones with text under the thumbs. I want to be able to have a nice, easy and clear way to contact me (possibly through a form?) and I wouldn't mind having some info about me right on the main page.

The black thing at the bottom I think I will have link to my twitter account, dA account and such if anything. I'm debating on how large I want it to be though.

So again this is probably one of the best results I've gotten so far. This current design is still very much in it's infancy, I've been working on it for maybe 35-45 minutes and a large part of that was coming up with the idea. I have, however, spent probably an upward of 8 or more hours on "brainstorming" and trying ideas and layouts. I also have probably spent a bunch more time looking up at web design sites (mostly just inspiration type deal, seeing what they do and trying to get ideas).

EDIT: this is an idea for the about/contact. Writing is just rough stuff.

about me

[hide][/hide]

contact info

[hide][/hide]

(ah [bleep] I didn't put the lighter gray window below the black bar. Disregard it)

The idea is that you click on it and the window will expand.

[/hide]

Shiny · June 5, 2010

My one complaint is the sickly background yellow. Immediately turned me off. The splatter is all well and good, but doesn't look top notch quality.

Soa · June 5, 2010

How do you turn a psd into a working site? :mellow:

ElkNight · June 5, 2010

Maaaaagiiiiicccccc.

Nadril · June 5, 2010

How do you turn a psd into a working site? :mellow:

Cut the pieces into separate png's and then code. :)

Sam · June 6, 2010

Just seems very bland to me, Zack. It just doesn't appeal to me. I don't mean to sound stingy but I just don't like it.

Nadril · June 6, 2010

Just seems very bland to me, Zack. It just doesn't appeal to me. I don't mean to sound stingy but I just don't like it.

No I agree, there's still a bunch I don't really like about it.

Skully · June 6, 2010

I really don't understand much about web design, but once again as I said in your Terragen thread your text always appeals to me, no matter how simple it is. :mellow:

dsavi · June 7, 2010

The typography at the top is great; I'm dying to know what font that is! Unfortunately that's about all I like about this. It's not that it's bad, it's that It's... mediocre.

One of your big problems is that the text, as in the case of the thumbnail captions, doesn't have enough "room to breathe", or as in the case of the text at the bottom, isn't really the right size. The problem with that text really is that it's so undefinable. It's obviously not body text or part of the content, but it's not really a heading either. This makes so that it's really hard to decide on a size for the text. One thing my former visual arts teacher taught me is to use the Fibonacci sequence to decide font sizes. (If you don't remember the Fibonacci sequence: Start at one, and add the two previous numbers. 0+1 = 1, 1+1 = 2, 1+2 = 3, 2+3 = 5, 3+5=8, 5+8 = 13, 8+13 = 21...) So if your headers are 21em/pt/px, your content should be 13em/pt/px. Really it's all about geometry and math; I would use the Golden Ratio for the thumbnails (~1.618:1), and possibly center the page, shrink it to 960px wide and divide it into thirds. That is really more practical than artistic design advice.

What you'll have left will, umm, look like one of my sites now that I think of it.

But I know how it is to try to be original when it feels like everything has been done design-wise on the Internet. No easy task, and really feels like banging your head against the wall.

Nadril · June 7, 2010

The typography at the top is great; I'm dying to know what font that is! Unfortunately that's about all I like about this. It's not that it's bad, it's that It's... mediocre.

One of your big problems is that the text, as in the case of the thumbnail captions, doesn't have enough "room to breathe", or as in the case of the text at the bottom, isn't really the right size. The problem with that text really is that it's so undefinable. It's obviously not body text or part of the content, but it's not really a heading either. This makes so that it's really hard to decide on a size for the text. One thing my former visual arts teacher taught me is to use the Fibonacci sequence to decide font sizes. (If you don't remember the Fibonacci sequence: Start at one, and add the two previous numbers. 0+1 = 1, 1+1 = 2, 1+2 = 3, 2+3 = 5, 3+5=8, 5+8 = 13, 8+13 = 21...) So if your headers are 21em/pt/px, your content should be 13em/pt/px. Really it's all about geometry and math; I would use the Golden Ratio for the thumbnails (~1.618:1), and possibly center the page, shrink it to 960px wide and divide it into thirds. That is really more practical than artistic design advice.
What you'll have left will, umm, look like one of my sites now that I think of it.

But I know how it is to try to be original when it feels like everything has been done design-wise on the Internet. No easy task, and really feels like banging your head against the wall.

The font is eurostyle or something along those lines. I can double check later :).

Great tip on the text there by the way, it really seems to be my current #1 issue, I'll be sure to give it a try.

And yeah I really think that I get so hung up about being original that I hurt the design and the layout in the process. I probably should try and do a somewhat "standard" layout, maybe use the 960 grid system or something like that.

edit: it's eurostile.

Nadril · June 9, 2010