Welcome to the MacNN Forums.

Amorya · Jul 11, 2003, 02:05 PM

http://www.scifiminds.net/amorya/sfm.gif

The original site is here,

Any comments? This is just a simple concept sketch I just whipped up. (Please bear in mind I'm more of a coder than a designer - sometimes I might need things spelling out

)

I'm after an Apple-like flat, sterile, futuristic look. Lots of flat colour, no texture, etc.

There's lots still to do... I want some kind of background to the navigation bit at the top, but I couldn't think what to put there except pinstripes, which I don't want. Also, I need to make a logo, to go in the gap top centre.

The button on the top right has a green outline - that's how you'll know which section of the site you're in. Also, the Messages button will light up (turn a different colour) when you have new messages.

The main content of this page is on a grey rounded rectangle. That's because it's like a dialogue box on a computer program. Pages with content (instead of settings or messages) will just be straight onto the white background.

I'll use dashed lines to break up sections. For example, on the message board, there'll be a dashed line between each post.

Any comments, or suggestions of where I should take this design? (I know I ripped the buttons from Apple.com - I'll make my own before the final thing, just in a very similar style. So don't tell me off for that one

)

Amorya

crystalthunder · Jul 11, 2003, 02:22 PM

Waaaaay too light grey. I would suggest making the grey buttons change color when you hover but that wouldn't fix the initial look of the site itself. If you want to go after the new Apple button look make the bottom row buttons some misc. warm colors similar to the last button in your "Edit Profile Information" page, but if you want to stay with a grey theme make the buttons darker grey. If you keep them the way they are there is virtually no contrast. The buttons on the top row are rather awkward because they are essentially the same font size as the title of the site itself. Makes the overall look a little anticlimatic. I understand that this problem can be partially fixed with an appropriate logo but that is only a partial fix. Make the buttons on the top smaller, less bulgy on the vertical axis, and shink down the font size!

Other than those little gripes I like the overall design. The green outline displaying what page you are on is a nice touch. Reminds me of the Apple laptop AC charger with the LED ring telling you when the battery is done charging. The light grey really works with the content pages, but again I don't think it does for the buttons. You might consider making the "SciFi Minds" text black to really accentuate the title of the page.

I'm excited to see what your next revision will look like

clam2000 · Jul 11, 2003, 03:59 PM

I like the faint grey under the main content, perhaps making the top buttons stand out more would liven things up. O change i would recomend is some sort of border arround the text boxes, I realize that there will be a bevel, but a border (the same green perhaps) would make them stand out quite a bit more.

--will

Amorya · Jul 11, 2003, 05:43 PM

Originally posted by crystalthunder:
Make the buttons on the top smaller, less bulgy on the vertical axis, and shink down the font size!

Yeah, you're right - I overdid these. The reason is because I'm redoing all the navigation of the site. On the existing site, you have to go via the homepage to get to most of those sections... now I'm putting the links on the main page. Those four are the most important, so I ended up over-exaggerating them!

Any suggestions to a background to the top bit? As I said, all I could think of was pinstripes... without one, it feels to me a bit lost and floating.

Amorya

crystalthunder · Jul 11, 2003, 05:55 PM

Maybe an Aqua blue symetrical ripple effect (at an angle so it looks cool and 3D) eminating from the center where the logo will go? Just the first thing that came to mind looking at the layout ^_^x

Amorya · Jul 12, 2003, 01:12 PM

http://www.scifiminds.net/amorya/sfm.pdf

I improved it a bit. I like it much better now.

Comments?

Amorya

clam2000 · Jul 12, 2003, 02:40 PM

I like it, one idea for the final site would be to have the white part of each button change the same green as 'minds' whenever the mouse moves over it.

--will

Amorya · Jul 12, 2003, 03:43 PM

Originally posted by clam2000:
I like it, one idea for the final site would be to have the white part of each button change the same green as 'minds' whenever the mouse moves over it.

--will

Could do... that's a lot of images though

I'm already making one image for when you're on that page - using the green outline idea... then I'd have to have one for when you move over each, and one for when you move over a button that you're on the page for...

And then I'm going to have the Messages and Email buttons light up (in yet another colour or style) when you have new email...

I could be here for some time

Amorya

crystalthunder · Jul 13, 2003, 12:48 AM

I think it is getting better and better, keep working at it!

york28 · 04:00 PM

I agree, the revision above is looking good. If might help tie the layout together if you use the line that the buttons are sitting on to encompass the content of the site, like this.

The other issue I can see is that the design right now requires a fairly wide browser window, which might be fine for your audience, but might be a concern as well. It sounds like a very text heavy site, and text is often easier to read in a long, more narrow column than in a wide, short one.

Good work.

[edit: I actually checked out the site in it's current state, and if the new site has similar sidebars to the current ones, I think the width will be fine.]

Amorya · Jul 16, 2003, 08:59 AM

Latest update:

http://www.scifiminds.net/amorya/sfm.gif

Originally posted by york28:
I agree, the revision above is looking good. If might help tie the layout together if you use the line that the buttons are sitting on to encompass the content of the site, like this.

Thanks for the idea.

I'd actually already given the content a sort of border (see pic above) before I read this. I'm not sure which way I like better. I'll have a play around with both I think.

Amorya

Amorya · Jul 16, 2003, 09:03 AM

Originally posted by york28:
The other issue I can see is that the design right now requires a fairly wide browser window, which might be fine for your audience, but might be a concern as well. It sounds like a very text heavy site, and text is often easier to read in a long, more narrow column than in a wide, short one.

The site at the moment is a tiny bit wider than my normal browser window - just enough to put a scrollbar on.

The majority of the audience is PC users, it's sad to say. The only non-PC browser that makes it into the top ten on the logs is OmniWeb, and that's 'cos of me! Anyway, I've not checked this design on a PC yet, but it should fit on an 800x600 maximised window with no scrollbars.

I agree about narrow columns. I'll probably indent the text a bit on a text-only page. The problem with making the whole site narrower is it gets too narrow for things like the forum.

Thanks everyone for your help!

Amorya