View Full Version: Main Page Design

Beyond Good & Evil Revolution > Design > Main Page Design


Title: Main Page Design


Pey'j - January 9, 2010 06:50 AM (GMT)
Jan 20, 2010:
Shadows are back! Also added new buttons, number of comments, and sort of tried to fix up the Latest Posts section. Please hit me up with your thoughts!

Mock-up v5

Jan 15, 2010:
New mock-up sans shadows, with color adjustments and some pretty horrible looking buttons (IMO). More details at this post

Mock-up v4

Jan 8, 2010:
Alright! Back from my Christmas break, and ironically I have more time now than I did then. I haven't done much yet but I decided to break ground on designing how the site will actually look. So here are a couple of options. The only difference between the two is that I gave the main containers some shadows underneath to give a bit of a 3D look on one, but I'm not sure I like it. I like it under the banner though, I think I'll keep that. And then I just colored it up a bit, gave it a background, changed the font and that's really about it. Got a lot more work to do but I think it's starting to come together.

Let me know what you think!

With shadows
Without shadows

P.s. If the page background looks familiar it's because I may or may not have completely stolen it from this board. Don't tell...

Denouement - January 9, 2010 11:53 PM (GMT)
Throw my vote toward shadows, my good man!

Fomorian - January 10, 2010 08:16 AM (GMT)
Everything looks better with shadows. Unless they are sapient, soul-devouring shadows. Then not so much.

It looks a bit more proffesional with them, in my opinion.

Luke-54 - January 11, 2010 01:05 AM (GMT)
Site with shadows looks better

G.A.Pster - January 15, 2010 02:18 AM (GMT)
I’ve been putting this off because with 56 k it takes like 5 minutes to load, (only a few more days with it though, then I enter the modern age!)

I like the one with the shadows better. It just makes the page “pop” more, but it would be ok for me either way.

Pey'j - January 15, 2010 07:50 PM (GMT)
Well since the overwhelming majority was for shadows I decided...to not have shadows. It's not a final decision but the fact is I've never seen it before and the more I think about it the more I realize it might not actually be possible (or practical at least). Of course I'm leaving the shadow under the banner and under the main page.

So I have a new mock-up and I have a TASK for all of you! Yes, you get to do something. Specifically, I want to see some button designs. I spent about an hour making the buttons in this mock-up and they look, in my opinion, utterly atrocious. But I hope you can see what I'm going for, which is to help give the page that 3D effect that the shadows would have helped it get. When the user hovers their mouse over the button it'll invert, like the button's popping into the page.

But the buttons I've made are just the wrong color, a bit grainy on the edges, the font's not my favorite, I just don't like them. So any help on this issue would be appreciated. I would even go for putting a little image in the button like the "Donate" button at the top of the page. Maybe some silhouettes faded into the background, like a communication device in the Share button and a crowd of people in the Comments button. Something like that.

