<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="http://feeds.alwaysaskwhy.com/~d/styles/atom10full.xsl" type="text/xsl" media="screen"?><?xml-stylesheet href="http://feeds.alwaysaskwhy.com/~d/styles/itemcontent.css" type="text/css" media="screen"?><feed xmlns="http://www.w3.org/2005/Atom" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0">
    <title>
    James E. Lee's Blog / Usability &amp; User Interface
    </title>
    <link rel="alternate" type="text/html" href="http://jameselee.alwaysaskwhy.com/blog/usability_user_interface" />
    
   <id>tag:jameselee.alwaysaskwhy.com,2007:/blog/1/19</id>

    <icon>
    http://jameselee.alwaysaskwhy.com/blog/images/favicon.ico
    </icon>
    <logo>
    http://jameselee.alwaysaskwhy.com/blog/images/alwaysaskwhy-logo.png
    </logo>
    <updated>
    2007-03-01T08:49:13Z
    </updated>
    
    <generator uri="http://www.sixapart.com/movabletype/">Movable Type 3.2ysb5-20051201</generator>
"&gt;
<link rel="self" href="http://feeds.alwaysaskwhy.com/jameselee/blog/usability_user_interface" type="application/atom+xml" /><feedburner:browserFriendly></feedburner:browserFriendly><entry>
    <title>Yahoo increases authentication timeout</title>
    <link rel="alternate" type="text/html" href="http://jameselee.alwaysaskwhy.com/blog/2007/02/yahoo_increases_authentication_timeout.html" />
    <id>tag:jameselee.alwaysaskwhy.com,2007:/blog//1.190</id>
    
    <published>2007-03-01T04:50:00Z</published>
    <updated>2007-03-01T08:49:13Z</updated>
    
    <summary> Problem Yahoo services require re-authentication too often. Being forced to sign in to Yahoo services again and again was frustrating. I use several on a daily basis, almost always from well-protected computers at home &amp; work. I appreciate the...</summary>
    <author>
        <name>James E. Lee</name>
        
    </author>
            <category term="Usability &amp; User Interface" />
    
    <content type="html" xml:lang="en" xml:base="http://jameselee.alwaysaskwhy.com/blog/">
        <![CDATA[<img alt="Yahoo keep me signed in" align="left" hspace="10" vspace="10" src="http://alwaysaskwhy.com/jameselee/blog/images/SCREENSHOT-Yahoo-keep-me-signed-in-2007.02.28.png">
<h2>
Problem
</h2>
<h3>
Yahoo services require re-authentication too often.
</h3>
<p>
Being forced to sign in to Yahoo services again and again was frustrating.  I use several on a daily basis, almost always from well-protected computers at home & work.  I appreciate the value of security, but the timeout was short enough to be annoying, especially given my access from very low-risk environments.  
</p>
<p>
This stood in stark contrast to using Google services, where I'm asked to re-authenticate so rarely that I don't even notice &mdash; <em>that's</em> how it should be.
</p>
<h2>
Solution
</h2>
<h3>
Keep me signed in &mdash; for 2 weeks
</h3>
<p>
Yahoo recently added a "Keep me signed in" checkbox that allows me to stay signed in for 2 weeks.  This relatively minor improvement has a big impact because it <b>helps reduce friction</b> when using Yahoo services.  User-configurable timeouts would be ideal, but this is an effective solution.  It will certainly help keep me signed in to and enjoying Yahoo services.
</p>
<p>
Thanks, Yahoo!
</p>]]>
        
    </content>
