Tell me more ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.
up vote 1 down vote favorite
1

I was somewhat inspired by the Twitter login page, which has a nice "fullscreen" background picture on the login page. Here is what I did for my webserver:

enter image description here

Is using a fullscreen background with translucent input fields distracting or inappropriate? Are the input fields clear enough? How would usability be improved here?

share|improve this question
Are you asking about this particular image / input field combination, or just background images showing behind fields in general? – JonW♦ Jan 13 at 15:04
This one in particular, although general considerations are also welcome. – randomblue Jan 13 at 15:12
We can't do reviews for individual sites / apps so I have made the question more generic so it serves more use to other people. If you want specific reviews of your examples then StackExchange isn't really the place for that. (perhaps it'd be OK in Chat maybe, but not the main question site) – JonW♦ Jan 13 at 15:55
I get your question but maybe you might consider how this question could be edited in order to be applicable to more than just your site's specific login screen - the question seems to be about this type of login screen, so maybe you can redirect discussion to that. – kontur Jan 19 at 18:08

closed as too localized by Patrick McElhaney, Benny Skogberg, dhmholley, ChrisF, Matt Obee Jan 23 at 16:23

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, see the FAQ.

3 Answers

up vote 3 down vote accepted

I believe you should be fine. The reason being the login box is subtle enough to blend with the background design but also stands out due to its color scheme . The login call to action due to its deep blue color also works well against the lighter blue of the aurora borealis since its distinctive enough.However if you are going to constantly change your background image be careful that your form elements dont get lost against the login page background.

Bing overcomes this by ensuring there is significant contrast between the background image and the front text (and logo) as shown below:

enter image description here

I recommend looking at this link 10 colour contrast checking tools to improve the accessibility of your design for some tools which can help you determine how your background text stands out against your image (You will have to use a color picker to determine the background color since none of the tools support images) since I am unable to make out if the contrast is sufficient for them.

share|improve this answer
Seconded. The contrast doesn't look sufficient to me, so worth checking – Peter Jan 12 at 15:00
up vote 1 down vote

It's nice, but I'm not sure there's enough focus on the input form. Try increasing the opacity of the form or reducing the luminosity of the image (the bright green stream is too potent in your current design).

Increasing the opacity of the form will also improve the readability of your field placeholder text.

share|improve this answer
up vote 0 down vote

It is quite clear and it doesn't distract. In fact, you can use this background image for not just branding purpose but also

-- show some new updates to your websites

-- tell some good statistics about your website

-- show promotion videos or images

share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.