Site Design

[Ryan]

The real front page is coming very soon. Basically all that's holding it up are some server configuration issues (like ruby refusing to find my gem, or me sucking at mod_rewrite). If you noticed the site was broken at around midnight last night, that was me attempting to put up the new page.

The theme I made for the main site makes what I consider to be a very tasteful use of red and yellow accents. If feedback is good, we may want to consider adding some to the forum.

[Eerongal]

Well, my issue is the monotone of a single color of various shades. That's my biggest issue. It makes the entire site look very drab. I understand wanting to make the pages easy on the eyes, and not distracting, but there's a difference between doing that and making it unappealing.

First of all, the colors are actually rather cold (as in the color sense). When designing a web page, usually, making your site vibrant and attractive can help hold people's interests, so using warm colors is very helpful.

Also, tasteful use of contrasting colors can really help with the site visually.

Contrasting colors can be nice in moderation, but are visually distracting for something that's supposed to serve as a backdrop for information, such as text on a website. There's plenty of contrast between the various shades used on the site currently, and cooler colors are easier on the eyes.

"Bright and vibrant" color schemes used to "hold interest" is a design philosophy suited for a preschool. I should know; I taught preschool. A streamlined, elegant color scheme is best for an adult website designed for communication.

This is a tactic used in all ages of design, not just preschool. For example, see the iPhone. The design of the entire iOS uses bright, vibrant complimentary colors to create a design that is visually appealing. It's a very big design concept when it comes to designing web 2.0 sites, however, it's not the only one. Monochromatic can work well when pulled off right (this skin isnt if you ask me), otherwise it comes off boring and uninteresting very easily.

Also, depending on the website's contents, cool colors exclusively can be a death sentence. It can come off as dark, laid back, or sad. If this fits the air of your content, this can work to your advantage. I think that the site could really do with a healthy dose of complementary colors (such as green and red, yellow and violet, or orange and blue, etc.) used in a tasteful way.

Edit:

The theme I made for the main site makes what I consider to be a very tasteful use of red and yellow accents. If feedback is good, we may want to consider adding some to the forum.

This right here is exactly what i think the site needs a good dose of. Using some bright colors in addition to the cool colors we currently have can help to maintain an air of neutrality. As previously mentioned, orange is the complement to blue, you may want to toy with the idea of orange and red/yellow instead of red and yellow. This way it can help to reduce the colors clashing (not saying they do, since i havent actually seen it. It may be very well done for all i know, but just giving some criticism off the top of my head that may help.)

[KChan]

Keep in mind, the forums themselves aren't 100% finished. What you see now is the base colorscheme - i.e., the canvas - for the forums. The rest of the graphics (buttons, navigation, etc) - the accent pieces - are still being worked on; not to mention, the navbar hasn't been completed yet.

The Canvas is monochromatic, as it should be. The Accent pieces, when they come, will be the ornamentation.

[Yelenia]

Sorry, guys - when I say site I meant boards. I'm terrible about that some times.

and I was totally talking up the site (and boards!) at D*Con - and others were doing so without my intervention which was even more awesome.

on colors - I like 'em - but I like blues. It's likely not for everyone, and I'm sure custom skins for folks wouldn't be turned away - but also likely on the low end of the 'to do' list.

My background is from the WoT fandom. So I've seen lots of different styles, themes, whatever - some were great, some weren't functional. They've all got their pros and cons, and I totally get the 'can't please everyone' bit! I'm more than happy to point out a few 'these aren't bad' designs that are out there to clarify my inability to express myself as I dig a deeper hole.

Keep in mind that I don't know what I'm talking about (tech-wise) when I say the next bits!

Here's a few thoughts on the parts that make the boards feel dated:

it's all very square, and the few buttons that aren't are a bit clunky, almost cartoonish.

the icons for posting (where it says Add BBC tags) look older, but I can't imagine there's much to be done with them. Almost like 'windows classic' vs the XP+ mode on a desktop

the drop down style for the subforums. most go A>B>C, whereas we've got the folder tree thing. reminds me a bit of bbs.

