[prev in list] [next in list] [prev in thread] [next in thread] 

List:       kde-usability
Subject:    Re: [KDE Usability] Review Request: Improve contact list group header
From:       "Martin Klapetek" <martin.klapetek () gmail ! com>
Date:       2013-01-04 10:37:41
Message-ID: 20130104103741.29640.73939 () vidsolbach ! de
[Download RAW message or body]

[Attachment #2 (multipart/alternative)]


> On Nov. 20, 2012, 1:12 p.m., Heiko Tietze wrote:
> > I dislike the idea to apply grouping by an icon or symbol, because the =
items couldn't be easily considered as in- or out-group. If you run a pictu=
re search for "accordion widget" you will find most widgets with +/- soluti=
ons (as Bj=C3=B6rn Balazs recommends), some with triangle up/down and a few=
 with down/left (pinned at left side). I guess the right side is preserved =
for properties and therefore seldom used for such "high frequency functions=
".
> > Normal treeview have indents, as Lasath Fernando recommends. Addionally=
 you may add space, bevel, splitter or the like between groups (was it the =
"tiny line"?). And last but not least group headers should be designed diff=
erent to normal entries beacause they haven't same functionality.

"I dislike the idea to apply grouping by an icon or symbol, because the ite=
ms couldn't be easily considered as in- or out-group. If you run a picture =
search for "accordion widget" you will find most widgets with +/- solutions=
 (as Bj=C3=B6rn Balazs recommends), some with triangle up/down and a few wi=
th down/left (pinned at left side)."

We had the triangle thingy before, I just moved it to the right. I'll try s=
wapping it with the group icon back then.

"Normal treeview have indents, as Lasath Fernando recommends."

We don't have any indent right now and it works and to be honest, I don't w=
ant to add the indent now as they are used as an visual aid in otherwise ho=
mogeneous (multilevel) lists (like folders tree in Dolphin). If we will alw=
ays have only one level deep items and IF the parent items are distinctive =
enough, I believe the indents are unnecessary.

"Addionally you may add space, bevel, splitter or the like between groups (=
was it the "tiny line"?). And last but not least group headers should be de=
signed different to normal entries beacause they haven't same functionality=
."

They do have different design (which itself is the splitter), albeit it doe=
s look closer to the contact entries. I think it's still distinctive enough=
, but I'll play around a bit more.


- Martin


-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
http://git.reviewboard.kde.org/r/106763/#review22260
-----------------------------------------------------------


On Nov. 20, 2012, 10:40 a.m., Martin Klapetek wrote:
> =

> -----------------------------------------------------------
> This is an automatically generated e-mail. To reply, visit:
> http://git.reviewboard.kde.org/r/106763/
> -----------------------------------------------------------
> =

> (Updated Nov. 20, 2012, 10:40 a.m.)
> =

> =

> Review request for Telepathy and KDE Usability.
> =

> =

> Description
> -------
> =

> I made several improvements to the group header in contact list:
> =

>  1) Moved the expand sign to the right
>  2) Removed the tiny line
>  3) Made the account/group icon slightly bigger (has the same size as the=
 avatar in normal mode; might need adjusting)
>  4) Aligned both the icon and the font with the contacts
>  5) Used background color from palette disabled:highlight and lighter by =
factor of 10
> =

> This is more a visual review request than a code, I tried with several de=
fault KDE color schemes and I think it looks good in all of them, see the s=
creenshot below. Let me know what you think (and if possible try using the =
patch for a while yourself and see how it fits).
> =

> =

> Diffs
> -----
> =

>   abstract-contact-delegate.cpp f5f2a05 =

> =

> Diff: http://git.reviewboard.kde.org/r/106763/diff/
> =

> =

> Testing
> -------
> =

> =

> Screenshots
> -----------
> =

> New group header
>   http://git.reviewboard.kde.org/r/106763/s/757/
> =

> =

> Thanks,
> =

> Martin Klapetek
> =

>


