4

I'm currently redesigning a member profile page and wondered if anyone had a creative way to show having multiple connected/authorized social media accounts linked to their profile. For example, I have an account on StackExchange, and I want to link 3 other social media accounts (Google+, LinkedIn, Twitter, whatever).

I'd like to show a simple way for the user to be able to add/remove one of these accounts with the least amount of clicks, and use OAuth. I'm attaching my wireframe idea for it here. Any other thoughts?

enter image description here

2 Answers 2

4

There are a lot of social networks, but only some are popular. So you could design the dialog which allows to connect to the popular platforms in a quick way, displaying appropriate buttons, and propose to select other platforms with additional control.
enter image description here
Connected platforms are visually distinct and ordered. This allows to perceive information faster.

The advantages are:

  • Reduced information overload, as only small (reasonable) number of items are displayed
  • Clear interface. Add and Remove labels create visual noise. Use tooltip instead, as the buttons thyself express affordance.
  • One-click selection of a popular platform (assuming its probability)
1
  • Thoughtful input, @Alexey – very appreciated. We've decided which social networks are the most valuable/likely to be used by our specific audience, so are not too worried about showing more than a few options. This may change with time and feedback, of course. So, if there were more than a few, I do like your show/hide with "Connect to others". I also like the addition of tooltips.
    – Duskus
    Nov 12, 2013 at 16:05
3

In my opinion, your screen is one of the most efficient that i have seen.

• The "add" and "remove" links are important to reassure the user. Maybe you can just show these on roll-over to avoid visual noise.

• 1 column list is easier to embrace all the options and make a confident choice

• if you want to cover a lot of social network, you can show the most used ones and add a dropdown for the others as suggested by Alexey

• I used to put the action buttons the right to make a cleardissociation

Good luck and please show us the final result

2
  • I would disagree with removing the add/remove links from default view. That would reduce the discoverability of these options.
    – JonW
    Nov 12, 2013 at 15:51
  • Thanks, @Renaud. I currently still agree that having the simple Add/Remove prompts help with clarity; particularly with our older users (medical), where some have social channels, but are still adapting their use. Again, I do like the rollover/hover idea.
    – Duskus
    Nov 12, 2013 at 16:08

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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