[KChan]

it's all very square, and the few buttons that aren't are a bit clunky, almost cartoonish.

the icons for posting (where it says Add BBC tags) look older, but I can't imagine there's much to be done with them. Almost like 'windows classic' vs the XP+ mode on a desktop

the drop down style for the subforums. most go A>B>C, whereas we've got the folder tree thing. reminds me a bit of bbs.

The first two issues are a direct result of us being stuck with SMF default buttons for the moment. Will is currently working on custom graphics which will add more color, pop, and an overall nicer feel to the site. See my above post. So don't worry; we won't be stuck with the current buttons forever.

As for the third, that stems directly from the forum software we use and I'm not sure if it can be changed or not. That's a question for Ryan, not Will.

[Shivertongue]

(Somehow, this posted ended up in the Mistings thread... whoops...)

Also, if I've sounded a bit rude or irritated in my replies, you can chalk that up to artistic temper. I've spent the larger part of... 8 months, I think, designing the look of the site, playing with colour scheme before the forums were even up.

I put a lot of time into it, and like all artists I tend to get a little miffed when people don't see it as being as awesome as I do. Tongue

[Eerongal]

(Somehow, this posted ended up in the Mistings thread... whoops...)

Also, if I've sounded a bit rude or irritated in my replies, you can chalk that up to artistic temper. I've spent the larger part of... 8 months, I think, designing the look of the site, playing with colour scheme before the forums were even up.

I put a lot of time into it, and like all artists I tend to get a little miffed when people don't see it as being as awesome as I do. Tongue

Understandable, and is the same reason i was assuming, and didnt plan on holding it against you. That being said, i'm obviously not out here trying to hurt your feelings about it, but I'm also not holding back on my criticism. Both would be hurtful to the community as a whole. If i was pandering to your desire to have the design affirmed, i would be doing a disservice to what i see as a problem with the overall design. If i was saying these things only to anger you, i would be adding nothing to the community but trolling.

Know that the only person i can speak for is myself. I may be in the minority. But if i think it's ugly, i'm going to tell you it's ugly.

For some constructive criticism: Something that may help with the current color scheme would be the tactful use of gradients on some fixed text. A very slight gradient underneath text can actually help the text feel 3D in a way. It gives it a slight sense of depth. This can help to solve the problem with it appearing "flat"

I went ahead and attached an example of this that i did in photoshop really quick. Note that this wouldnt help for text on posts, but it could help things like titles and anywhere there would be fixed text to look a little but better.

(note, i did this really quickly in photoshop, it would require a little tweaking, but the effect could be made even better, rather than a quick "throw this in, and do this real quick" job.)

[Shivertongue]

Understandable, and is the same reason i was assuming, and didnt plan on holding it against you. That being said, i'm obviously not out here trying to hurt your feelings about it, but I'm also not holding back on my criticism. Both would be hurtful to the community as a whole. If i was pandering to your desire to have the design affirmed, i would be doing a disservice to what i see as a problem with the overall design. If i was saying these things only to anger you, i would be adding nothing to the community but trolling.

Know that the only person i can speak for is myself. I may be in the minority. But if i think it's ugly, i'm going to tell you it's ugly.

Oh, don't get me wrong. I don't want you to just stroke my ego. The reason for this thread is exactly what you're doing. There is always room to improve on a design, and that's what I'm seeking. (The geocities comment, though, was out of line. )

I've survived far worse critiques. Three years of art school gave me a thick hide, and nothing any of you can say can top some of my teachers. They made people cry.

As for gradients... I'm not sure if that can be done with the site template. I haven't been able to see it, though, so I could easily be wrong. As Kerry said, accents are coming, accents that are in different colours. The buttons and the navbar, as well as the new post/no new post symbols on the sides.

