[Kimchi-devel] UI Extension Proposal - Same Action on Multiple List Elements

Thu Oct 22 09:03:00 UTC 2015

Hi Samuel,

I like your proposal shown in the attached screenshots. I would only 
change the button labels 'Download All' and 'Remove All' on 3.png to 
'Download' and 'Remove' like on the two other screenshots. The user 
might interpret 'Remove All' and 'Download All' in a way that it affects 
all list items - not only the selected ones.

In your proposal all items of the former 'Actions' combo box are now 
permanently visible. I like this approach. Compared to the 'Action' 
combo boxes it needs more space but improves usability.

Ginger host management will add a lot of new panels. To get a consistent 
look and feel we also need to re-arrange the existing panels which will 
reduce/solve the restrictions in panel width. I will start a discussion 
on this in the Ginger community.

One important point I would like to state at the end:
The design discussions should show the way we want to go. I do not 
expect that we can implement all these ideas by end of 2015. Let's be 
pragmatic on what is possible in the first step.

Kind regards
Jan

On 10/21/2015 04:54 PM, Samuel Henrique De Oliveira Guimaraes wrote:
> Hi Jan,
>
> Sorry for the delay, I got stuck rebasing my patches and working in the new-ui and I forgot to reply.
>
> I drew a quick mockup with Chrome and the screenshots are attached. The main problem is that these fonts are very small compared to the other UI elements in high resolution. We would have to resize "Basic Information" panel by half its width and expand Debug Reports and Repositories. But if we follow the new proposals for Host/Admin in Gingerbase, then we'll have Basic Information with 100% screen width and inline fields instead of blocks below the dashboard; Debug Reports and User Management can keep 50% - 50% screen width in Administration and Repositories can be 100% with Software Updates and Firmware Updates.
>
> Screenshots:
> 1.png = none selected
> 2.png = one item selected
> 3.png = multiple items selected
>
> Light gray buttons = disabled state
>
> Regards,
> Samuel
>
> -----Original Message-----
> From: Jan Schneider [mailto:schneidj at linux.vnet.ibm.com]
> Sent: quarta-feira, 21 de outubro de 2015 11:40
> To: Samuel Henrique De Oliveira Guimaraes <samuel.guimaraes at eldorado.org.br>; Aline Manera <alinefm at linux.vnet.ibm.com>
> Cc: kimchi-devel at ovirt.org
> Subject: Re: [Kimchi-devel] UI Extension Proposal - Same Action on Multiple List Elements
>
> Hello Samuel,
>
> I did not find a response mail from you - maybe I deleted it by error.
> Therefore I resend this mail.
>
> Kind regards
> Jan
>
>
>
> On 10/09/2015 11:36 AM, Jan Schneider wrote:
>> Hello Samuel,
>>
>> I think we both agree that from a usage perspective we should support
>> an action for multiple list elements.
>> Please correct me if I am wrong.
>>
>> The next question is how to implement this.
>>
>> We currently have an action combo box for each list element. With an
>> action combo box for the whole list we can do both:
>> 1) Action for a single list element
>> 2) Action for multiple list elements
>>
>> Depending on the selection the possible actions may change. There are
>> also actions which can only be executed on a single list element.
>>
>> We definitely need further discussions on this.
>>
>> Kind regards
>> Jan
>>
>>
>>
>>
>> On 10/08/2015 09:24 PM, Samuel Henrique De Oliveira Guimaraes wrote:
>>> Hi team,
>>>
>>> When I was updating wok.grid.js and I asked Atreeye to create
>>> wok.list.js we discussed if we should set a parameter to choose
>>> between action buttons on top or left of each item (in case we had
>>> only wok.grid.js) or create this new widget for the Debug Reports and
>>> Repositories. However, when I implemented this in the new-ui and
>>> started playing with these buttons, I noticed some anti-patterns.
>>> If you look into the attached images (debug_reports.jpg and
>>> repositories.jpg), you can see that the active line enters in the
>>> "selected" state. When you click outside this area, the list item
>>> keeps selected but the drop-down menu is hidden. In addition to that,
>>> the "Add / Generate" buttons are in the panel context, not just the
>>> active item on the lists. I'm attaching a mockup with these buttons
>>> on top and the context menus on the left (button_top.jpg).
>>> There's also the iOS pattern that is recommended on the mobile
>>> mockups that Susan forwarded to me (mobile.jpg). If we agree that the
>>> mobile design should take this pattern, then we'll have to update
>>> wok.grid.js and merge with wok.list.js, adding the suggested behavior
>>> for mobile devices. I think we can use the same pattern on the
>>> desktop, but there are some points that we should agree before we
>>> start developing it. For instance, if I select multiple repositories
>>> and one of them is disabled and the other ones enabled, I believe we
>>> should have action links such as "Enable All / Disable all". For
>>> Debug Reports, I'm not sure If iOS allows to download files so we
>>> could show a "Download All" only for Android devices.
>>>
>>> Regards,
>>> Samuel
>>>
>>> -----Original Message-----
>>> From: kimchi-devel-bounces at ovirt.org
>>> [mailto:kimchi-devel-bounces at ovirt.org] On Behalf Of Jan Schneider
>>> Sent: quinta-feira, 8 de outubro de 2015 13:29
>>> To: Aline Manera <alinefm at linux.vnet.ibm.com>; kimchi-devel at ovirt.org
>>> Subject: [Kimchi-devel] UI Extension Proposal - Same Action on
>>> Multiple List Elements
>>>
>>> Hello Aline,
>>>
>>> we often have use cases that a user wants to perform the same action
>>> for multiple list elements.
>>>
>>> The User Interface Design Specification - Kimchi, 2014-12-23 forces
>>> the user to do this separately for each list element.
>>>
>>> We should discuss if this meets the user needs (at least for new
>>> functionalities).
>>>
>>> Kind regards
>>> Jan
>>>
>>> _______________________________________________
>>> Kimchi-devel mailing list
>>> Kimchi-devel at ovirt.org
>>> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
>> _______________________________________________
>> Kimchi-devel mailing list
>> Kimchi-devel at ovirt.org
>> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
>>