Simple website layout looking for suggestions/critique

Started by Ryan Timothy B, Wed 23/12/2009 13:28:07

Previous topic - Next topic

Ryan Timothy B

Alright.  Since I drew those 2 images for the new AGS website layout, I got inspired to make my own site inspired by my old layout idea for ags.

Here's what I've got:

click the image

It's really supposed to be a simple website, with little to no content with only my games really.  Which I only have one game released at the moment, so even that isn't much content.  The site is mostly for hosting my files, but I decided I may as well update the appearance of the site anyway.


Do the colors look appealing to you?  Are they too dull?
Should the orange be brighter?  I can't seem to find a good orange color that doesn't seem to fade with the gray.  Bright orange fades with the light gray, so I had to go with this darker orange.

I tossed the mouse cursor in there, only so you'd know that it's supposed to be highlighted because the mouse over.  Since I haven't made the site yet. :P

The 3 images in the news section have a different meaning--so they're just randomly placed in there:
Letter = regular news
Wrench (spanner) = updates
CD = news or releases for my games

Any suggestions or anything, let me know.  I'll probably start working on it a little after Christmas.

Atelier

I really really love your website! The colour scheme is perfect and everything's really clear too. Talking about the colours, I think that the orange you use for 'Home' would be much more suited as the highlight colour for the tabs, rather than that other dirty orange. I suppose you could then make the Home tab the same colour as the others, or keeping it permanently highlighted like that would be just as good. People will know where their cursor is.

Hope this helps.

Ryan Timothy B

#2
Hey thanks, Atelier.

I changed the orange color to the brightest orange I can seem to find for being on gray.  Any brighter and it seems to wash out with the light gray.  
Now, I could make the light gray boxes lighter gray, but I kinda like the color.... unless there were some large consensus which thought the gray was too faded. :P

Anyway, here are the changes:

The new orange color is on 'Working on a new game' vs the old dark color below it.

I guess I'll keep it like that.  You'll notice it's a little more washed out looking than the dark orange, but I guess it's still easily readable.  Thanks.


Just in case I didn't understand you correctly about the mouse cursor on Contact, it's only there to show you what it would change to if that was a 'real' mouse over the Contact button, with mouse over.  Just for you guys to understand why Contact was lit up. :P
And the full orange Home is because this is the home page that is currently viewed, so it's lit up.

I just reread your message again (sorry, I just woke up from a crazy nap cause I couldn't sleep last night). lol
Well, I kinda like the idea of having a mouse over And a current page image.  I'll play around with them a little and see if I can make it better suited.

Thanks.


edit:
Atelier, here's with the new menu colors and all the text colored.  I darkened the current page Home a bit, and lightened the mouse over graphic.  Is that better?


click the image

Ryan Timothy B

This deserves a new post, last one was a little cluttered.

I took a website template and completely reworked it to look like my website design.  Here's the new site: http://www.bryvis.com/entertainment/index.html
It's seems to be working just fine.  I tried it in Firefox and IE8.

I also changed a few text colors on the menu since I didn't bother to make the orange image mouse over graphic.

I'm a complete n00b when it comes to CSS, so I wouldn't doubt it if some things weren't up to par with the "pro's" here. 

One thing I don't like is if the text is resized within the browser, the menu links will slide off the menu bar.  Which I've noticed happens with almost all CSS websites.  I tried to make it so the text for the buttons were centered vertically and horizontally but it was beyond me.

One thing I did manage to correct was the vertical spacing in the 'post' fields.  I even noticed on the professional website templates they don't even fix it.  If there were only a few words (or you resized the text to very small) in the news, with that image on the left side, everything would resize underneath the image (including the next news posts).  I put in min-height:96px; to account for the image and it works like a charm. :)  Thanks Google.


So I guess the main question is: does it work for you?  Do you see any problems?
Thanks.

SpacePaw

To be honest I don't like just the RGB triangle. It's fully saturated and the rest of the site is kept in low saturation. It kind of stands out too much

Calin Leafshade

Quote from: SpacePaw on Fri 01/01/2010 22:40:47
To be honest I don't like just the RGB triangle. It's fully saturated and the rest of the site is kept in low saturation. It kind of stands out too much

Agreed, That element of the logo really grates on me.

It looks like the old 80's apple logo, when it should look like the modern apple logo.

Ryan Timothy B

#6
Good point.  I always looked past it since it's the 'logo', but I guess it wouldn't hurt to drop the contrast a bit and add a little web 2.0 look to the triangle.

Edit: There we go, I changed the triangle.  I think that suits the rest of the site.  You may have to refresh the page to see it, if you've already checked it out.

Shane 'ProgZmax' Stevens

I don't really give two beans about web 2.0, just what looks good.  With that said, I love the layout of the site and how you've formatted everything but I'm not sure the main colors are so good.  Yellowish-creme to bronze?  Have you tried a gunmetal-gray/blue gradient yet? At any rate, color choice is subjective so as far as the site goes I think you've done very well and I can see where all the areas are on your site cleanly and clearly.  Nice work, Ryan!

Atelier

Quote from: Ryan Timothy on Wed 23/12/2009 17:31:24
Atelier, here's with the new menu colors and all the text colored.  I darkened the current page Home a bit, and lightened the mouse over graphic.  Is that better?

Yep, that shade of orange is so much better in comparison to the older one, and I like the way only the underside is lit up.

Dualnames

Apart from the Bryvis logo, as mentioned, I find the rest graphics and general design to really kick ass!
Worked on Strangeland, Primordia, Hob's Barrow, The Cat Lady, Mage's Initiation, Until I Have You, Downfall, Hunie Pop, and every game in the Wadjet Eye Games catalogue (porting)

Ryan Timothy B

Thanks guys.

Quote from: ProgZmax on Sat 02/01/2010 10:16:40
[..] but I'm not sure the main colors are so good.  Yellowish-creme to bronze?
Progz, are you talking about the light orange link colors you see here: http://www.bryvis.com/entertainment/index.html ?  Or at least to me it looks orange. :P

I guess I could change the link colors to a blue or something, perhaps I'll experiment once the site is totally complete.  I've always had a thing for orange ever since I played the first Half-life.  Not sure why.  ;D

Shane 'ProgZmax' Stevens

No, I'm talking about the site colors, the background, the icons.  They have a very run-down, dingy look rather than something that would draw my interest.

Chicky

I agree with Progz, you need more contrast and another colour.

Also dirty green and orange are too close to one another on the colour wheel and are not regarded as complimentary (which isn't advisable for a website). Try replacing green with blue or just adding blue as a third base colour. Colours opposite on the colour wheel are considered as complimentary colours. See the image below for some ideas.



Also it's good to have a read up on colour theory.

http://www.colormatters.com/colortheory.html

Ryan Timothy B

Hmm.  Perhaps I don't see how dull it is because it's my own site?  Not sure.  I personally like the colors, I think they are freakin' fantabulous (except maybe the orange)--but obviously I have a dull color pallet. ;D

In a couple days I'll try perhaps lighting/whitening the lightest gray content things, and see if that makes everything pop more.  Changing all the graphics would be quite cumbersome, but I'm definitely not afraid to do it.

Darius Poyer

I do agree with ProgZmax, and subsequently with Chicky as well.

Perhaps you can reach the result quickly, don't change all of the colors, simply change the background to black. Not a total black, something like a blue- or green-black. i think you'll definitely see a big difference.

SMF spam blocked by CleanTalk