So I've got some ideas...(Updated)

Tweaked_Bat_

We've currently got a project to complete at college. It involves creating a website on which to display our personal portfolios. This is an idea I've been sitting on for a few months now, and now that I'm doing the subject, it's kinda shifted me back into gear.

So I had some ideas tonight which kinda just "appeared" in my brain for how I roughly want the site to look, which I have posted below. Keep in mind these are rough "thumbnails" if you will, and have been whipped together on the spot, just placing ideas from my mind onto paper (or computer) as they appear.

I'm trying to get a central line/margin and have my elements stem from it, rather than from the typical left alignment you see oftentimes.

Please feel free to give me pointers/crits/tips on this kind of layout (things to keep in mind; what works, what doesn't etc). This is an idea I plan on sticking to, and I want to see how far I can take it.

As time progresses I'll add more detailed work, and eventually, the finished product.

#1

#2

#3

#4

#5

#6


The colours were simply the colours that came to mind when thinking of this. The beige blocks you see in some designs are meant to represent graphics of some sort, or just variations in texture/colour or whatever.

I'm hoping to eventually get the style resembling a "modernised nouveau" type kinda thing. (ie: addition of some non-symmetrical lines/elements juxtaposed with some more modern elements, such as sharp edges etc).

Yeah I'm just crapping out stuff off the top of my head here, so bear with it :P

So, if you have something to add, go for it. Thanks.

Penguino

I'm liking #2 and #4

What course are you studying? 'Cos I have to do a similar thing for my in Digital Media course. Also, what language is that?/Why is it not in English?

darkdemon

Penguino wrote:

I'm liking #2 and #4

What course are you studying? 'Cos I have to do a similar thing for my in Digital Media course. Also, what language is that?/Why is it not in English?

I'm fairly sure that's just a standard Latin text so you have some text other than "Text should be here bla bla bla bla bla text text text".

Edit: For me, #1 and #6. I dunno, there should be a contrasting color but not too heavily, if you get what I'm saying :P.

Lly

It's really quite boring. The layout is fine i guess but there's nothing making me want to read the text (despite the fact that i can't understand it anyway :P). Also the font is actually quite hard to read with those colour choices.

World as Myth

The color scheme is all right. The title font needs to be changed. They all look a bit like livejournal layouts or something. Basic is good, but it needs a little flavor.

Tweaked_Bat_

Keep in mind these are rough "thumbnails" if you will, and have been whipped together on the spot, just placing ideas from my mind onto paper (or computer) as they appear.

Sorry to sound redundant, but just reminding you these are more focused on composition rather than final products with all details included.

Thanks for the input so far though, I will post more as I go along, hopefully making it a little more exciting. I'm liking #1 and #6 the most, too.

And now that I'm looking at it from the college computers, the colours actually look a little more brown than grey :? What is it with the font exactly Lly? Is it because it's white? Should I try another colour? Or are you talking about the menu text?

Penguino: I'm doing a one-year Diploma course in Multimedia Integration (as it's officially called). And the text is just standard dummy text, just to fill in space and show what the text would actually look like. It's not actually meant to be read.

World As Myth: What would you suggest as a title font? Something sans serif or still serif, but slightly different?

World as Myth

Tweaked_Bat_ wrote:

World As Myth: What would you suggest as a title font? Something sans serif or still serif, but slightly different?

It depends on what you're going for. In general, a sans-serif font is going to project a more modern feel, a little edgier. A serif font feels more traditional, formal, maybe even antique.

Lly

Tweaked_Bat_ wrote:

And now that I'm looking at it from the college computers, the colours actually look a little more brown than grey :? What is it with the font exactly Lly? Is it because it's white? Should I try another colour? Or are you talking about the menu text?

It's mainly that serif fonts read pretty badly when they are light on dark, or at least they do in my experience. But this is an early 'sketch' of what the site will look like so i'll keep my opinions to myself till i see something a bit more developed.

p.s. it's really hard to type while drunk!

Keep the updates coming. Especially if you need help with the coding, there are some pretty talented coders who lurk here waiting for a reason to speak :P. If they don't surface i'll help with any coding to the best of my abilities!

Rye

Webdesign topics = win.

anywho, why am I the only person who digs # 5? All it needs is better colors and photography (EZ-mode for good webdesign is excellent photography.)

For example, something like this:



I could imagine a different color theme for each link. A blue-ish, red-ish, and purple-ish version with different photos all on black with cream text. Or keep it simple and go with more of the same, or you could try juxtaposing chroma with neutrals... Something for a little academic variety.

Anyway, good luck and give us an update when you start to add more details.

EDIT - Large color fields are a general no-no for web design. It's better to integrate a texture or photograph instead because it gives a more polished look. Again, it's a general rule that can be broken, but it must be done inentionally and VERY well.

Ape2001

I like #3 for it's the most simple one but still pleasant to look at.
Wouldn't some sans serif be a better choice for on-screen design?

Also, are you really sure to choose such dark colours for a portfolio?

DeeLock

3 or 5

Tweaked_Bat_

World as Myth:

In general, a sans-serif font is going to project a more modern feel, a little edgier. A serif font feels more traditional, formal, maybe even antique.

I totally agree. I'm trying to strike a balance between the two, if at all possible. I'm not sure why, but recently I've really started to enjoy serif fonts such as Georgia, but I'll have a play around and see what works.

Lly:

It's mainly that serif fonts read pretty badly when they are light on dark, or at least they do in my experience.

Ah I see. I haven't really had any experience with serif fonts in web-design before, so I'm still kinda shootin' from the hip. Thanks for the tip, I'll see what I can do. Thanks for the offer on the coding, too. I'm quite proficient with HTML, but my CSS needs a little bit of dusting off, it's been a while. I will most certainly be posting my code here to get any assistance on it if possible.

Rye:
Web design topics do indeed win.

anywho, why am I the only person who digs # 5? All it needs is better colors and photography...Large color fields are a general no-no for web design. It's better to integrate a texture or photograph instead because it gives a more polished look.

I do actually like #5 alot too, it has potential... and I was actually playing around with my photos last night, trying to see what fits and what doesn't. I have a fairly large variety, so I'll slap some things together tonight and put 'em up later. Like I said, the beige patches are more or less places where I want to stick textures/photography/tone variation or whatever, thanks for the pointer.

Ape2001:
Thanks for asking those questions. Like I mentioned, I've never really played with serif fonts on a web-site before, and it's something I'd like to try. If it fails, then oh well, atleast I tried. I've seen some successful designs with serif fonts, but I see how problems can arise with smaller text. Maybe I could try serif for the larger fonts and sans for the smaller body text?

And about the darkness, well, it was just the colour that was sitting in my head last night. I think it may work. It kinda gives me a feel of one of those big leather-bound folders that one would place a printed portfolio into, but that may just be me :?

Thanks for the input guys, I'll put in some more stuff later tonight hopefully.

It's nice to see everyone likes each design differently for different reasons. I wasn't really sure what I was doing with them at the time... was expecting them to be a flop :P

NightDragon

I agree with # 3 and the idea that it's all rather bland. I really, really like Rye's example. The only reason I didn't like that set up (#5) was...well, the lack of what Rye had the idea of adding in.

Tweaked_Bat_

Ok, I continued playing around with layout #5 and some of my photos. I tried what rye suggested with the colours. This is all just really brainstorming stuff still, so don't take anything here as definite, apart from the fact that I'm trying to stick to the central line with elements stemming from it to the left and right.

It's getting late now, and I need sleep, but I will work with some of the other layouts, and will try to add more solid details in general.

Oh, I also switched the body font to a serif font (Trebuchet MS). It is easier to read, but it's a little blurry, which I think is a result of Photoshop's smoothing/anti-aliasing rather than the font itself.

Keep posting your thoughts and comments, I will try to add some more definite features in by tomorrow. (click the thumbnails for 800x600 size pics).

#5(a)

#5(b)

#5(c)

#5(d)


Cheers!