(Edit: Wow, I'm dumb. Yeah, gradients can be used. We have some already. )

I like the colourscheme as it is, though. Most variations we tried led to eyerape, which we're trying to avoid. Experimenting will be done tonight, though. And, hopefully not too long from now, accent graphics should offset all the blue.

[KChan]

We know what gradients are, hun. They're already in use on the forums.

[Eerongal]

We know what gradients are, hun. They're already in use on the forums.

Yup, there's a blue-white gradient at the top and bottom of reading surrounding the buttons (reply, new topic, etc.) and in the main topic divisions on the index. This is actually the only part of the site's current layout i've found satisfactory and in no need of change, it looks good. But a very slight gradient (not as prominent as the blue-white one) could be used in places with static text (just off the top of my head as i post this, where it says "post reply" above this box, and "topic summary" down below. A slight gradient (one that's almost imperceptible) could be used to make it appear much less "flat", that was my point.

Granted, i only have a very passing, simple experience with SMF, so i dont remember how granular the skinning controls are.

also: if you (the administrative team as a collective whole) had no idea what a gradient was....then...well....you wouldn't have ever used any sort of graphics software (which wouldnt look very good in shivertounge's case, being the team's graphics designer)

[Shivertongue]

also: if you (the administrative team as a collective whole) had no idea what a gradient was....then...well....you wouldn't have ever used any sort of graphics software (which wouldnt look very good in shivertounge's case, being the team's graphics designer)

Bah. I'm in a graphic design class at this very moment.

[Eerongal]

also: if you (the administrative team as a collective whole) had no idea what a gradient was....then...well....you wouldn't have ever used any sort of graphics software (which wouldnt look very good in shivertounge's case, being the team's graphics designer)

Bah. I'm in a graphic design class at this very moment.

So yeah, if YOU didn't know what a gradient was....then....well, there would be nothing i could do to help you. Lost cause and all that.

[Chaos]

(Apologies in advance, posting from my Droid)

We could probably put a gradient there. SMF is pretty skinnable. As for the point about the link tree at the top, I know how to change that. I totally didn't think of that, so thanks for bringing that up.

I would also reiterate that the buttons and images are very archaic and definitely need changing. See, the thing is that this is an edited version of the YaBB classic skin. And its, well, classic. So yeah, those are ancient. I think once we get those up and some accents (yellow is also a good idea, which I like from the main page) would warm up things and alleviate the coldness.

Of course, I love blue, so I am a little biased

[Ryan]

BTW, these days CSS gradients make adding gradients easier than ever. They have wide browser support, and it's one of those things that degrades quite gracefully for those that don't support it. In fact, I used one on the main site...

As for rounded corners, those are also easy these days thanks to CSS. Unfortunately, no version of Internet Explorer currently supports them. Again, that's no big thing; they degrade gracefully, and IE 9 looks to be addressing many of IE's shortcomings as a rendering engine, so I'm looking forward to that.

You know, I haven't really given any feedback myself. Really the biggest thing I don't enjoy about the current forum design is the gap between the header table and the main table. It looks so tacky to me, and it's so easy to remove.

[KChan]

Hmmm. It might look better with the gap gone, but I don't mind having it there. Until I can compare the differences between the two, I really don't think I could cast my vote either way.

[Munin]

Maybe I'm blind (or there's something wrong with my display settings)... but I don't see the difference.

[Eerongal]

Maybe I'm blind (or there's something wrong with my display settings)... but I don't see the difference.

There's a subtle difference, but like i said, it was probably a bad example since i did it in like 5 minutes. I did a quick google search to see if i could find a better example, and i did (probably shoulda done that in the first place). Ironically, the page was called "How to make your web design pop"

This one was a bit better in execution, you should be able to readily see a difference between the two

[Yelenia]

Thanks! I'm just offering the 'garden variety idiot' suggestions  ;D

The only other thing that bugs me is that the Messages/Posts/Replies bit at the top runs together and into the home/help/search etc buttons. I'd align the text bit to the left, the buttons to the right, and perhaps add one of those break line things | between Unread posts and Unread Replies links.

but don't think that's a design issue per se, so I'm not sure that it goes here. ???

*scampers out of the thread!*

[Ryan]

I will note for the record that, should a vertical bar be desired between links, it should be added with CSS and not explicitly, because this improves accessibility for those who use screen readers. In other words, it prevents them from having to listen to "Unread Posts vertical bar Unread Replies".

