April 23, 2005
Making OS X more usable for seniors
In helping my father set up his new iMac, I found it necessary to modify many settings to make it easier for him to use the computer.Although he has a strong interest in digital photography, and an active email communication with his friends, he's always found computers to be a challenge. After years of struggling with a Windows-based laptop, he finally purchased an iMac, and it was quite a revelation. Tasks he had always wanted to be able to do now became possible. However, the OS X interface still needed adjustments to make it comfortable for him to use.
As we grow older, we become farsighted, motor coordination diminishes, and it is more difficult to learn completely new concepts. If you have never used a computer before, the metaphors we take for granted will make no sense. Icons, folders, desktops, windows all seem like byzantine concepts with no relation to the task at hand , and the entire language associated with them must be learned from scratch.
I first thought of turning on the Simple Finder for my father, but on testing that, found that it would make long-distance troubleshooting almost impossible, so I left it set to use the normal Finder interface.
Enlarge the cursor
He has a lot of trouble seeing the cursor, so after testing a variety of cursor mods, I settled on the system preference pane "Cursor Zoom" as the least problematic for him. Enlarging the cursor to 2X was sufficient.
Get Cursor Zoom here
Note: For Leopard, Cursor Zoom is no longer needed. Select System Preferences > Universal Access: Mouse (or Mouse & Trackpad) > Cursor Size, and enlarge the cursor.
Tiny Targets
Other areas of difficulty include: hitting the tiny little window-resizing corner at the bottom right of any window, manipulating the tiny scroll arrows on the right or bottom of a window, and clicking icons in the dock or in the finder just right so that the associated application actually opens, rather than a menu popping up, or shifting the icon around. We practiced mousing techniques, but I think there is something not obvious about the visual feedback that occurs when clicking.
Scrollbars, window-resizing corner and arrows are too small to hit accurately.
Ultimately, it would be best to double the width of the scrollbars, scroll arrows, and zoom corner. An easy way to do this would be to lower the resolution of the computer, but this would diminish the desktop area available for iPhoto and other applications, so it seems to me that the best way to do this would be to create a special theme with extra wide scrollbars. When seeing things from my dad's perspective, I realized how insanely small some of the target areas are - you definitely need 20/20 vision and great small-motor coordination.
I also tried to teach the use of the "Zoom" function under universal access, but the extra key combinations required are hard to remember, and I decided to focus only on the key combinations needed for "Undo", "Copy" and "Paste."
The title bar's function as the draggable portion of the window seems to be a difficult one to grasp as well. Though the left and side areas of the window chrome are draggable, they are so thin as to be unusable in this context.
Needed: an accessible theme
A more useable OS X theme might somehow emphasize the "handle" nature of the title bar area. Perhaps it could make the cursor change to a hand when over it or something, as well as distinguish it graphically from other areas of the window.
My father is pretty good at hitting the three brightly colored buttons at the top left of a window, but not too clear yet on what they all do. He never figured that out in Windows, either.
Red: Got it. Yellow and Green, not so sure.
He does know that the red button closes the window, but the concept of maximizing (the green button) is an elusive one, since it does not always act the same way. He is beginning to understand "minimize" (the yellow button), but once a window is minimized, he doesn't usually remember that it is in the dock, so I'm not sure how useful that function is for him. The difference between closing a page and actually quitting an application is also a difficult one to understand. In an ideal situation, he would never ever need to quit an application. The reality is, that if too many applications are open, he gets confused in trying to switch from one to another. This should be a transparent process, and it simply still isn't.
Small changes to the Finder improve usability
Finder: Preferences: Always open folders in a new window
Select
View: Show View Options: All windows
- change icon size to 80 x 80
- change font size to 16 pt.
- select show item preview
The large icons and fonts make the contents more legible.
However, there is no easy way to make the System menu fonts larger. To do this, you will need to install the developer tools, and use the Quartz Debug application to increase interface resolution. See this article for details.
These settings make it a little easier to understand what folder is displaying in a window - a little more like Simple finder. Or more specifically, a bit more like the Spatial Finder as described in this article by John Siracusa
Dock Settings
Remove all extra items from dock. When in doubt, remove it! Add in the Applications folder. If you are going to be a long-distance tech-support person, add in the System Preferences icon to make your phone consultations a little easier.
Safari settings
In Safari, under the View menu, select "Show Home" and "Show Text Size". Once the text size widget is up, click the big A at least once to make the standard text size increase. Also in Safari's Preferences, under appearance change the default font settings to larger, clearer fonts.
Also in Safari's Preferences, set the home page to the user's favorite. I turned on Safari's tabs, but it will be a while before my dad uses them, I think.
Set "Save downloaded files to:" to a folder called DOWNLOADS located on the desktop. Change the icon of that folder to something dramatic, preferably a box or something with a down-pointing arrow, or some something that will be recognized as a container.
Change the name of the hard drive to a real name - something easy to recall.
Simple Finder is good if the person doing tech support is nearby, but if you are long distance, and need to troubleshoot via phone with the assistance of the owner, regular Finder is better.
System Preferences
Under Accounts Login Options (at bottom of list of accounts)
Select "automatically log in as.... ""
This will log the user in automatically so that they never have to sign in.
Select the user's account icon: click Startup items tab. Add any of the typical items they usually use: mail.app, AOL, iPhoto, Safari.
Under Appearance
Under Highlight Color select Red, Orange or Green, since they seem to have the most contrast. The default blue is too subtle.
- Select:
Place scroll arrows: At top and bottom
When the scroll arrows are too close together they are too hard a target to click correctly.
- Select:
Click on the scroll bar to: Scroll to here
also makes it a little easier to navigate in a long document.
Mail.app
Taking out the Trash
Ideally I think moving the Trash can onto the desktop would help him with executing this function better, but he seems to have learned to control-click, then select "Move to trash" so we are OK for deleting files. A description of how to put a trash can on the desktop is here
The Mouse
The first couple of days, Dad did ask "should I right-click or left click?" a few times, but I showed him that the mouse was a one-button mouse, making right clicking difficult. Since I doubt he has ever right-clicked in his life, I imagine one of his friends mentioned right-clicking to him at some point.
We spent a lot of time drilling certain terms, like "Title Bar", "Desktop", "Dock" "Folder" "Window" "Main Menu", "Icon" and "Cursor" and "Upper Left" (where the name of the active application shows up) so that when on the phone we could communicate about what was happening. There are still days, however where we have problems.
"What's wrong?"
"Well, whenever I click, I see Jacob". (Jacob is my nephew).
"OK, click on Jacob, and tell me what word you see in the Upper Left."
"I see.... I see IPhoto."
"OK, click on the word iPhoto in the Upper Left" and select Quit iPhoto from the menu."
"OK. Did it."
"Great!"
"But I still see Jacob!!!"
"*arrgh!!!*"
Posted by ellen at 10:16 AM
April 19, 2005
Breaking out of Dreamweaver for PC's interface
If you've found the new DreamweaverMX 2004 for Windows interface as confining as I did, you will know the frustration of trying to get more room for your work out of the screen. I have 2 monitors, so had plenty of horizontal space, but I could not get rid of the Properties panel and other items that were taking up vertical real estate.
It took me several months to figure out that they can be dragged out of the interface. Why the actual PAGE cannot be similarly dragged, I don't know, except that it is more consistent with the irritating way that Powerpoint's interface behaves on a PC. An example of 2 panels hogging space is shown below with the Design and Files panels.. I realize the panels could be set to not be on top, but I wanted them OUT of there - over on the left monitor, without having to make the entire interface 2 monitors wide, which causes other problems.
To tear off the palettes from the main interface, rather than simply closing them, click and drag on the 2 columns of dots on the left side of the pallette's title bar.
Holding down the mouse, drag the panel off to the left until it pops out of its spot.
Unfortunately, I don't believe there is any way to reproduce the "Move to new window" behavior that exists on the mac. In Mac-based Dreamweaver, right-clicking on the tab of any page produces a contextual menu which allows you to select "move to new window." If you are working on dual monitors, or a large monitor, it's often much easier to have 2 documents open side by side, freestanding. The PC interface does not allow this, apparently, without resizing the entire Dreamweaver window.
April 16, 2005
Adapting the 3-column layout script to work with my blog
I'm in the process of adapting a 3 column layout script to work with my blog. This is a work in progress. The script has several big disadvantages, but I kinda like it, so I'm in the process of coming up with workarounds to make posts with many images and code examples look good.
Ultimately I'd like to figure out how to force it to figure out the column heights but then shift upward to the next
tag to "break" within spaces.
To counter the issue with Safari not showing the contents of the text area, I'm putting code in downloadable form, until I solve the cloneNode/textarea contents conundrum.
Some posts have very wide images, and I'm replacing those with clickable thumbnails, which will pop up a full sized image.
Forcing one-column layout:
However, some posts are just too complex to change, so I've added in a token to force the page to load in one column, which eliminates most spacing issues. An example is HERE
At the end of the article text, I add:
<script language="JavaScript" type="text/JavaScript">
var layoutToken=0;
initialize();
</script>
which sets the value of a variable called "layoutToken" to 0 and initializes it.
In the article.js script, I've added a couple of lines in the function initArticle() :
(at approx. line 532)
if (layoutToken == 0) columnMode = 1;
else columnMode = 3;
which simply means: "if the value of layoutToken is equal to 0, set the column mode to one column, otherwise go to three columns."
Download the complete script here
April 7, 2005
Testing: form fields don't display content in Safari in cloned node
The code for the 3 column layout for this blog is partly borrowed from smokinggun.com and iht.com. However now I see why they don't put images and form elements in the article body itself! The images and text area fields make it difficult for the script to calculate a good 1/3 column height to correctly position the duplicate columns vertically, and I'm having problems with Safari not showing the contents of text-area form fields within the article layers. I believe it has something to do with the fact that Safari uses the Apple web widgets instead of standard form widgets. Perhaps the text is on another layer that I'm not aware of. It will take some time to work out a solution, so bear with me. I'm going to make the code in relevant pages accessible as soon as possible. Below are some test form elements to see what Safari does with them. I believe I've found the answer. The way the article is copied into three columns is using the cloneNode method. According to this article: Document Object Model Core "Cloning an Element copies all attributes and their values, including those generated by the XML processor to represent defaulted attributes, but this method does not copy any text it contains unless it is a deep clone, since the text is contained in a child Text node. " Therefore it may not copy the content of a text area, but only the "value" attribute of a single line textfield, since it is within the tag, not part of the content of the field.April 22: After a recent update to Mac OSX, bringing Safari to version 1.3 (v312), the contents of cloned textareas now display! Thank you Apple!