Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

Whats the best-practice way to input a column of emails that associate with different people- a la: list of emails

My worry is that all the blue buttons and call to actions look cluttered and feels overwhelming

Edit: thanks for the reply- what if instead of graying out buttons or hiding them just having one invite button? Is it satisfying to enter an email without having it invite the person right away? button

share|improve this question

4 Answers 4

I would agree repeating the blue button isn't ideal, and not just for the reason it feels cluttered and overwhelming. Also it feels laborious because you have click each button in order to submit it.

Basecamp provides a really nice option here for you. Here they give a few lines to input a few email addresses and once you put in 3 email addresses, the form just keeps adding another line after it. Then you can tailor a message, if you so choose, to the people you've just selected and submit a button to send out an email to the entire group.

Basecamp FTW

share|improve this answer
    
Great example! Thanks! –  Monica H May 21 at 4:56
    
How would this work with a predefined list of names, like in the question? –  Vitaly Mijiritsky May 21 at 5:13
    
@VitalyMijiritsky The way it works within Basecamp at least is that as you start typing a name, it tries to find them in your group. If it finds them (you've previously entered their email), it puts their name in there. If not, you just provide the email address. Once a user logs in, they can add their preferred name. –  Hynes May 21 at 12:23
    
It seems like a rather different use case than providing emails for a predefined list of names where you need to cover the entire list. –  Vitaly Mijiritsky May 22 at 6:00

Try hiding the button until they type something in the box. Here's something I whipped up in MS Paint really fast:

enter image description here

Or maybe greying them out, like this:

enter image description here

share|improve this answer
    
Would it be clear if maybe there was just 1 invite button like so? !button –  Monica H May 21 at 4:48
    
^ Sorry- website is being weird. This is what I meant to write "Hey- great ideas- I added another thought to the original post up above. My concern is if it is (confusing sentence so far) clear that invites arent sent until you hit invite" –  Monica H May 21 at 4:55

The option that you first describe works well where you already know the invitees and their names/emails are written inside boxes and you can invite one/any/all of them by clicking Invite button against their name/email.

I agree Hynes. Another similar option can be as shown in the attached image from Facebook. You can enter all email IDs in a box (just like in any email tool), and click a single Invite button.

enter image description here

share|improve this answer

Your 2nd mockup is a great way. But if you believe that you must send the invites as soon as there's an address, you can just send them automatically when the field loses focus and there's a valid address inside. To give the user a chance to double-check the address, you can add a short delay with a visible countdown, like this:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

The problem here is with the last field, since there's no next field to tab into, users might not figure out how to make the field lose focus - so there's also a Finish button for them to press.

But personally I believe that this is a serious overkill and your 2nd mockup is fine.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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