I&#39;d still like to point out the issue with checkboxes next to the accounts in the accounts list (see background in screenshot [1]). There is no indication, what are these for (I assume they&#39;re for enabling/disabling that account, but average user might not and can get easily confused), so I&#39;d add some kind of information to them, column header might be great, but it would have to be the whole row and that wouldn&#39;t look too good IMHO. So probably a tooltip explaining what is it for. Another option is to add a text right next to them, but this would introduce more UI clutter.<div>

<br></div><div>So the tooltip seems to be the best solution. What do you think?</div><div><br></div><div>Marty</div><div><br></div><div><br><div>[1] <a href="http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/select_protocol.png">http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/select_protocol.png</a></div>

<div><br></div><div><br></div><div class="gmail_quote">2011/2/1 David Edmundson <span dir="ltr">&lt;<a href="mailto:david@davidedmundson.co.uk">david@davidedmundson.co.uk</a>&gt;</span><br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex;">

Here is our reply from the usability guys.<br><br><div class="gmail_quote">---------- Forwarded message ----------<br>From: <b class="gmail_sendername">Aurélien Gâteau</b> <span dir="ltr">&lt;<a href="mailto:agateau@kde.org" target="_blank">agateau@kde.org</a>&gt;</span><br>


Date: 2011/1/29<br>Subject: [KDE Usability] Re: Usability Questions for KDE Telepathy<br>To: <a href="mailto:kde-usability@kde.org" target="_blank">kde-usability@kde.org</a><br><br><br>Hi,<br>
<br>
I finally took the time to look at your message and screenshots. Thanks<br>
for taking the time to produce detailed screenshots. See my comments below.<br>
[snip]<br>
<div>&gt; We have a wizard for setting up new accounts.<br>
&gt; [1]<br>
&gt; <a href="http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/select_protocol.png" target="_blank">http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/select_protocol.png</a><br>



&gt;<br>
&gt; The second page on here allows us to set up everything you need to set up<br>
&gt; everything 90% of users will need to configure to set up an account<br>
&gt; (username/password normally). This changes per protocol.<br>
&gt; [2]<br>
&gt; <a href="http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/configure_jabber.png" target="_blank">http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/configure_jabber.png</a><br>



&gt;<br>
&gt; From here I made a decision that all advanced settings (that most people<br>
&gt; won&#39;t need to change (server addresses, ports, security, etc. ) should be an<br>
&gt; entire page away to &#39;hide&#39; them from the majority of users who won&#39;t care.<br>
&gt; [3]<br>
&gt; <a href="http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/configure_jabber_advanced.png" target="_blank">http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/configure_jabber_advanced.png</a><br>



&gt;<br>
&gt; Some protocols have several tabs of advanced options, others (such as<br>
&gt; Facebook or IRC) have none, and as such have no &quot;advanced button as seen in<br>
&gt; screenshot 2.<br>
&gt;<br>
&gt; Issues:<br>
&gt;  * Is the &#39;overuse&#39; of dialogs ok? If not what is a good solution?<br>
<br>
</div>The only problematic dialog here IMO is the &quot;Advanced&quot; dialog. Is it<br>
possible to move its content either as an &quot;Advanced&quot; tab or to place it<br>
below the &quot;Advanced&quot; button, but keep it hidden until the user clicks<br>
this button?<br>
<div><br>
&gt;  * How can we solve the &#39;large whitespace&#39; issue seen in screenshot 2?<br>
<br>
</div>Do you have code which ensures the content of the list in screenshot 1<br>
is fully visible? That would explain why the wizard dialog is so tall.<br>
<div><div></div><div>&gt;<br>
&gt; ---<br>
&gt;<br>
&gt; We&#39;re also looking at, and not sure on a good way to do input validation.<br>
&gt;<br>
&gt; There are two ways we&#39;re currently providing (or wanting to provide)<br>
&gt; feedback on the validation state. We&#39;ve developed a custom widget which<br>
&gt; shows a star on the right when a field is required and the user hasn&#39;t typed<br>
&gt; anything in the field. When the user starts typing, the star becomes a red<br>
&gt; cross. This indicates that the provided value is not valid. When the value<br>
&gt; gets valid, the red cross turns into a green check mark.<br>
&gt;<br>
&gt; The second widget to provide feedback to the user would be a red-isch error<br>
&gt; message on top. The idea is (stolen) borrowed from the bluedevil<br>
&gt; configuration dialog. They have the same box on top. This box would appear<br>
&gt; if a user clicks OK and not every value is valid, or somethings else goes<br>
&gt; wrong. With a meaningful error message that is of course.<br>
&gt; Look at the screenshots validation1.png and validation2.png attached to<br>
&gt; actually see the widgets. I know the placement of the validated line edit is<br>
&gt; not OK. It&#39;s just there to test. Of course, the text in the feedback widget<br>
&gt; should say something meaningful instead of Creation failed.. We would like<br>
&gt; to know if we are on the right track though, before we start integrating<br>
&gt; these widgets.<br>
&gt;<br>
&gt; [4]<br>
&gt; <a href="http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/validation1.png" target="_blank">http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/validation1.png</a><br>
&gt;<br>
&gt; [5]<br>
&gt; <a href="http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/validation2.png" target="_blank">http://static.davidedmundson.co.uk/accounts-kcm-pics/usability_review_1/validation2.png</a><br>
&gt;<br>
&gt; The question we would like to ask about validation:<br>
&gt; * Should we even give the user the opportunity to click the OK button if not<br>
&gt; all required values are valid, or should it be grayed out?<br>
<br>
</div></div>Both approaches are valid. As long as the &quot;field validity&quot; indicators<br>
make it obvious that something is missing, I would personally go for<br>
graying out the OK button.<br>
<div><br>
&gt; * Is it common to show the icons of the validation state on the right,<br>
&gt; inside the line-edit?<br>
&gt;<br>
&gt; * Is there any way to improve all of this? We&#39;re not really sure about all<br>
&gt; of this<br>
<br>
</div>Using a star to denote a mandatory field is a common UI pattern on the<br>
Web. I think it is a good idea to use it here, but I have two concerns:<br>
<br>
- If the star becomes a red cross as soon as the user starts typing, I<br>
am afraid the user will interpret this change as an indication that he<br>
just made a mistake. I suggest always showing a red star (not the cross,<br>
because it is associated with &quot;error&quot;, not with &quot;mandatory&quot;) when the<br>
field is empty or wrong and turn it into the green check mark when the<br>
field is OK.<br>
<br>
- The icon looks a bit big inside the line edit. It would probably be<br>
nicer to show the widget on the right of the line edit.<br>
<br>
Your work looks promising, looking forward for it!<br>
<br>
Aurélien<br>
_______________________________________________<br>
kde-usability mailing list<br>
<a href="mailto:kde-usability@kde.org" target="_blank">kde-usability@kde.org</a><br>
<a href="https://mail.kde.org/mailman/listinfo/kde-usability" target="_blank">https://mail.kde.org/mailman/listinfo/kde-usability</a><br>
</div><br>
<br>_______________________________________________<br>
KDE-Telepathy mailing list<br>
<a href="mailto:KDE-Telepathy@kde.org">KDE-Telepathy@kde.org</a><br>
<a href="https://mail.kde.org/mailman/listinfo/kde-telepathy" target="_blank">https://mail.kde.org/mailman/listinfo/kde-telepathy</a><br>
<br></blockquote></div><br></div>