Other than that I did some color adjustment (which I'm not totally sold on yet either), and some tweaks to the Fan Art Spotlight and Recent Posts boxes (I like the Fan Art box now, Recent Posts still needs work).

Any other comments please let me know!!

conan - January 15, 2010 10:16 PM (GMT)
Something like any of these, possibly?

user posted image user posted image user posted image user posted image

Here's a rollover test.

Pey'j - January 16, 2010 06:12 AM (GMT)
Now there's a step in the right direction. I think I like the 2nd from right best, but that might look too busy on the page. Think you could grab my mock-up image and put your buttons on it so I can see how it looks?

Just two things: the rollover test is alright but I don't think I like the bending so much. Just an inversion is good enough I think. Also could you make the text pop out a bit more?

Excellent work otherwise! :welldone: And this is why I bring the project here instead of doing the whole thing myself.

Pey'j - January 16, 2010 04:10 PM (GMT)
P.s. Just to clarify, when I say make the text "pop out" I don't mean make it pop out like 3D, with shadows and stuff. I just mean make it stand out more. :P

conan - January 16, 2010 05:12 PM (GMT)
Right, no drop shadows. Drop shadows are bad.

Rollover Preview

Pey'j - January 16, 2010 10:50 PM (GMT)
Wait whoa, I wouldn't say drop shadows bad. Unless you tried them on the page and it didn't look right. I think they should give at least a little bit of a 3D effect, so the page isn't too flat overall.

Looking good though, I like the rollover a lot now. I think the text could still pop up just a bit more. Thanks for doing this!

conan - January 17, 2010 05:08 PM (GMT)
user posted image

You might also want to consider text based buttons; an image in the background and text above it. If you're not already.

Pey'j - January 17, 2010 11:51 PM (GMT)
That looks excellent, pretty much exactly what I was looking for. And that's interesting about the text-based buttons, I hadn't thought of that. I was trying to figure out how we would do the comments button, because obviously you can't put the number of comments on the button image...but maybe if it was text-based? Or it could be an "Add Comment" button instead, with a text hyperlink for the comments page. Hmm...

The_Evil_Reaper - January 18, 2010 03:33 PM (GMT)
Daah, this is frustrating! Just when I find myself in the middle of all kinds of work, you start up the project again.

I wanna help, I just don't have the time... Maybe in a month or so, my january is fully booked.

Teaser92 - January 20, 2010 04:02 PM (GMT)
Can I just say Lol to the mock up where the release date for BGE2 is 2042. :P

Btw shadows or no shadows the page layout looks good either way. Well done on the buttons they seem to work well

Pey'j - January 20, 2010 07:37 PM (GMT)
No worries Reaper, even if you can manage to jump on here every once in a while and give input that would be great. Same goes for everyone else, by the way.

But conan, since you're not being a slacker and actually helping out ( :P ), could you make a "Comments" button like the last button you made? I'm incorporating the buttons into my latest mock-up. And here's my idea: a "Share" button, a "Comments" button, and then a number to the right of it indicating how many comments there are. Got the idea from Engadget, seems to work pretty well.

Anybody else who has input for the design, again please give your input because a graphic designer I am not. The theme for this board is truly brilliant and I want the website to live up to it.

The_Evil_Reaper - January 20, 2010 08:29 PM (GMT)
QUOTE (Pey'j @ Jan 20 2010, 01:37 PM)
No worries Reaper, even if you can manage to jump on here every once in a while and give input that would be great. Same goes for everyone else, by the way.

But conan, since you're not being a slacker and actually helping out ( :P ), could you make a "Comments" button like the last button you made? I'm incorporating the buttons into my latest mock-up. And here's my idea: a "Share" button, a "Comments" button, and then a number to the right of it indicating how many comments there are. Got the idea from Engadget, seems to work pretty well.

Anybody else who has input for the design, again please give your input because a graphic designer I am not. The theme for this board is truly brilliant and I want the website to live up to it.

*sits in the corner looking sad*

*remembers he has to do stuff*

*leaves a sad replica of himself behind*

Pey'j - January 20, 2010 08:33 PM (GMT)
QUOTE (The_Evil_Reaper @ Jan 20 2010, 12:29 PM)
*leaves a sad replica of himself behind*

Hahahaha. Like Majora's Mask or something. Aww poor Reaper don't be sad! You're special just the way you are.

Pey'j - January 20, 2010 09:04 PM (GMT)
Main page mock-up v5 is here! Now with 100% more shadows! Yes it turns out that I was wrong and shadows are in fact possible in this scenario, and are not as unusual as I thought. I like them, you like them, so we'll keep them! Hooray!

Other changes: added conan's awesome buttons (well the "Share" one anyway, I'll stick the "Comments" one in later when he makes one), put the number of comments next to it (stole the New Thread image from the board for it), and tried to change up the Latest Posts section. I say "tried" because I'm still not happy with it. Any ideas?

This is getting pretty close though, I'm excited! Once this design is done we'll start actually building the website pretty soon. While that's going on we'll go over the layouts for the other sections. Woot!

conan - January 20, 2010 09:23 PM (GMT)
Here ya go.

user posted image

Pey'j - January 20, 2010 10:25 PM (GMT)
Awesome! Updated the mock-up.

Ralexand - January 21, 2010 02:14 PM (GMT)
I think it looks great! I can't wait to see it finally online ... you know? Own Website and stuff? After ... almost 5 years?! :D

Btw, i lol'd about the shoutbox and the release date of BG&E 2 :lol: "retired reaper" hehehe

BG&E Voyager - January 22, 2010 01:11 AM (GMT)
Looking good! I wish I could help out more in this department, but as soon as things become less busy here in a few months i'll make sure to create a music vid spreading the word!

Btw: Definitely, possibly coming out, or not = :lol:

The_Evil_Reaper - January 22, 2010 06:10 PM (GMT)
Those jokes have been on there since one of the first mock-ups.

Still doesn't make them less funny though.

*goes of to do busy work*

Edit: Oh erhm, one thing that bugs me is this... the black background. Are you going to change that?

Pey'j - January 22, 2010 11:30 PM (GMT)
QUOTE (The_Evil_Reaper @ Jan 22 2010, 10:10 AM)
Edit: Oh erhm, one thing that bugs me is this... the black background. Are you going to change that?

Hmm does it really look black to you? It's supposed to be blue and green. Actually it's ripped right from the background of this here board.

Fomorian - January 23, 2010 08:46 AM (GMT)
QUOTE (Pey'j @ Jan 22 2010, 05:30 PM)
QUOTE (The_Evil_Reaper @ Jan 22 2010, 10:10 AM)
Edit: Oh erhm, one thing that bugs me is this... the black background. Are you going to change that?

Hmm does it really look black to you? It's supposed to be blue and green. Actually it's ripped right from the background of this here board.

Actually, it does look blue and green. Maybe Reaper has his screen set too dark?

The_Evil_Reaper - January 24, 2010 03:43 PM (GMT)
Hmz, I see it now... but it's a little dark IMO. Maybe you could light it up just a notch or two?

Teaser92 - January 31, 2010 03:44 PM (GMT)
I think the forum could do with a new look. Make it brighter, fresher and warmer for the website, instead of the dark moody look we have right now.

Anybody else think the board needs a lick of paint?

Pey'j - February 1, 2010 11:08 PM (GMT)
I'm in agreement with that, although I imagine we could keep this theme (or something similar) as an option.

By the way sorry for the lack of updates. But I've got something I'm planning at the moment that is potentially very exciting. I'll keep you posted...

The_Evil_Reaper - February 2, 2010 02:53 AM (GMT)
Yeah, I kinda like this theme, but that could also be cause I worked pertty hard to get it like this.

Still, if this one stays optional, I'm all for a new look.



Hosted for free by InvisionFree