Which layout looks better?

[TechBoyJK]

Can I get some advice here? I'm going to link to two different layouts I'm working on. The first one I built over the past few years and have refined it pretty well, but the code is custom and less extensible.

I'm working on a similar layout using BootStrap (design framework) and I feel like it's cleaner... and since it uses a framework it would be much easier to get help from other designers.

I don't need feedback on smaller details, just a quick look at both and feedback on which looks
nicer. I can always change it down the road but I need something to start with.

1) https://details.at/users/session.cfm?q=login
2) https://details.at/cybercon/cyberconLogin.cfm

 

[Leros]

Do you have enough traffic to do A/B testing? If so, try both!

I personally like the first one. It's clean and crisp. The gray background is soft and inviting, the white background on the second one is sterile and harsh. The second one seems really generic and I feel like I'm logging into some kind of cheap enterprise web portal thing.

 

[Woosta]

Source #2 is way too white, not enough colors. Too generic/bland agree with poster above, like a cheap corporate portal thing. Source #1 is more intuitive design.

Actually I just did a test and changed Source #1 to have a background of #dedede for the body element - major difference. Too much white is bad. bad bad.

 

[Tweak155]

First one.

 

[Markbnj]

I don't like either of them that much. The first one is just too busy: too many distinct font sizes, too many unaligned elements.

The second one is better, imo, but the two text fields should be separated a little vertically, again imo.

 

[purbeast0]

first one looks nicer at the current time, but you could EASILY get the boostrap one to look very similar to that with minimal effort, mainly just some css changes or editing the bootstrap css file.

 

[nickbits]

white one but changed to other one's color scheme

 

[TechBoyJK]

I don't like either of them that much. The first one is just too busy: too many distinct font sizes, too many unaligned elements.

The second one is better, imo, but the two text fields should be separated a little vertically, again imo.

I think I like the 2nd one more too. I think it's more elegant and it's probably for the reasons you mentioned.

I'm thinking I might use Bootstrap, but try and implement the color scheme of the 1st one.

 

[Ken g6]

Why does one have a Facebook login button and the other doesn't?

 

[TechBoyJK]

Source #2 is way too white, not enough colors. Too generic/bland agree with poster above, like a cheap corporate portal thing. Source #1 is more intuitive design.

Actually I just did a test and changed Source #1 to have a background of #dedede for the body element - major difference. Too much white is bad. bad bad.

Did you change source 1 or source 2 to #dedede?

I have source 1 already sorta grey so its not totally white. Did you like it changed to be even more grey?

 

[TechBoyJK]

Why does one have a Facebook login button and the other doesn't?

Because the 2nd one is a quick hack together using the bootstrap framework. I'm just looking for judgement on the overall scheme, not particular detais (because many haven't been addressed).

 

[radtechtips]

First

 

[purbeast0]

overall i'm a huge fan of bootstrap, so in the long run, i'd definitely lean towards #2, even though i don't think it looks better in that current setup. but as mentioned, it is very easy to style that to look different/better.

 

[tfinch2]

First, but your mouseover effects are annoying.

 

[Graze]

What is going on with all those different text styles in #1? Going for a record or something?
I dislike both but #2 is better.

 

[TechBoyJK]

What is going on with all those different text styles in #1? Going for a record or something?
I dislike both but #2 is better.

It's still a work in progress.

I'm still hunting for the best font. I like Gotham Narrow (which twitter uses) but it costs $$$$$

 

[TechBoyJK]

First, but your mouseover effects are annoying.

which ones in particular? I was already thinking about changing them or removing them altogether.

 

[tfinch2]

which ones in particular? I was already thinking about changing them or removing them altogether.

The register/login button, the textbox outline.

 

[TechBoyJK]

The register/login button, the textbox outline.

For the nav bar buttons, is it the diagonal background lines that appear?

For the text boxes, is it the dotted border?

 

[Cogman]

I like the layout of the second but the color scheme of the first.

IMO, both could be improved.

For the second, though, since I think it is going in the right direction.

• You have as a title 'Please sign in" with a button that says 'Sign in' and a overall banner that says "Intranet login". To me, it feels like you are saying the same thing too many times. You really could kill the "Please sign in" and maybe keep the "intranet login" with the sign in button. But really you don't need those either.
  
  For an example of what looks good, IMO, look at the google sign or the yahoo sign in pages.
  
• I feel like everything is too big. Cut back on the width of elements. I personally like a more minimal design over a large candy colored scheme which makes me feel like a child.
  
• Your logo doesn't work with the site. It should have a transparent background, not a white one.
  
• You are missing things like forgotten passwords and creating an account
  
• A logout button shouldn't be present in a sign in page.