**Adding sentences to lists in new sentence design**
I have deployed on the dev website the implementation of the list feature in the new sentence design. I think it's more or less complete and I will need some feedback.
The list feature in the new sentence design is quite different from the old one. Please try it out and let me know if it does feel better to use (or at least not worse).
Dev website: https://dev.tatoeba.org/
Note that you will need to enable the new sentence design in your Settings.
You may want to precise that what needs testing is the "Add to list" button in the new sentence design. Not the whole "list feature". Right?
Yes, not the whole list feature. Just the "Add to list" button in the new sentence design.
I've quickly checked the functionality on PC and smartphone, and the feeling is good. Some remarks:
- "CONFIRM" might be more intuitive than "CLOSE". Close has this "cancel" feeling, giving the impression that our changes will be lost, and looking for the saving option.
- Only three sentences displayed is two few, in my opinion. It forces to scroll and the space is too narrow to be able to follow the scrolling comfortably.
- I don't know if the displayed lists are in any specific order right now, but it may give a better feeling if they were listed in a meaningful way, i.e. in alphabetical order.
> "CONFIRM" might be more intuitive than "CLOSE". Close has this
> "cancel" feeling, giving the impression that our changes will be lost,
> and looking for the saving option.
But at the same time, I wouldn't want to give the impression that you must click on that button to save your selection of lists. The sentences are already being added as soon as you check the checkbox.
> Only three sentences displayed is two few, in my opinion. It forces to scroll
> and the space is too narrow to be able to follow the scrolling comfortably.
We can increase to 5 items. I'm not sure how many items would be enough for you?
> I don't know if the displayed lists are in any specific order right now
Currently it's ordered this way:
- If you have selected a list before, then the first item will always be the last list that you selected.
- Otherwise, the lists are divided in two categories: your lists, other collaborative lists. Your lists are displayed first.
- Within each category, the lists are ordered by "modified" date (last modified first).
It looks very nice and feels intuitive! A few comments.
Open the box, type something, close the box, open it again: the text I entered is still there. I think it should be cleared.
I don’t like the wording "Your most recent lists" because it’s both unclear and inaccurate. "Your" suggests that I am the owner, while it’s not the case: other people’s lists can show up too (for example, if the last selected list is a collaborative list). "recent" is also unclear: what is recent? Last recently created? Last recently seen?" Finally, lists that are not "recent" in any way appear too, just because I’m the creator.
It looks like when the sentence already belongs to a list, the list doesn’t show up. I didn’t expect that because you are using the checkbox pattern. Instead, after clicking the "add to list" button, or after typing something, I expected to see lists that this sentence already belongs to showing up as checked. Not seeing a list showing up also makes me wonder I made a typo or something.
It looks like you’re using bold to indicate "you’re the owner". This wasn’t really easy to understand for me because the first time I opened the box, it only showed my own lists, so everything was in bold, so I had nothing to compare that could have helped me guess the meaning. There might be a better way to indicate that; or do we really need to indicate that information after all?
The button name "create" is inaccurate because it both creates a list and add the sentence to it. I have no suggestion for a better and short enough wording though.
There is a substantial lag between clicking the "create" button and seeing the result of that action. I think a loading spinner would make the process feel smoother.
I guess the "(last selected)" label is a remain of the old design? I don’t think this feature makes sense in the new design because it’s a multi-selection list and you can type to search anyway. When first opening the box, the entire list could be consisting of "last selected" lists sorted by "last selected first".
> Open the box, type something, close the box, open it again: the text I entered
> is still there. I think it should be cleared.
> I don’t like the wording "Your most recent lists" because it’s both unclear
> and inaccurate. "Your" suggests that I am the owner, while it’s not the case
It's actually almost the case. The initial items displayed are only your own lists, with the exception that the very first item can be any list that you have selected last.
To explain how it ended up this way, I first decided to keep the same order as in the old design:
- the current user's lists first (ordered alphabetically)
- then all the collaborative lists (ordered alphabetically)
However, displaying hundreds of item in a md-list leads to pretty poor performances. The sentence component would take too long to render. So my first thought was to display only the current user's lists and have the collaborative lists only appear upon search. But some users could have hundreds of lists, so that won't help. Hence the idea of displaying only the current user's lists, but limited to an arbitrary amount (I chose 10).
So when you open the list form for the first time, you will only see your own lists with a maximum of 10 lists. I decided to order the lists by `modified` date under the assumption that you'll more likely want to add a sentence in a list which has been more recently modified.
That's why the subheader text is "Your most recent lists". But it's true that "recent" is quite ambiguous. A more accurate subheader text could be "Your last selected list (if any) and last updated lists", but it sounds a bit awkward...
Aside of that, I'm not fully satisfied of this solution either and I did consider displaying the 10 last selected lists ordered by last selected first, as you suggested, but I chose to leave this for another iteration together with the next point:
> It looks like when the sentence already belongs to a list, the list doesn’t
> show up. I didn’t expect that because you are using the checkbox pattern.
Yes, when a sentence already belongs to a list, it won't show up, except if you have just added the sentence to the list and haven't refreshed the page yet.
I agree it's confusing. For me, I have to say it's not really the checkbox pattern that causes the confusion. I've had this issue already in the old design.
If I have a list "test" and I open a dropdown on a sentence and don't see "test" in there, I don't instinctively think "Right, I already added my sentence to that list". I instead scan a couple of times through the items in the dropdown to make sure I didn't miss it, then I sometimes even end up thinking "did my list get deleted?" or doubting that I ever had such a list. Then only, I remember that "test" isn't displayed because the sentence has already been added to that list.
The target design should definitely be that all available lists are displayed and the checkbox is checked if the list already contains the sentence.
> It looks like you’re using bold to indicate "you’re the owner".
> There might be a better way to indicate that; or do we really
> need to indicate that information after all?
I couldn't think of a good way so I went for the bold text since we have a similar pattern with the language selector (languages in bold are the ones in your profile).
It's true that it's not really necessary. I made the text bold when the implementation had all lists displayed (instead of just 10 lists) so at that point it made more sense.
The only case would be if someone else made a collaborative list that has the exact same name as one of your lists. Then you would need some ways to distinguish the your list from the other list. But this case is better solved if we add somewhere the name of the creator of the list.
> The button name "create" is inaccurate because it both creates a list
> and add the sentence to it. I have no suggestion for a better and short
> enough wording though.
"Create and add" or "Add to new list" were two possibilities I thought about. But in the end I felt it was easy enough to understand that "Create" implicitly means "Create list and add sentence to that list". The context in which the list is created leads you anyway to expect that the sentence will be added to that list. And if your intention was only to create the list but not add the sentence, then you can easily remove the sentence by unchecking the checkbox.
> There is a substantial lag between clicking the "create" button
> and seeing the result of that action. I think a loading spinner
> would make the process feel smoother.
Will do. I didn't feel any lag in my tests but it doesn't cost much to add a loader.
> I guess the "(last selected)" label is a remain of the old design?
Yes, the "last selected" list is meant to replace the behavior in the old design where the last selected list can be preselected in the dropdown the next time you load a page with a sentence. This is not the default behavior though, it's an option you have to enable in your Settings ("Remember the last list...").
This feature saves you time when you are in the process of filling up a specific list and are browsing/searching sentences for it.
Again, the final behavior should be that you have by default your last selected lists displayed (instead of your last updated lists), but that would be for another iteration.
[not needed anymore - removed by CK]
You have to go to a page where the new design is implemented, for example a search results page. From there, the "add to list" button is the thing to be tested.
[not needed anymore - removed by CK]
The problem with using a single, static button caption, whether it's "close" or "confirm", is that the function of the button differs depending on whether any checkboxes have been selected. If none are selected, the button acts like a "close", but if at least one is selected, the button acts like a "confirm". One option would be to change the title of the button dynamically depending on whether any checkboxes are selected.
The situation is complicated because of another issue: It wasn't immediately clear how to cancel out of the whole process of adding to lists, other than by deselecting every list that I had already selected (which is not too painful, unless people are going to try to add sentences to large numbers of lists at once, and then back out of it). It seems that clicking again on the list icon suspends the "add to list" operation, and going to another page and then back to the original one will deselect the items that had originally been selected. If we think that people will figure this out, either intuitively or via experimentation, fine. Otherwise, maybe we should have two buttons, "Cancel" and "OK", perhaps with the "OK" button disabled unless one or more items is selected.
I just noticed above that Trang said this:
> But at the same time, I wouldn't want to give the impression that you must click on that button to save your selection of lists. The sentences are already being added as soon as you check the checkbox
so this part of what I wrote:
> if at least one is selected, the button acts like a "confirm"
is not true.
The idea that checking a checkbox immediately adds a sentence to a list, without requiring a confirmation step, does not match my expectation, especially since there's no easy way to remove it again. However, Trang said that she's going to revisit the way this functionality works, so I'll have to test it again.
Yes, it has been reworked. I added a loading animation when the sentence is being added/removed to a list. I hope it will make it more intuitive that there's no need to confirm the lists selection.
I confirmed that selecting a checkbox immediately adds a sentence to a list and deselecting immediately removes it from the list, and that "Close" simply closes the dialog. And yes, the new animation does make things a bit more clear. I'm glad that there's a way to immediately deselect a sentence from a list if I click the wrong thing or change my mind.
I took into account the feedback and deployed some changes on the dev website.
For more details about the implementation, see the description of the corresponding pull request:
Thanks for testing!