</entry>
"&gt;
<entry>
    <title>Windows Tip: Put Task Manager in widget mode</title>
    <link rel="alternate" type="text/html" href="http://jameselee.alwaysaskwhy.com/blog/2006/10/windows_tip_put_task_manager_in_widget_mode.html" />
    <id>tag:alwaysaskwhy.com,2006:/jameselee/blog//1.146</id>
    
    <published>2006-10-20T15:45:00Z</published>
    <updated>2006-12-07T21:47:50Z</updated>
    
    <summary> What? Collapse Windows Task Manager into a desktop widget that's between full size and the minimized system tray icon. In two clicks, you can put Task Manager in "widget mode" and see useful information at-a-glance, without taking up a...</summary>
    <author>
        <name>James E. Lee</name>
        
    </author>
            <category term="Computers &amp; Technology" />
            <category term="Hacks, Tips, &amp; Tricks" />
            <category term="Usability &amp; User Interface" />
    
    <content type="html" xml:lang="en" xml:base="http://jameselee.alwaysaskwhy.com/blog/">
        <![CDATA[<h2>
What?
</h2>
<img alt="Microsoft Windows logo" hspace="15" border="0" align="left" src="http://alwaysaskwhy.com/jameselee/blog/images/Microsoft-Windows-logo.jpg">
<h3>
Collapse Windows Task Manager into a desktop widget that's between full size and the minimized system tray icon.
</h3>
<p>
In two clicks, you can put Task Manager in "widget mode" and see useful information at-a-glance, without taking up a lot of room.
</p>

<h2>
Why?
</h2>
<h3>
Widget mode is much smaller than normal, but still large enough to display different kinds of useful information.
</h3>
<p>
Windows Task Manager is a great way to see what your computer is doing, but sometimes it takes up too much space.  Minimizing it to the system tray moves it nicely out of the way, but it
<ul>
<li>
displays only the current processor load,
</li>
<li>
doesn't show processor load history, and 
</li>
<li>
doesn't display any other information. 
</li>
</ul>
</p>

<h2>
How?
</h2>
<h3>
Double-click on the inner border of any Task Manager tab to put it in "widget mode".  Double-click again to restore Task Manager to its normal state.
</h3>

<img alt="SCREENSHOT: Windows task manager collapse to widget" vspace="10" hspace="10" src="http://alwaysaskwhy.com/jameselee/blog/images/SCREENSHOT-Windows-taskmanager-collapse-to-widget-2006.10.png">

<h3>
Tips & Tricks
</h3>
<ul>
<li>
Click and hold on the border to drag the widget around your desktop.
</li>
<li>
This works for <em>any</em> tab in Task Manager, so you can use it to keep an eye on all kinds of information, like network utilization, your process list (to see what's hogging all the memory or processor), etc.
</li>
<li>
Find a creative way to use Task Manager in widget mode; look in the View menu in each tab to choose optional information to display.  Some things (e.g. I/O reads & writes, network throughput, etc.) might be really useful to see at-a-glance, depending on what you're doing.
</li>
</ul>

<p>
Disclaimer: I stumbled on this by accident.  In fact, I'll come clean and admit that I did this months ago on one of my computers, and figured there was just something wrong with Task Manager. :) It wasn't until I accidentally did it again today and started to experiment with resizing it that I realized it might be a display mode!
</p>
<p>
<strong>Update:</strong>  I didn't think by any means that I was the first to "discover" this; I mainly wrote it up because I'd been too lazy to look into the "problem" before, and thought I'd share it with others who may have done the same.  My wife encouraged me to search for more information; it turns out this is called <a href="http://support.microsoft.com/kb/193050">Tiny Footprint mode</a>.  (I think "widget mode" is cooler!)
</p>]]>
        
    </content>
</entry>
"&gt;
<entry>
    <title>Firefox Tip: Make the active tab more visible</title>
    <link rel="alternate" type="text/html" href="http://jameselee.alwaysaskwhy.com/blog/2006/07/firefox_make_active_tab_more_visible.html" />
    <id>tag:alwaysaskwhy.com,2006:/jameselee/blog//1.110</id>
    
    <published>2006-07-21T18:23:10Z</published>
    <updated>2007-08-16T23:41:26Z</updated>
    
    <summary><![CDATA[ What? Change the color of the active tab in Firefox to improve its visibility. &nbsp; By default, the active tab in Firefox is not very visible, and it becomes less so the more tabs you open in a single...]]></summary>
    <author>
        <name>James E. Lee</name>
        
    </author>
            <category term="Email &amp; Web" />
            <category term="Hacks, Tips, &amp; Tricks" />
            <category term="Usability &amp; User Interface" />
    
    <content type="html" xml:lang="en" xml:base="http://jameselee.alwaysaskwhy.com/blog/">
        <![CDATA[<h2>
What?
</h2>
<img hspace="15" border="0" align="left" title="Firefox logo" alt="Firefox logo" src="http://alwaysaskwhy.com/jameselee/blog/images/Firefox-logo.gif" />
<h3>
Change the color of the active tab in Firefox to improve its visibility.
</h3>
<p>
&nbsp;
</p>
<p>
By default, the active tab in Firefox is not very visible, and it becomes less so the more tabs you open in a single browser window.
</p>
<h2>
Why?
</h2>
<h3>
Changing the color of the active tab makes it easy to see at a glance.
</h3>
<p>
Firefox's <a href="http://www.mozilla.com/firefox/tabs.html">tabbed browsing</a> makes it easy to manage having several websites open at once, but with multiple tabs open, it doesn't take long to lose sight of the active tab.&nbsp; Spending time looking for the active tab reduces the benefit of using multiple tabs.  Changing the active tab's color solves the problem by making it stand out in the crowd.
</p>
<h3>
Before
</h3>
<img vspace="10" border="0" title="Firefox active tab default" alt="Firefox active tab default" src="http://alwaysaskwhy.com/jameselee/blog/images/SCREENSHOT-Firefox-active-tab-default-2006.07.21.png" />
<h3>
After
</h3>
<img vspace="10" border="0" title="Firefox active tab more visible" alt="Firefox active tab more visible" src="http://alwaysaskwhy.com/jameselee/blog/images/SCREENSHOT-Firefox-active-tab-more-visible-2006.07.21.png" />
<h2>
How?
</h2>
<h3>
Make a quick change to your userChrome.css file, then restart Firefox
</h3>
<a href="http://www.mozilla.org/support/firefox/edit#css">Edit your &quot;userChrome.css&quot; file</a> and add:
<div class="code">
<pre>
/* Change color of ACTIVE tab */
tab
{
    -moz-appearance: none !important;
}
tab[selected=&quot;true&quot;]
{
    background-color: rgb(255, 106, 106) !important;
    color: black !important;
}
/* Change color of normal tabs */
tab:not([selected=&quot;true&quot;])
{
    background-color: rgb( 70, 130, 180) !important;
    color: white !important;
}
</pre>
</div>
<p>
The colors in the example code above will make your tabs the same colors as mine in the screenshot above; you can use any <a href="http://en.wikipedia.org/wiki/Web_colors#X11_color_names">colors</a> you like.
</p>
<p>
<strong>Note:</strong>&nbsp; You must restart Firefox for this change to take effect.
</p>
<h3>
Reference
</h3>
<ul>
<li>
Firefox Help: Tips &amp; Tricks - <a href="http://www.mozilla.org/support/firefox/tips#app_tab">Make the active tab easier to distinguish</a>
</li>
</ul>]]>
        
    </content>
</entry>
"&gt;
<entry>
    <title>Firefox Tip: Search from the address bar</title>
    <link rel="alternate" type="text/html" href="http://jameselee.alwaysaskwhy.com/blog/2006/07/firefox_tip_search_from_the_address_bar.html" />
    <id>tag:alwaysaskwhy.com,2006:/jameselee/blog//1.41</id>
    
    <published>2006-07-08T18:30:00Z</published>
    <updated>2007-08-16T23:57:58Z</updated>
    
    <summary><![CDATA[ What? Use the Firefox address bar instead of the built-in search box to search any website or search engine. &nbsp; By default, if you enter a search query in Firefox's address bar, the browser will perform a Google &quot;I'm...]]></summary>
    <author>
        <name>James E. Lee</name>
        
    </author>
            <category term="Email &amp; Web" />
            <category term="Hacks, Tips, &amp; Tricks" />
            <category term="Productivity" />
            <category term="Usability &amp; User Interface" />
    
    <content type="html" xml:lang="en" xml:base="http://jameselee.alwaysaskwhy.com/blog/">
        <![CDATA[<h2>
What?
</h2>
<img hspace="15" border="0" align="left" src="http://alwaysaskwhy.com/jameselee/blog/images/Firefox-logo.gif" alt="Firefox logo" title="Firefox logo"/>
<h3>
Use the Firefox address bar instead of the built-in search box to search any website or search engine.
</h3>
<p>&nbsp;</p>
<p>
By default, if you enter a search query in Firefox's address bar, <a href="http://www.mozilla.org/support/firefox/tips#beh_search">the browser will perform a Google &quot;I'm Feeling Lucky&quot; search</a>.&nbsp; You can change this so it will perform a normal search using Google or any other search engine you want.
</p>
<img vspace="10" border="0" title="Firefox search from address bar" alt="Firefox search from address bar" src="http://alwaysaskwhy.com/jameselee/blog/images/SCREENSHOT-firefox-search-from-addressbar-2006.07.03.png" />
<h2>
Why?
</h2>
<h3>
Fewer text input areas = simpler &amp; faster searching
</h3>
<p>
It's much more efficient to use a single input field for all text entry, rather than one for addresses and another for search.  This eliminates the need to think about which one to use based on what you want to do, which means <strong>one less keyboard shortcut to memorize, and one less decision to make</strong>.
</p>
<p>
Computers can do a pretty good job of figuring out what to do based on what you enter, so let the browser work for you, and get in the habit of always using the same <a href="http://www.mozilla.org/support/firefox/keyboard">keyboard shortcut</a> to jump to the address bar, whether you're navigating or searching.&nbsp; After you try it for a while, you'll wonder why anyone would want two text input areas.  No, it's not perfect, but it works great 99% of the time.
</p>
<h3>
One less thing on the toolbar
</h3>
<p>
Now you can free up space on the toolbar by removing Firefox's built-in search box (right-click on the toolbar, select Customize, and drag the search box off the toolbar).&nbsp; If you were using it to access other search engines, try setting up <a href="http://www.lifehacker.com/software/geek-to-live/geek-to-live-fifteen-firefox-quick-searches-129658.php">Quick Searches</a> for those instead.&nbsp; Quick Searches use the address bar, and let you quickly perform a search on <em>any</em> website or search engine.
</p>
<h2>
How?
</h2>
<h3>
Make a quick change to your user.js file, then restart Firefox
</h3>
<p>
<a href="http://www.mozilla.org/support/firefox/edit">Edit your &quot;user.js&quot; file</a>, and add:
</p>
<div class="code">
<pre>
// Change to normal Google search:
user_pref(&quot;keyword.URL&quot;, &quot;http://www.google.com/search?btnG=Google+Search&amp;q=&quot;);
</pre>
</div>
<p>
You can substitute the URL with the appropriate syntax for whatever search engine you want to use.</p><p>You may have heard about making changes like this by typing &quot;about:config&quot; in the address bar, but as far as I can tell, those changes apply only to the current browser session, and don't persist when you restart.
</p>
<p>
<strong>Note:</strong> You must restart Firefox for this change to take effect.
</p>
<h3>
Reference
</h3>
<ul>
<li>
Firefox Help: Tips &amp; Tricks - <a href="http://www.mozilla.org/support/firefox/tips#beh_search">Change the search mode in the address field</a>
</li>
</ul>]]>
        
    </content>
</entry>
"&gt;
<entry>
    <title>Firefox Tip: Enable instant "find as you type" in your browser window</title>
    <link rel="alternate" type="text/html" href="http://jameselee.alwaysaskwhy.com/blog/2006/07/firefox_enable_find_as_you_type.html" />
    <id>tag:alwaysaskwhy.com,2006:/jameselee/blog//1.68</id>
    
    <published>2006-07-04T21:00:00Z</published>
    <updated>2007-08-16T23:58:15Z</updated>
    
    <summary><![CDATA[What?&nbsp;Instantly find and jump to any link or text in a web page just by typing into your Firefox browser window.&nbsp; No keyboard shortcut required.&nbsp;As part of the Accessibility functionality, the Mozilla developers made it possible to &quot;find as you...]]></summary>
    <author>
        <name>James E. Lee</name>
        
    </author>
            <category term="Email &amp; Web" />
            <category term="Hacks, Tips, &amp; Tricks" />
            <category term="Usability &amp; User Interface" />
    
    <content type="html" xml:lang="en" xml:base="http://jameselee.alwaysaskwhy.com/blog/">
        <![CDATA[<h2>What?</h2><p><img vspace="20" hspace="20" border="0" align="left" src="http://alwaysaskwhy.com/jameselee/blog/images/Firefox-logo.gif" alt="Firefox logo" title="Firefox logo" />&nbsp;</p><h3>Instantly find and jump to any link or text in a web page just by typing into your <a href="http://getfirefox.com">Firefox</a> browser window.&nbsp; No keyboard shortcut required.<strong><br /></strong></h3><p>&nbsp;</p><p>As part of the <a href="http://www.mozilla.org/access/today">Accessibility</a> functionality, the Mozilla developers made it possible to &quot;<a href="http://www.mozilla.org/access/type-ahead/">find as you type</a>&quot; <em>without using a keyboard shortcut</em>.&nbsp; You can set this up by enabling &quot;Begin finding when you begin typing&quot; in Firefox, which takes less than 10 seconds.&nbsp;</p><h2>Why?</h2><h3>This makes finding anything on a web page almost effortless, and eliminates the need to <em>do something</em> (e.g. use a keyboard shortcut) to tell the browser you want to start searching.</h3><p>Why go through extra steps when you want to find something on a web page?&nbsp; Once you try this, you'll see it's really fast &amp; convenient to be able to just start typing when you think of something you want to find on a web page.</p><h3>Great for finding a tag in a tag cloud</h3><p>This is a generally useful trick, but it's also a perfect solution for finding tags in a busy tag cloud, since you often know the name of the tag you want, but have to find it among many others.</p><p>I'm discussing this in the context of&nbsp;  <a href="http://del.icio.us/tag/">del.icio.us tag clouds</a> since mine is pretty large, and that's what inspired me to start using this technique.&nbsp; One of the strengths of del.icio.us is that it facilitates using a lot of tags.&nbsp; Unfortunately, if you do so, it soon becomes a challenge to visually locate and click on the one you want.&nbsp; &quot;Find as you type&quot; solves this problem.<br /></p><p><img vspace="10" border="0" title="SCREENSHOT: Firefox find as you type in tagcloud" alt="SCREENSHOT: Firefox find as you type in tagcloud" src="http://alwaysaskwhy.com/jameselee/blog/images/SCREENSHOT-Firefox-find-as-you-type-in-tagcloud-2006.06.22.png" /></p><h3>Screencast demo: See it in action</h3><p>The best way to see the benefit of this is to try it, but you can get a sense of it by watching the <a href="http://alwaysaskwhy.com/jameselee/screencasts/Firefox-find-as-you-type-tagcloud-demo-2006.07.04.html">screencast I made to demonstrate how this works</a>:</p><p><a href="http://alwaysaskwhy.com/jameselee/screencasts/Firefox-find-as-you-type-tagcloud-demo-2006.07.04.html"><img vspace="10" border="0" title="SCREENSHOT: Firefox find as you type tagcloud demo" alt="SCREENSHOT: Firefox find as you type tagcloud demo" src="http://alwaysaskwhy.com/jameselee/blog/images/SCREENSHOT-Firefox-find-as-you-type-tagcloud-demo-screencast-intro-2006.07.04.jpg" /></a>&nbsp;</p><p>(This is my first <a href="http://en.wikipedia.org/wiki/Screencast">screencast</a>, and it was very easy to create using <a href="http://www.debugmode.com/wink/">Wink</a>, so I want to thank the developers for this great <em>free</em> software!) <br /></p><h2>How?</h2><h3>E<strong>nable &quot;Begin finding when you begin typing&quot;</strong> in 2 easy steps:</h3><ol><li>Go to the menu and navigate to: Tools - Options - Advanced - General<br /></li><li>Select &quot;Begin finding when you begin typing&quot;</li><ul><li><img width="469" vspace="10" height="428" border="0" align="texttop" src="http://alwaysaskwhy.com/jameselee/blog/images/SCREENSHOT-Firefox-Begin-finding-when-you-begin-typing-2006.06.02.png" alt="SCREENSHOT: Firefox Begin finding when you begin typing" title="SCREENSHOT: Firefox Begin finding when you begin typing" /><br /></li></ul></ol><h3>&nbsp;</h3><h3>To use it:</h3><ol><li>Go to any web page and start typing a word you see on the page.</li><li>When the link you want is selected, press &quot;Enter&quot; to open it.</li></ol><h2>Tips &amp; Tricks </h2><ul><li>Try this on any web page that has text and links.<br /></li><li>Try this with your tag cloud on your del.icio.us start page.</li><ul><li>If you don't use del.icio.us, or don't have enough tags to warrant searching, try it with the main <a href="http://del.icio.us/tag/">del.icio.us tag cloud</a> that I used in the screencast.<br /></li></ul><li>If your cursor ends up on a word in the link title or notes that you don't want, just press &quot;F3&quot; to find the next instance.</li><li>I haven't seen an obvious way to do the equivalent of this in Internet Explorer; if you know how, please comment.</li></ul><h3>Reference </h3><ul><li>Mozilla Documentation / Keyboard Feature: <a href="http://www.mozilla.org/access/type-ahead/">Find as You Type</a><br /></li><ul><li>A bit out-dated, and this feature is now implemented via dialog boxes, but the documentation provides some tweaks some may find useful.</li></ul></ul>]]>
        
    </content>
</entry>
"&gt;
<entry>
    <title>Crest gets it right!</title>
    <link rel="alternate" type="text/html" href="http://jameselee.alwaysaskwhy.com/blog/2005/03/crest_gets_it_right.html" />
    <id>tag:alwaysaskwhy.com,2005:/jameselee/blog//1.129</id>
    
    <published>2005-03-01T19:58:00Z</published>
    <updated>2006-08-16T16:20:00Z</updated>
    
    <summary> Toothpaste flavor is all personal preference, but Crest clearly put some research into "toothpaste user interface", and did an amazingly good job with the design of their flip top. We've been using Colgate Total Plus Whitening Tartar Control toothpaste...</summary>
    <author>
        <name>James E. Lee</name>
        
    </author>
            <category term="Miscellaneous" />
            <category term="Recommendations" />
            <category term="Usability &amp; User Interface" />
    
    <content type="html" xml:lang="en" xml:base="http://jameselee.alwaysaskwhy.com/blog/">
        <![CDATA[<p>
Toothpaste flavor is all personal preference, but <a href="http://crest.com/home/">Crest</a> clearly put some research into "toothpaste user interface", and did an amazingly good job with the design of their flip top.
</p>
<p>
We've been using Colgate Total Plus Whitening Tartar Control toothpaste for years, but recently got a trial pack of 3 of  Crest's new "Whitening Expressions" flavors in the mail.  We really liked the <a href="http://crest.com/products/stripes.jsp">Extreme Herbal Mint</a>; enough so that I think we're going to switch toothpastes.  (The marketing worked!)
</p>

<img alt="Crest Extreme Herbal Mint toothpaste" vspace="10" src="http://alwaysaskwhy.com/jameselee/blog/images/products/crest-extreme-herbal-mint.jpg">

<p>
The flip top on the Colgate tube was always a double-edged sword; yes, you get the convenience of a flip top, but a bit of toothpaste always seemed to somehow get outside the flip top and onto my fingers.
</p>
<p>
Crest's new tube, on the other hand, has a large cap that's really easy to flip up, and completely encloses the tube opening.  It seems to have been designed so that it tends to keep its shape, causing the toothpaste to suck back into the tube a bit after you squeeze.  These two things make it almost impossible for toothpaste to unintentionally get out, so no more mess!
</p>
<p>
I know that this isn't a big deal in the grand scheme of things, but I was always annoyed by Colgate's flip top; I loved the idea, but Crest got the <em>implementation</em> right.  (Not to mention a very good flavor & texture with the Extreme Herbal Mint!)
</p>]]>
        
    </content>
</entry>

</feed>
