<html>
<head>
<meta content="text/html; charset=windows-1252"
http-equiv="Content-Type">
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p>I agree with this needing to be less verbose. When multiple
filters are applied, the bar will become crowded. Perhaps an icon
instead of "select all 90 items in this table" would work better?</p>
Dan<br>
<br>
<div class="moz-cite-prefix">On 10/19/16 10:45 AM, Liz Clayton
wrote:<br>
</div>
<blockquote
cite="mid:CAAf=RDkcpSGuS9m7Z59xZ6vVXgzQH4NPRQ6+yWpwLd2J03Qrvw@mail.gmail.com"
type="cite">
<div dir="ltr">Hi,<br>
<div class="gmail_extra"><br>
<div class="gmail_quote">On Wed, Oct 19, 2016 at 10:07 AM, SJ
Cox <span dir="ltr"><<a moz-do-not-send="true"
href="mailto:sjcox@redhat.com" target="_blank">sjcox@redhat.com</a>></span>
wrote:<br>
<blockquote class="gmail_quote" style="margin:0px 0px 0px
0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">
<div dir="ltr">Thank you for all the feedback!
<div><br>
</div>
<div>And I agree with option 2 as well. Catherine, to
answer your questions, that bar is always there. That
bar is shared to show filters and selection and just
updates as filters are added and selection changes.</div>
<div><br>
</div>
<div>This is also the reason that selection is on the
right as opposed to the left. When filters are added,
they appear under the filter field, which is on the
left. That is another con with this design is that it
could potentially run out of room in that bar when a
certain amount of filters are added. In that case
should we add another row for filters of just truncate
the filters with a ... and then have a way to show all
(Which would still add another row, or perhaps a drop
down?).</div>
</div>
</blockquote>
<div><br>
</div>
<div>
<div>Just wondering about the table selection labels
themselves. Do we have a standpoint on the language
used? They seem more narrative ("Select all 90 items in
this table."), versus something less verbose like: </div>
<div>
<p class="gmail-m_-5890018340245862179gmail-p1">Selection:
18 (of 90) | <font color="#3d85c6">Select All</font></p>
<p class="gmail-m_-5890018340245862179gmail-p1">Selection:
All (90 of 90) | <font color="#3d85c6">Clear </font><font
color="#3d85c6"><br>
</font><font color="#000000"><br>
or something like that... Something more concise
might be useful when the applied filters are in
view. </font></p>
</div>
</div>
<div>Liz C.</div>
<div> </div>
<blockquote class="gmail_quote" style="margin:0px 0px 0px
0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">
<div dir="ltr">
<div><br>
</div>
<div>Also Matt, item selection should be consistent
across all data views so thanks for bringing that to
our attention!</div>
<div><br>
</div>
<div>Thank you!</div>
<div>SJ</div>
</div>
<div class="gmail_extra"><br>
<div class="gmail_quote">On Wed, Oct 19, 2016 at 6:37
AM, Matt Carrano <span dir="ltr"><<a
moz-do-not-send="true"
href="mailto:mcarrano@redhat.com" target="_blank">mcarrano@redhat.com</a>></span>
wrote:<br>
<blockquote class="gmail_quote" style="margin:0px 0px
0px
0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">
<div dir="ltr">
<div>
<div>I also like option 2 as I don't see a need
to insert a new row. But I have a similar
question to Catherine's. My expectation is
that this Select All action is always there
(no need to prompt). I also think you could
shorten this to drop the "in this table" from
the end. So the row would be something like:
18 of 90 Items Selected | <u>Select All 90
Items </u>I've done something similar to
this in my Storage designs.<br>
<u><br>
</u></div>
I'm also wondering why this text is on the right
rather than the left (I've been putting it on
the left). Looking at the PF library, I notice
this is on the left for list view but on the
right for table view. Is that inconsistency
intentional?<br>
<br>
</div>
Matt<br>
</div>
<div class="gmail_extra">
<div>
<div class="gmail-m_8810010101473651260h5"><br>
<div class="gmail_quote">On Wed, Oct 19, 2016
at 9:25 AM, Catherine Robson <span
dir="ltr"><<a moz-do-not-send="true"
href="mailto:crobson@redhat.com"
target="_blank">crobson@redhat.com</a>></span>
wrote:<br>
<blockquote class="gmail_quote"
style="margin:0px 0px 0px
0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">
<div dir="ltr">Option 2 makes more sense
around having consolidated content about
your selections, but when does that bar
show up? Is that bar always there and
has 0 out of 90 items selected by
default, and then just updates as
selections change? </div>
<div
class="gmail-m_8810010101473651260m_4605720137772489152HOEnZb">
<div
class="gmail-m_8810010101473651260m_4605720137772489152h5">
<div class="gmail_extra"><br>
<div class="gmail_quote">On Tue, Oct
18, 2016 at 6:01 PM, Allie Jacobs
<span dir="ltr"><<a
moz-do-not-send="true"
href="mailto:ajacobs@redhat.com"
target="_blank">ajacobs@redhat.com</a>></span>
wrote:<br>
<blockquote class="gmail_quote"
style="margin:0px 0px 0px
0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">
<div dir="ltr">Hey SJ,
<div><br>
</div>
<div>Great job thinking
through the pros and cons.
Option 1 seems familiar
(gmail) but I think option 2
is more elegant. It may not
be as obvious / familiar but
the select all link is
readily available in an area
that makes sense. </div>
<div><br>
</div>
<div>Allie</div>
</div>
<div class="gmail_extra"><br>
<div class="gmail_quote">
<div>
<div
class="gmail-m_8810010101473651260m_4605720137772489152m_771671770038693631h5">On
Tue, Oct 18, 2016 at
2:36 PM, SJ Cox <span
dir="ltr"><<a
moz-do-not-send="true"
href="mailto:sjcox@redhat.com" target="_blank">sjcox@redhat.com</a>></span>
wrote:<br>
</div>
</div>
<blockquote
class="gmail_quote"
style="margin:0px 0px 0px
0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">
<div>
<div
class="gmail-m_8810010101473651260m_4605720137772489152m_771671770038693631h5">
<div dir="ltr">Hello
fellow
PatternFlyers!
<div><br>
</div>
<div>This sprint I'm
working on the
conceptual design
for pagination
across data tables
(includes card and
list view)</div>
<div><br>
</div>
<div>I wanted to
share my thoughts
and progress and
see if anyone had
any concerns or
feedback based on
what is being done
with tables in
products to date.
What works, what
doesn't?</div>
<div><br>
</div>
<div>With the
addition of
pagination, all
elements/controls
related to
pagination would
be found on the
bottom of the
table. This
includes:</div>
<div>
<div>
<ul>
<li>See the
number of
items on a
page and total
number of
pages<br>
</li>
<li>See how
many pages of
data there is.<br>
</li>
<li>View which
page you are
on (current
location)<br>
</li>
<li>Modify how
many pages are
being
displayed.<br>
</li>
<li>Skip to
the next or
previous page.<br>
</li>
<li>Skip
multiple
pages.<br>
</li>
<li>Navigate
to the
first/last
page.</li>
</ul>
</div>
</div>
<div>With this story
we wanted to add
the ability to
select all items
across multiple
pages. Initially,
if you select all
on a page, it will
select all items
only on that page.
Then it would
prompt the user to
select all items
across the table.
I came up with two
options for the
"select all"
option.</div>
<div><br>
</div>
<div><b>OPTION 1</b></div>
<div><br>
</div>
<div><img
src="cid:part6.371317C3.AA25F37E@redhat.com"
alt="Inline
image 2"
height="399"
width="523"> <img
src="cid:part7.7B9B30B8.96184F3A@redhat.com" alt="Inline image 3"
height="415"
width="523"><br>
</div>
<div>The first
option above shows
a new row
appearing within
the table under
the row headers,
in the form of a
message. This
message informs
you of how many
items are selected
and gives you the
ability to select
all. Once all are
selected, you have
the ability to
clear selection
from the within
the same message. </div>
<div><br>
</div>
<div>Also, what
would happen as
you page through
the table? I've
seen it behave
differently. In
google, as you
page through, the
selection is
cleared. In this
design I didn't
think that would
be a great
experience. </div>
<div><br>
</div>
<div><u>Option 1
Pros</u>: the
addition of the
message row is
obvious and will
draw the users
attention.</div>
<div><u>Option 1
Cons:</u> Table
height would have
to adjust to
accommodate new
message row.
Also, does the
placement of the
message make sense
under the row
headers?
Furthermore, it's
redundant to show
the number of
items shown twice
(upper right, and
in message)</div>
<div><br>
</div>
<div><br>
</div>
<div><b>OPTION 2</b></div>
<div><b><br>
</b></div>
<div>Option two
addresses the cons
of option 1.
When selecting all
items within a
page, you get
prompted to select
all items within
the table next to
where it shows you
total number of
items selected.
Same with clearing
selection.</div>
<div><br>
</div>
<div><img
src="cid:part8.68BF704D.635B5E62@redhat.com"
alt="Inline
image 5"
height="400"
width="523"><br>
</div>
<div><img
src="cid:part9.1F95264A.D51F3AE4@redhat.com"
alt="Inline
image 6"
height="399"
width="523"><br>
</div>
<div><br>
</div>
<div><u>Option 2
Pros</u>: No
need for creating
a new message row
and shifting the
table down. No
redundant info.</div>
<div><u>Option 3
Cons</u>: Might
not be obvious
that you can
select all items.
Does is seem
hidden?</div>
<div><br>
</div>
<div><br>
</div>
<div>Let me know
your thoughts,
thank you!</div>
<span
class="gmail-m_8810010101473651260m_4605720137772489152m_771671770038693631m_-6462836521891410816HOEnZb"><font
color="#888888">
<div><br>
<div>
<div><br>
</div>
-- <br>
<div
class="gmail-m_8810010101473651260m_4605720137772489152m_771671770038693631m_-6462836521891410816m_-5512385946235657224gmail_signature">
<div dir="ltr">
<table
style="border-collapse:collapse;border:none;font-family:'helvetica
neue';font-size:14px" cellpadding="0" cellspacing="0" width="530">
<tbody>
<tr>
<td
style="border:0px
solid
rgb(1,1,1)"
align="left"
valign="top"
width="257">
<div
align="left"><font
color="#cc0000"><font face="Arial" size="2"><span style="font-size:10pt"><b>Sarah
Jane Cox</b></span></font> </font><font
face="Calibri"
color="#010101"><span style="font-size:11pt"><br>
</span></font>
<font
color="#999999"><font
face="Arial"
size="1"><span
style="font-size:9pt">User Interaction Designer</span></font> <font
face="Calibri"><span
style="font-size:11pt"><br>
</span></font>
</font><font
face="Arial"
size="1"><span
style="font-size:9pt"><font color="#999999">User Experience Design Team<br>
</font><br>
</span></font><a
moz-do-not-send="true"
href="http://www.redhat.com/about/whoisredhat/redhatstories.html?intcmp=70160000000TB9vAAG&"
target="_blank"><font face="arial, helvetica, sans-serif"
color="#3d85c6"
size="2">Red
Hat, Inc.</font></a><font
face="Arial"
color="#404040"
size="1"><span
style="font-size:9pt"><br>
</span></font></div>
</td>
<td
style="border:0px
solid
rgb(1,1,1)"
align="left"
valign="top"
width="272">
<div
align="left"><br>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</font></span></div>
<br>
</div>
</div>
______________________________<wbr>_________________<br>
Patternfly mailing list<br>
<a moz-do-not-send="true"
href="mailto:Patternfly@redhat.com" target="_blank">Patternfly@redhat.com</a><br>
<a moz-do-not-send="true"
href="https://www.redhat.com/mailman/listinfo/patternfly"
rel="noreferrer"
target="_blank">https://www.redhat.com/mailman<wbr>/listinfo/patternfly</a><br>
<br>
</blockquote>
</div>
<span
class="gmail-m_8810010101473651260m_4605720137772489152m_771671770038693631HOEnZb"><font
color="#888888"><br>
<br clear="all">
<div><br>
</div>
-- <br>
<div
class="gmail-m_8810010101473651260m_4605720137772489152m_771671770038693631m_-6462836521891410816gmail_signature">
<div dir="ltr">
<div><br>
</div>
Allie Jacobs<br>
UXD
<p><span><a
moz-do-not-send="true"
href="https://www.google.com/calendar/b/1/embed?src=ajacobs@redhat.com&ctz=America/New_York"
target="_blank">calendar</a></span></p>
</div>
</div>
</font></span></div>
<br>
______________________________<wbr>_________________<br>
Patternfly mailing list<br>
<a moz-do-not-send="true"
href="mailto:Patternfly@redhat.com"
target="_blank">Patternfly@redhat.com</a><br>
<a moz-do-not-send="true"
href="https://www.redhat.com/mailman/listinfo/patternfly"
rel="noreferrer"
target="_blank">https://www.redhat.com/mailman<wbr>/listinfo/patternfly</a><br>
<br>
</blockquote>
</div>
<br>
</div>
</div>
</div>
<br>
______________________________<wbr>_________________<br>
Patternfly mailing list<br>
<a moz-do-not-send="true"
href="mailto:Patternfly@redhat.com"
target="_blank">Patternfly@redhat.com</a><br>
<a moz-do-not-send="true"
href="https://www.redhat.com/mailman/listinfo/patternfly"
rel="noreferrer" target="_blank">https://www.redhat.com/mailman<wbr>/listinfo/patternfly</a><br>
<br>
</blockquote>
</div>
<br>
<br clear="all">
<span class="gmail-HOEnZb"><font
color="#888888"><br>
-- <br>
</font></span></div>
</div>
<span class="gmail-HOEnZb"><font color="#888888"><span
class="gmail-m_8810010101473651260HOEnZb"><font
color="#888888">
<div
class="gmail-m_8810010101473651260m_4605720137772489152gmail_signature">
<div dir="ltr">
<div>
<div>
<div>Matt Carrano<br>
</div>
Sr. Interaction Designer<br>
</div>
Red Hat, Inc.<br>
</div>
<a moz-do-not-send="true"
href="mailto:mcarrano@redhat.com"
target="_blank">mcarrano@redhat.com</a><br>
</div>
</div>
</font></span></font></span></div>
<span class="gmail-HOEnZb"><font color="#888888">
</font></span></blockquote>
</div>
<span class="gmail-HOEnZb"><font color="#888888"><br>
<br clear="all">
<div><br>
</div>
-- <br>
<div
class="gmail-m_8810010101473651260gmail_signature">
<div dir="ltr">
<table
style="border-collapse:collapse;border:none;font-family:'helvetica
neue';font-size:14px" cellpadding="0"
cellspacing="0" width="530">
<tbody>
<tr>
<td style="border:0px solid rgb(1,1,1)"
align="left" valign="top" width="257">
<div align="left"><font color="#cc0000"><font
face="Arial" size="2"><span
style="font-size:10pt"><b>Sarah
Jane Cox</b></span></font> </font><font
face="Calibri" color="#010101"><span
style="font-size:11pt"><br>
</span></font> <font
color="#999999"><font face="Arial"
size="1"><span
style="font-size:9pt">User
Interaction Designer</span></font> <font
face="Calibri"><span
style="font-size:11pt"><br>
</span></font> </font><font
face="Arial" size="1"><span
style="font-size:9pt"><font
color="#999999">User Experience
Design Team<br>
</font><br>
</span></font><a
moz-do-not-send="true"
href="http://www.redhat.com/about/whoisredhat/redhatstories.html?intcmp=70160000000TB9vAAG&"
target="_blank"><font face="arial,
helvetica, sans-serif"
color="#3d85c6" size="2">Red Hat,
Inc.</font></a><font face="Arial"
color="#404040" size="1"><span
style="font-size:9pt"><br>
</span></font></div>
</td>
<td style="border:0px solid rgb(1,1,1)"
align="left" valign="top" width="272">
<div align="left"><br>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</font></span></div>
<br>
______________________________<wbr>_________________<br>
Patternfly mailing list<br>
<a moz-do-not-send="true"
href="mailto:Patternfly@redhat.com">Patternfly@redhat.com</a><br>
<a moz-do-not-send="true"
href="https://www.redhat.com/mailman/listinfo/patternfly"
rel="noreferrer" target="_blank">https://www.redhat.com/<wbr>mailman/listinfo/patternfly</a><br>
<br>
</blockquote>
</div>
<br>
</div>
</div>
<br>
<fieldset class="mimeAttachmentHeader"></fieldset>
<br>
<pre wrap="">_______________________________________________
Patternfly mailing list
<a class="moz-txt-link-abbreviated" href="mailto:Patternfly@redhat.com">Patternfly@redhat.com</a>
<a class="moz-txt-link-freetext" href="https://www.redhat.com/mailman/listinfo/patternfly">https://www.redhat.com/mailman/listinfo/patternfly</a>
</pre>
</blockquote>
<br>
</body>
</html>