[Attachment #5 (text/html)]

<html>
 <body>
  <div style="font-family: Verdana, Arial, Helvetica, Sans-Serif;">
   <table bgcolor="#f9f3c9" width="100%" cellpadding="8" style="border: 1px #c9c399 solid;">
    <tr>
     <td>
      This is an automatically generated e-mail. To reply, visit:
      <a href="http://git.reviewboard.kde.org/r/106763/">http://git.reviewboard.kde.org/r/106763/</a>
  </td>
    </tr>
   </table>
   <br />





<blockquote style="margin-left: 1em; border-left: 2px solid #d0d0d0; padding-left: 10px;">
 <p style="margin-top: 0;">On November 20th, 2012, 1:12 p.m., <b>Heiko Tietze</b> wrote:</p>
 <blockquote style="margin-left: 1em; border-left: 2px solid #d0d0d0; padding-left: 10px;">
  <pre style="white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; \
white-space: -o-pre-wrap; word-wrap: break-word;">I dislike the idea to apply grouping by an \
icon or symbol, because the items couldn&#39;t be easily considered as in- or out-group. If you \
run a picture search for &quot;accordion widget&quot; you will find most widgets with +/- \
solutions (as Björn Balazs recommends), some with triangle up/down and a few with down/left \
(pinned at left side). I guess the right side is preserved for properties and therefore seldom \
used for such &quot;high frequency functions&quot;. Normal treeview have indents, as Lasath \
Fernando recommends. Addionally you may add space, bevel, splitter or the like between groups \
(was it the &quot;tiny line&quot;?). And last but not least group headers should be designed \
different to normal entries beacause they haven&#39;t same functionality. </pre>  </blockquote>







</blockquote>

<pre style="white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; \
white-space: -o-pre-wrap; word-wrap: break-word;">&quot;I dislike the idea to apply grouping by \
an icon or symbol, because the items couldn&#39;t be easily considered as in- or out-group. If \
you run a picture search for &quot;accordion widget&quot; you will find most widgets with +/- \
solutions (as Björn Balazs recommends), some with triangle up/down and a few with down/left \
(pinned at left side).&quot;

We had the triangle thingy before, I just moved it to the right. I&#39;ll try swapping it with \
the group icon back then.

&quot;Normal treeview have indents, as Lasath Fernando recommends.&quot;

We don&#39;t have any indent right now and it works and to be honest, I don&#39;t want to add \
the indent now as they are used as an visual aid in otherwise homogeneous (multilevel) lists \
(like folders tree in Dolphin). If we will always have only one level deep items and IF the \
parent items are distinctive enough, I believe the indents are unnecessary.

&quot;Addionally you may add space, bevel, splitter or the like between groups (was it the \
&quot;tiny line&quot;?). And last but not least group headers should be designed different to \
normal entries beacause they haven&#39;t same functionality.&quot;

They do have different design (which itself is the splitter), albeit it does look closer to the \
contact entries. I think it&#39;s still distinctive enough, but I&#39;ll play around a bit \
more.</pre> <br />








<p>- Martin</p>


<br />
<p>On November 20th, 2012, 10:40 a.m., Martin Klapetek wrote:</p>






<table bgcolor="#fefadf" width="100%" cellspacing="0" cellpadding="8" style="background-image: \
url('http://git.reviewboard.kde.org/media/rb/images/review_request_box_top_bg.png'); \
background-position: left top; background-repeat: repeat-x; border: 1px black solid;">  <tr>
  <td>

<div>Review request for Telepathy and KDE Usability.</div>
<div>By Martin Klapetek.</div>


<p style="color: grey;"><i>Updated Nov. 20, 2012, 10:40 a.m.</i></p>






<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Description </h1>
 <table width="100%" bgcolor="#ffffff" cellspacing="0" cellpadding="10" style="border: 1px \
solid #b8b5a0">  <tr>
  <td>
   <pre style="margin: 0; padding: 0; white-space: pre-wrap; white-space: -moz-pre-wrap; \
white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word;">I made several \
improvements to the group header in contact list:

 1) Moved the expand sign to the right
 2) Removed the tiny line
 3) Made the account/group icon slightly bigger (has the same size as the avatar in normal \
mode; might need adjusting)  4) Aligned both the icon and the font with the contacts
 5) Used background color from palette disabled:highlight and lighter by factor of 10

This is more a visual review request than a code, I tried with several default KDE color \
schemes and I think it looks good in all of them, see the screenshot below. Let me know what \
you think (and if possible try using the patch for a while yourself and see how it fits).</pre> \
</td>  </tr>
</table>





<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Diffs</b> </h1>
<ul style="margin-left: 3em; padding-left: 0;">

 <li>abstract-contact-delegate.cpp <span style="color: grey">(f5f2a05)</span></li>

</ul>

<p><a href="http://git.reviewboard.kde.org/r/106763/diff/" style="margin-left: 3em;">View \
Diff</a></p>



<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Screenshots </h1>

<div>

 <a href="http://git.reviewboard.kde.org/r/106763/s/757/"><img \
src="http://git.reviewboard.kde.org/media/uploaded/images/2012/10/08/cl_new_header_composed_400x100.png" \
style="border: 1px black solid;" alt="New group header" /></a>

</div>


  </td>
 </tr>
</table>








  </div>
 </body>
</html>



_______________________________________________
kde-usability mailing list
kde-usability@kde.org
https://mail.kde.org/mailman/listinfo/kde-usability


[prev in list] [next in list] [prev in thread] [next in thread] 

Configure | About | News | Add a list | Sponsored by KoreLogic