I'm going to be a dissenting voice here and say that these need a lot of work, because I think that's a lot more useful than saying they look nice. Please don't take this too negatively, because I'm not trying to tear you down and say these are terrible or anything--I'm trying to help you make them better. Mostly the issues are in the details, but there are larger things too. I don't have a lot of time right now (or any time between now and Tuesday), but if you'd like more specifics, feel free to send me an email (it's in my profile) and I'll be happy to get back to you later this week.
There are definitely good reasons to look like Facebook (which I'm pretty sure is intentional). The most obvious reason is user familiarity: people know how Facebook works and they're going to be a lot less intimidated if they've seen something like it before. However, one not-necessarily-obvious downside to doing this is that people know Facebook and know how it works, and if things look like they do on Facebook but don't behave the same then they're going to be confused. That's not necessarily a reason to change the look entirely, but it definitely is something you need to be aware of if you're going this route with your design. Another potential issue is that people really don't like change. (For an example, see your Facebook news feed any time there's a design change.) If you look similar to Facebook but not as good, you may have issues getting over people's initial reactions.
There are a lot of little details I could pick out, but I think your biggest problem right now is with spacing and whitespace. The info page, for example (http://opensource.appleseedproject.org/preview/images/info.p...) has way too much whitespace around the actual information. Whitespace can be a good thing when your content is balanced with it, but right now the whitespace is dominating the page and it looks very empty, which is not at all the impression you want to give off.
The other thing I think you can improve on immediately is your use of gradients and drop shadows. Right now they're too obvious: a little goes a long way. The design is otherwise very flat and text-based (not a bad thing!), and so they stand out a ton and look out of place. The combination of the square tabs and the very large drop shadow is especially jarring. As a first step, I'd suggest getting rid of all (or almost all: the subtle blue to white from top to bottom is working pretty well) of them. Focus on getting the basics of spacing and hierarchy right first, because that's much more important.
As a final note, the Appleseed logo in the top left is going to cause some undesirable behavior if left like that. Either the logo is going to be hidden by the edge of the window or the picture when the browser gets narrower, or it's going to cause a horizontal scrollbar. Both are bad things.
Hopefully that was at least somewhat helpful and gave you some things to think about. And like I said above, I'd be happy to give more (and more specific feedback) later in the week once my thesis is finished.
I think web designs can fit into 1 of 3 categories:
- Designs that immediately make you cringe
- Designs that make you analyze for areas of improvement
- Designs that are so elegant you simply admire
I think these mockups fall into the "areas of improvement" category. They aren't bad by any means, but I immediately saw myself saying "that shade of blue contrasts with the rest of the color scheme" and "that is an inappropriate use of whitespace" and "the padding for that navigation looks unbalanced."
I think with some iterations and a "designers eye for the developer guy" these could jump to the elegant category. I think you're past the chasm; designs that make you cringe can't be iterated upon.
As a final note, the Appleseed logo in the top left is going to cause some undesirable behavior if left like that.
I also thought this was kind of strange. It looks alright in the mockups, but I can't think of a behavior for that logo that would deal well when you shrink the view horizontally. The design seems to suggest that the left margin will remain empty space, as trying to slide it to the left would cause the profile picture to overlap the logo entirely.
Neither leaving the blank space nor covering up the logo seems ideal to me.
There are definitely good reasons to look like Facebook (which I'm pretty sure is intentional). The most obvious reason is user familiarity: people know how Facebook works and they're going to be a lot less intimidated if they've seen something like it before. However, one not-necessarily-obvious downside to doing this is that people know Facebook and know how it works, and if things look like they do on Facebook but don't behave the same then they're going to be confused. That's not necessarily a reason to change the look entirely, but it definitely is something you need to be aware of if you're going this route with your design. Another potential issue is that people really don't like change. (For an example, see your Facebook news feed any time there's a design change.) If you look similar to Facebook but not as good, you may have issues getting over people's initial reactions.
There are a lot of little details I could pick out, but I think your biggest problem right now is with spacing and whitespace. The info page, for example (http://opensource.appleseedproject.org/preview/images/info.p...) has way too much whitespace around the actual information. Whitespace can be a good thing when your content is balanced with it, but right now the whitespace is dominating the page and it looks very empty, which is not at all the impression you want to give off.
The other thing I think you can improve on immediately is your use of gradients and drop shadows. Right now they're too obvious: a little goes a long way. The design is otherwise very flat and text-based (not a bad thing!), and so they stand out a ton and look out of place. The combination of the square tabs and the very large drop shadow is especially jarring. As a first step, I'd suggest getting rid of all (or almost all: the subtle blue to white from top to bottom is working pretty well) of them. Focus on getting the basics of spacing and hierarchy right first, because that's much more important.
As a final note, the Appleseed logo in the top left is going to cause some undesirable behavior if left like that. Either the logo is going to be hidden by the edge of the window or the picture when the browser gets narrower, or it's going to cause a horizontal scrollbar. Both are bad things.
Hopefully that was at least somewhat helpful and gave you some things to think about. And like I said above, I'd be happy to give more (and more specific feedback) later in the week once my thesis is finished.