Though, come to think, this theme is probably quite inaccessible anyway, so I'm not sure how much difference it would make.

[Chaos]

Thanks! I'm just offering the 'garden variety idiot' suggestions  ;D

The only other thing that bugs me is that the Messages/Posts/Replies bit at the top runs together and into the home/help/search etc buttons. I'd align the text bit to the left, the buttons to the right, and perhaps add one of those break line things | between Unread posts and Unread Replies links.

but don't think that's a design issue per se, so I'm not sure that it goes here. ???

*scampers out of the thread!*

No, that's a valid point. When there's new icons for everything, there will be icons for those, too. So that's kind of why it looks weird now, as it's a relic of the forums not being "done". It matches the color scheme, so it doesn't eyerape, but it certainly needs help.

They didn't have an icon originally because those aren't default SMF buttons. We had to steal the command elsewhere.

[Andrew the Great]

Maybe I'm in the minority on this, but on the forums at least, I would make the 17th Shard logo a little smaller. It drives me insane to have to scroll down as far as I do every time I open any page on the site, and it's kind of huge. On the main forums, even, I like it, but when I get into individual threads, I'm sitting here going, "Yes, I know that I'm on 17th Shard. I've been here for the last 20 minutes. Don't want to deal with quite so much scrolling if it can be avoided."

Note that this is much more of an issue because I'm sitting on the lawn outside the Fine Arts Center and using my laptop's mouse rather than an actual like.....mouse. If I had a scroll wheel instead of having to use the scrollbar or clicking on the page and using the arrow keys/page up/page down, it wouldn't be nearly so annoying. In fact, it's not, since I use a real mouse when I get home.

[Eerongal]

Maybe I'm in the minority on this, but on the forums at least, I would make the 17th Shard logo a little smaller. It drives me insane to have to scroll down as far as I do every time I open any page on the site, and it's kind of huge. On the main forums, even, I like it, but when I get into individual threads, I'm sitting here going, "Yes, I know that I'm on 17th Shard. I've been here for the last 20 minutes. Don't want to deal with quite so much scrolling if it can be avoided."

Note that this is much more of an issue because I'm sitting on the lawn outside the Fine Arts Center and using my laptop's mouse rather than an actual like.....mouse. If I had a scroll wheel instead of having to use the scrollbar or clicking on the page and using the arrow keys/page up/page down, it wouldn't be nearly so annoying. In fact, it's not, since I use a real mouse when I get home.

that's actually a pretty good point. I didnt really notice it, because i just naturally flick my scroll wheel down when going to topics, but when looking at a topic, a good 3/4th's of your screen real-estate is taken up by what is essentially header information (logo, WoK advert, news, navigation buttons, and site tree, and white space above posts)

I could see how that would get annoying without a scroll wheel.

The logo, on its own, isnt that terribly big, but when you add in all the other forum bits you get before the posts, it starts eating up space pretty darn quick, with the two parts taking up the most space being the logo and the news/WoK image-link thingy. Combined, they take up pretty much half your screen.

In my opinion, its really a combination issue, not just the logo. I'm sure the sizes could be compromised somehow to still look nice and provide the same info in less space.

Also: now im going to notice that every time i load a page. Thanks.  >

[mycoltbug]

I wonder if when you are not in the main forum section if we could have the tree and the navigational bar moved to the right or left. That would free up some space.

[Chaos]

I can test a smaller(ish) version of the banner later tonight. It is, of course, entirely Will's discretion if he likes it.

I wonder if when you are not in the main forum section if we could have the tree and the navigational bar moved to the right or left. That would free up some space.

I'm not sure what you're saying here. Could you clarify?

As to the link tree, it should only take up one line once I do Yelenia's suggestion.

[Shivertongue]

So, we have several changes in the works, but before I implement any, I want to know what everyone LIKES, so that we don't end up changing it on a whim.

(And I swear, this is not just me searching for positive crit in a thread full of negative - but constructive - crit.)

So what do you want to see NOT change?