CUNY Academic Commons

Boone, I think that you are right to worry about UX singletons with this. I think in general the idea of having forms or other interface elements that can dynamically appear on the page is a good idea. For example when you click to send a message to someone on their profile it might do something similar. That might benefit from some thought and a bit of research like the buttons.

• Add another button next to Friend, Mention, Message buttons for Invite to Group
• That button would take them to the Groups section of the clicker's profile (in a similar way that clicking message takes you to the messages section) where you would complete the invite process.

To illustrate some possible ideas around this I made some screenshots with notes you can see here:
http://profstein.clarify-it.com/d/kwl2y4

I'm open and interested to hear what others think. The new page I propose is in line with other ui we have on the Commons, and could potentially allow a way to invite someone to multiple groups at once, but it also has more coding and UI work. The inline quick form to do the invite is a simpler UI with potentially less coding but it adds a new UI element we haven't used or thought much about yet.

Ray - Yeah, that plugin looks pretty good. Chris/Matt, check it out in action (click on a user name): http://gtm.ovirium.com/ or check out this demo https://www.youtube.com/watch?v=cMmjt_Rpz9E

Looks good to me. Think the setting should be on hover rather than click.

I wouldn't set it to hover unless it is smart enough to know to change to click on a touch-screen device (not sure that is reliably possible across touch devices).

+1. Also hover popups are annoying, unless accompanied by a reasonable delay, in which case they may as well have been clicks.

Both clicking the gravatar/icon or the name should result in the same action.

Maybe, but then we have to decide where and when to implement this throughout the system. Does every single text link with my name turn into one of these? Put another way: I don't like the idea of inserting an extra click into the process every time you want to visit someone's profile.

the popup is more information oriented

This popup is, IMO, a failure of UX on Twitter's part. The information available in this popup is essentially a reproduction of what's available on the profile, so they should just let you go to the profile. If we're going to provide some sort of "hovercard", it should provide action items - 'visit my profile', 'add me as a friend', etc - and not be a wholesale reproduction of data available elsewhere.

Good question about whether every link turns into the popup as I think that is essentially what the plugin does or am I wrong?

It got me thinking we should perhaps add the popup shown in the plugin as a separate feature and debate the merits of that separately. I think to address the issue originally brought up here the dropdown example from Twitter does that better. It is essentially moving actions related to a user to a single button that might appear where the "Cancel Friendship | Mention User | Send Private Message" buttons appear now. Other actions like inviting to group could be added to that. It's a consolidation of user related actions under one UI element.

The popup, which could be done anywhere the person's avatar and name appear is a slightly different matter. I think the reason that Twitter reproduces the profile information in this way is so that as you're looking through a stream you can quickly check out people without going to their full profile and having to navigate back to the stream. It assumes that you're primarily interested in the main content on the page but want to take a quick dip into the other information without going away from your primary interest. As Twitter is more anonymous and likely to have tons of people you don't know I can see the sense in this.

The question is whether that is appropriate on the Commons and if changes can be made to make it fit. Again, perhaps better as a second feature request?

Chris: Thanks for the screenshots. I would disregard the Cathy idea. My intention was not to include a profile summary when you click on a name / avatar.

The question is whether that is appropriate on the Commons and if changes can be made to make it fit. Again, perhaps better as a second feature request?

I would agree that for the purposes of this ticket that it should be a separate feature request. Although, like Boone, I have my reservations about this.

About hover vs. click for the hovercard:

I wouldn't set it to hover unless it is smart enough to know to change to click on a touch-screen device (not sure that is reliably possible across touch devices).

+1. Also hover popups are annoying, unless accompanied by a reasonable delay, in which case they may as well have been clicks.

I actually don't mind hover with a delay because if I decide to click on something, I expect it to go straight to the page I want to view, not to provide me with a prompt to do something else.

• Hovercards - When you hover over an avatar, you'll see some additional info about the person that includes some action links depending if you're logged in or not. Positives are it allows you to perform actions without navigating to the user's full profile. Negatives are having too many items / action links in the hovercard that may complicate the UI.
• Profile dropdown menu - To consolidate all the profile buttons into one area. Positives are you'll see less call to actions and a simpler interface. Negatives are you'll need to educate users about the dropdown.
• Quick profile summary on click - Shows a quick profile of the user via AJAX. Positives are it avoids loading the full page (less load on the server). Negatives are it's basically a reproduction of a user's profile and could be considered an interstitual.

I know this is quickly turning into a discussion about UI, so let's make some decisions.

For this ticket, I would recommend the "Invite to Group" button approach that Chris mentioned here:
http://profstein.clarify-it.com/d/kwl2y4

Later, we can explore the UI enhancements in new, separate tickets. Although it might be worth looking at the "profile dropdown menu" option either before or after this ticket.

Let me know what everyone thinks!

it might be worth looking at the "profile dropdown menu" option either before or after this ticket.

I think that this (more than the hovercards, etc) is the best medium-to-long-term solution for the too-many-buttons problem. But you're right that it doesn't matter for right now, at least not for the first rev of this feature.

More than "Invite" button placement, I'm curious about the UI for the invitation composer itself. There'll have to be an interface for selecting the group(s) that you want to invite the user to. Do we open a lightbox?

I think it's fine to move some of the UI discussions to separate tickets. As inelegant as the Invite-to-Group button is, it is simple and straightfoward for this round.

Boone, my gut is telling me that for now it would be better to have a separate page devoted to the invite much as it is with our other invitations (and could probably reuse the code) and not do a lightbox. As we move to add other changes and refinements to the UI that could be revisited.

If we do have more time this round or move quickly to the next, adding the dropdown to the profile is what I would vote for pursuing next.