apel: (i knew it)
Today I've been looking at some anthropological research. It was fun, so I thought I'd share some thoughts and links here.

We're all aware of cultural stereotypes: the French smell of garlic, Americans are loud, Indians are ambitious etc. The party line in polite society is that these stereotypes are bad. And it's true that they can jeopardise relationships with people before we've even met them. On the other hand, there are definitely differences between countries' cultures that you become aware of if you travel to these countries or meet people from them.

A Dutch academic, Geert Hofstede, has developed a five-dimensional model for figuring out and playing with cultural trends in different countries. The five dimensions are:

Power Distance: How unequally people lower on the totem pole expect to be treated.
Individualism: Favouring individual rights and privileges over loyalty to community.
Masculinity: Assertiveness among males, and to a lesser extent females.
Uncertainty Avoidance: To what extent people are comfortable with uncertainty, ambiguity and inconsistencies.
Long-Term Orientation: Thrift and perseverance are long-term strategies, meeting social obligations, saving face and respecting tradition are short-term strategies.

You can look at the values for some interesting countries:

I for one have become much more aware of how I'm shaped by Swedish culture since leaving Sweden. That's part of the fish-becoming-aware-of-water dynamic of leaving your native culture. I'm sure others who have made similar journeys have noticed these things too.

That's where the subject of this entry comes in. First, if the words "The King" makes you think of Elvis Presley, you likely grew up in the US. If you automatically want to substitute it with "The Queen", it's possible that you're from the UK. If, on the other hand, your thoughts went to stamps, you might very well be Swedish or Norwegian or one of the other countries that have a male monarch.

Secondly, being Swedish, I was of course referring to the Swedish king, Carl XVI Gustav. I don't know if he does dishes but I wouldn't be the least surprised if he at least rinsed out his coffee cup. Egalitarianism and personal responsibility are traits that figure heavily among Swedish people.

In fact many Swedes have a hard time with the idea that they'd hire somebody to clean their house because of the combination of these two traits. Personally, I don't have a problem with it, provided that the cleaning staff are paid a living wage and treated like people. But even given that, some Swedes would be very uncomfortable with the implied inequality in getting somebody else to clean up their personal mess.
apel: (Default)
Kieron and I revisited the conversation about Star Wars hummingbirds today. He said he had more been thinking about the weapons that they have on fighters and shuttles, so missile weapons for use in atmosphere or outside.

He was making these pew-pew-pew noises, so I think he was mostly thinking about in-atmosphere vessels. Although I would think that even in space, weapons systems would give auditory feedback if none is created by normal means. Just like my digital non-SLR camera has a sampled shutter sound. On that one you can turn it off.

On high-end space weapon systems, I would think that not only can you turn off the auditory feedback. You could also choose which Old Earth weapon sample to use. Probably the sound effect would be different depending on which direction you fire to take into account doppler effects etc. And of course there should be a satisfying boom whenever you actually hit something. At least if you're still within tracking range, even if it's a couple of hours or days after launch.

This is all based on consensus human ergonomics. If it doesn't exist today, it will when we get to that point.

OK, enough geeking for now. :-)
apel: (hedgehog)
Disgusted with the process and foreseeable result of the W3C Accessibility Group's effort to update the current 1999 guidelines, a secret group of elite web accessibility specialists have created a rival standard. This was published this week as an errata sheet to the WCAG 1.0.

This is great news for those of us who actually care about disabled users on the web. Instead of saying that we establish accessibility levels through testing or other hard-to-explain methods, we can simply say that our pages comply with WCAG1.0+Samurai.

Right now you'll have to first understand the WCAG 1.0 and then apply the Samurai errata to it. Hopefully somebody will create a merge of the two documents that don't require this much prior knowledge to successfully comply with them. This shouldn't be too hard because the errata eliminates all the weasel words, e.g. "avoid" and "until user agents..." It also completely ignores the vague and woolly level 3 requirements, not to mention the even woollier WCAG 2.0 Working Drafts.

The Introduction to the Errata can be understood by people with little to no knowledge of HTML and web accessibility. If you care about opening up the web to disabled users, you should read it. I'll be happy to answer any specific questions you may have in the comments.
apel: (attention)
BayCHI (pronounced bay-KI) is the local San Francisco Bay Area chapter of ACM SIGCHI. ACM is the Association for Computing Machinery, a society for information technology professionals. SIGCHI is an ACM Special Interest Group on Human-Computer Interaction.

talks about web copy and ubiquotous computing )
apel: (german)
I'm working on my online portfolio, so all kinds of thoughts around usability are coming up. One of them is tied to the German word nachvollziehbar. It's usually used about a chain of reasoning and means that the reader can follow the thought process that lead to a given decision. Leo gives the translations "comprehensible" and "traceable".

A simplistic example would be, saying "It looks like it might rain." makes the decision to bring an umbrella nachvollziehbar.

When a chain of reasoning is nachvollziehbar, the reader gets a warm, fuzzy feeling. It's akin to closure that way. They may disagree with the decision but at least they understand the basis for it. It also makes the reader feel more in control, because it allows her to mount counter arguments or point out opportunities for improvement. "Why don't you take this little, collapsible umbrella instead of the golf umbrella? You'll be less likely to forget it, if you can put it in your bag once you're on the train."

When a decision is not nachvollziehbar, those affected by it will usually resent it. There's an English expression for this; an "arbitrary decision" is not one that is likely to be followed. The decision makers may have very good intentions but unless they communicate them, they will not get buy-in from those affected.

It is only when a person can understand the reasoning behind a decision that they can give their informed consent to it.
apel: (mjausson.com)
In this entry are all the external links I found in my content audit of Mjausson.com. They're presented from the most popular sites to the one-hit wonders. I've put long links behind cuts to avoid breaking your friends page.

I will have to go through this list and correct any broken links. If you click on a link and it doesn't take you where you expected, please let me know in the comments. That will save me some time.

The Winner
Not very surprisingly most external links go to my LJ. There are 12 of those.


Runners Up
I've linked to the National Trust five times but there are probably a lot of pages that should have links to NT that don't have it.

NT links )

Next comes the East Bay Parks District in the San Francisco Bay Area. They're responsible for both Pleasanton Ridge and Sunol Regional Wilderness, places I love with all my heart. They have 4 unique links.


Fourth Place
Several sites have 4 links each: Bartleby, Geocaching.com, Skyscrapers.com and Amazon.

Bartleby is useful for art history links.

Four caches registered with Geocaching.com. They gave out cache ID's in sequential order, so the cache with #369 was very early.

Skyscrapers.com has images and facts about very tall buildings. I used it for links to San Francisco sky scrapers. One was duplicated, so there are only 3 unique ones.

Amazon also has only 3 unique links because the link to Holiday Walks in Provence showed up twice. I could add many more Amazon links. In fact I've toyed with the idea of joining their affiliate scheme to make a quid or two.

Amazon UK links )

Three Links
The Art Archive is useful for American artists.

BSC is an American educational institution.

Two Links
I don't know what BMAG is.

Jean-Pierre Chabert has pages about French botany.

Kew Gardens needs no introduction.

The Landmark Trust allows you to rent historical properties for holidays in the UK.

The Nordic Flora is maintained by the botany department of Uppsala University.

Streetmap is the best UK mapping site, particularly for rural locations.

Streetmap links )

Thompson & Morgan are the famous seedsmen.

The University of Toronto were pioneers in putting English-language poetry on the net.

Unique Links
The rest of the list are all the sites that I've linked to only once. This is a wild mix of botany resources, art history galleries, historical sites and much more.

43 more links )
apel: (mjausson.com)
I finished the content audit for Mjausson.com yesterday. Here are some statistics from that.

There are 15 pages in the index folder. They contain the homepage, various overview and background pages.

list of indices, collections and background pages )

There are 174 pages in the walks folder. 15 of those are detail pages, containing either an overview of a specific holiday or a poem or essay. The only way of getting to these pages is usually through the walk page(s) that they are associated with. For the essay and poem pages, that probably won't change.

About the holiday overview pages, I'm not so sure. In addition to links to the individual walks, they usually contain some background about the holiday and, in some cases, foreign glossaries. I may end up incorporating their content into country pages.

list of detail pages )
apel: (mjausson.com)
I'm looking at the information architecture of my own site, mjausson.com. Below is a screenshot of the beginning of the content audit.

It looks pretty dire. There's a whole section that I haven't touched since 2002. The homepage does a very poor job of showing what the site actually contains. Even on the overview pages, the navigation isn't consistent.

Worst of all, if you're looking for anything in particular among the walks pages, you're basically screwed. The only readily accessible navigation is by date. If you're lucky you can find something using the search engine or a page-internal search for a place name on the Complete Walks page.

Mjausson.com Content Audit screenshot

I'm thinking of trying some sort of facetted navigation. Geography would be an obvious facet. There's currently no way of seeing all walks from Buckinghamshire, to take one example. Chronography, should also be a facet. Not sure what else. It's tempting to adopt some sort of tagging scheme but I'm not sure how I'd do that technically without it requiring lots of manual intervention.

I'd love it if individual photos (regardless of size) could be the atoms but I don't think I'll be able to do that. It would just be too large a project. I'll have to stick with walks. But there should be a way of getting from one walk to other "nearby" walks in terms of geography or chronography.

The navigation once you're on a walks page also sucks. Getting to the larger version of an image means clicking on it and going to a page that shows just that. To go back, you have to use your browser's back button. I wonder if anybody actually does that. It seems unlikely. What I'd really like is something more like Flickr's slideshow functionality but with the little stories I tell about each photo. To me that's what makes Mjausson.com unique -- it's not just a bunch of photos but there are stories that go with the photos.

So the next step is to do a full content audit of the walks. There are in the region of 150 of them. About each walk I need to list the following attributes:
  • Date
  • Page name
  • URL
  • Country
  • County (optional)
  • Starting Point
  • Other place names mentioned (optional)
  • Image formats
  • Layout (traditional, masthead, masthead w/breadcrumb, non-templated)
  • Panoramas
I'll probably come up with more as I go along.

Once I know what I've got, I can devise a navigation for the site as a whole and for moving between walks and photos. But that's a much later consideration. Back to the Excel sheet for now.
apel: (A)
...you're probably a geek. :-)

Jakob sez: I can haz blu linx?
apel: (mjausson.com)
Smashing Magazine have an article about favicons, the little blobs of colour that show up next to the URL in the address bar of your browser and in your favourite/bookmark list. They’re comparing them to 404 pages, saying that just like 404 pages they’re important but often get overlooked. The article has a long list of favicons that they think work well. Unfortunately they mostly don't say why.

What do they do?
The task of a favicon is to give the user a visual reminder of a site. It does this in a 16 by 16 pixel format, so it can only show 2-3 letters clearly. In other words, you’re better off using a shape and colour that reminds users of your brand than going for text. For most people brand=logo but, as you’ll see in the discussion below, some brands are a bit more sophisticated than that.

My browser

full size image )

Favicons in my bookmark toolbark
Above is the top chrome on my Firefox. To get my bookmarks to show up in the browser chrome, I’m using the Bookmarks Toolbar Folder in Firefox. It’s not an extension, it’s part of Firefox and has been for as long as I’ve used the browser. Terrifically useful for pages you visit over and over again.

Starting from the left, the blue Transport for London favicon is good. It’s got the colour right and it the shape is easily identifiable.

Same applies to the Norwich Union favicon. If you’ve seen the logo, the favicon will jog your memory to associate back to it. Perhaps the yellow spire could have been a bit more prominent. After all that’s what people focus on when they see the life-sized logo.

Boxes and Arrows is an information architecture site. Ironically they’re icon isn’t all that great. For one thing the original logo is orange so the favicon is missing that memory cue.

Unfortunately the site logo is trying to be literal, it shows an arrow inside a box, but the rounded corners mean that the square shape doesn’t immediately make users think of boxes. For most people boxes have square corners. Obviously it’s not the favicon designer’s fault that the logo isn’t up to snuff. But when that’s the case, making use of the colour cue is even more important.

Besides, nobody except a designer is going to squint at a favicon and try to make out what it shows. Most people will only see a coloured blob, so the colour is very important.

Jesse James Garret writes about information architecture. Unfortunately the favicon has nothing to do with the logo found on his site. The logo says “jig.net” because that’s his domain. The favicon shows his face in blue. It’s basically a total failure. The colour is more or less right but with the shape misleading to that degree, it’s not enough.

The London Weather favicon belongs to the Met Office. This is a good example of what not to do. They’ve just shrunk their logo down to 16 by 16 pixels and stopped there. If they had taken the time to get rid of the unreadable white text, this would have been a good favicon. The blue under the green waves would have registered as blue. That’s good because their whole masthead is that blue colour, so it would have been a strong reminder of their site.

Next we have Good Technology. Their favicon leads with an inexplicable colon but otherwise the shape of the letters is exactly as the shape in the life-size logo. The olive green colour is also strongly associated with their brand as expressed on their site. The fact that the logo on their site is pale blue doesn’t matter. Most people won’t see the site logo anyway because it’s at the bottom of the page. As a favicon this definitely works, although they could lose the colon. Good work, as you'd expect from a digital agency.

Finally I have two favicons for del.icio.us. Yes, I’m aware that I can add the extension to the browser instead. I just haven’t done that yet on this browser. The good thing about showing the bookmarks here is that they’re obviously not working. Look at the tab below. It’s showing the familiar blue, black, white and grey squares of the del.icio.us logo. How they managed to get their favicon to not work is beyond me. But it shows that even the pros sometimes get details like this one wrong.

Speaking of favicons, how come del.icio.us still doesn’t display favicons in its bookmark listings?

Favicons in the tab bar
In the tab bar at the bottom of the image, you can see some of the sites that I’ve visited today. The first is the easily identifiable Yell logo, letting its fingers do the walking.

The last one is my own attempt, for my site Mjausson.com. The association between the M and the first letter in Mjausson works well but if you click through to the homepage, you’ll wonder if you ended up in the right place. You’d expect something in a range of cool, pastel blue tones but the page is a sunny yellow. There is also no logo on the page, so the feedback loop between the favicon and the site remains unclosed. Not good.

I based the favicon on the header I used for the pages from 2004. Total blunder. Since the favicon and LiveJournal icon that it is based on, are the closest thing to a logo I have, if I had the time, I’d probably rework the homepage so that it hews back to the logo. Then the favicon would be doing its job -- reminding the user of the site.


May. 18th, 2007 11:24 am
apel: (attention)
In Excel you can remove all but the last word in each cell by replacing "* " with nothing. Who knew.
apel: (goodMorning)
Most UK store locators are simply based on postcode. Waitrose is an example of that. This simple approach works most of the time.

But Tesco's locator also has an interactive map that shows the locations found. It allows you to zoom in and out and you can widen your search by clicking on the "More results" link. That makes looking for a store near a planned route much easier. With the advent of GPS navigation, finding shopping along a planned route is going to become more and more common.

Today for instance I'll be taking the M25 to Shenfield. It took me only a few minutes to find several stores near where I'm going. When I click on the store name in the results list, I get the information for the store, e.g. postcode, opening hours and facilities. So I was able to tell that the London Road Tesco Express shop (CM14 4QG) was much bigger than the Shenfield Brentwood Express shop (CM15 8JD).

The map uses Microsoft Visual Earth but it's obvious that Tesco have thought farther than slapping an expensive mapping solution onto the page. Very good!
apel: (Default)
I'm confused. Here I am, happily creating wireframes for a site and suddenly I hit a wall: the Visio page ends before the form is meant to end. Surely this is something that others have had happen to them too. In fact, the people who created a prototype I've been looking at lately seem to have been wireframing in Power Point, judging from the layout of their web pages. They're short and squat like Power Point slides. But that's not the way the web works.

True, you can make a page in any format you like. But because scrolling sideways is much harder than scrolling lengthwise, traditionally web pages are long and narrow. Like this LJ page for instance. It's 25 entries long, regardless of how long that is in pixels. The page just expands downwards. It's one of the selling points of the web over paper -- that it just expands to whatever length you need it. That's also why blog entries can be any length that works best for what is being said. I write one-liners, I write hundred-liners. It's all the same on the web.

But not when I'm wireframing. Because the template I'm using forces me to limit the wireframe to the length of an A4. I could make it an A3 but that's still limiting a format that is inherently limitless. For web pages the only real length restriction is reader fatigue.

In the past I've solved the problem by creating an overview wireframe that blocks out the areas on the page. Each block has then got its own detailed wireframe on the subsequent pages. That works well for people who are used to that sort of hierarchical thinking but not so well for people with limited experience of web layout.

I have no better solution to offer right now so this is one of those slightly irritating entries that don't end with any proper closure.
apel: (A)
Personas are fictional characters created to support the process of arriving at an information architecture and visual design for web sites and software applications. The first two articles are must-reads.

Persona Creation and Usage Toolkit by George Olsen, formerly of Yahoo
Notes on Design Practice: Stories and Prototypes as Catalysts for Communication by Thomas Erickson, formerly of Apple

Bringing Your Personas to Life in Real Life by Elan Freydenson
Creating and Using Personas and Scenarios to Guide Site Design by Dai Pham and Janiece Greene from Razorfish
Personas for the S2S Project by Geoff M. Glaze
Perfecting Your Personas by Kim Goodwin, Director of Design at Cooper Interaction Design
Whispered Advice to The Graduate: Personas by Bryan Eisenberg
Highlights from a discussion about personas on the Interaction Design Association's message board
Reconciling market segments and personas by Elaine Brechin, Senior Designer at Cooper Interactive Design

The Inmates Are Running the Asylum: Why High-tech Products Drive Us Crazy and How to Restore the Sanity
apel: (pillarbox)
UKUPA, Framfab, London, 21 September 2006
Speaker: Rob Stevens, Bunnyfoot, co-founder
Title: Don't Make Me Think Out Loud: Post Experience Eye Tracked Protocol

The email about the presentation said that PEEP gives:
* more natural user behaviour
* find more genuine issues
* fewer false positives

The audience is mostly in their late twenties or early thirties with about 1/4 women. Almost exclusively white but with a number of expat accents. Some look like designers or coders but most simply look like normal professionals. Red wine and orange juice is served.

The reason PEEP was invented is the discrepancy between Krug's first law, Don't make me think and the way user testing is usually done, with the Think Aloud (TA) protocol.

Stevens shows an example of TA with an excellent user. It turns out it is an actor! Very few users are that articulate. He lists other problems with TA that were known before PEEP.

When using PEEP the moderator is in the viewing room rather than with the participant. After the test the facilitator talks about the experience with user, using the eye tracking screens as a memory cue for the user. During testing the facilitator sees an eye tracking realtime view. In Tobii this looks like a blue dot that moves around, somewhat like karaoke.

In a task-based test done on Google by Lancaster University TA produces the familiar F-shaped eye tracking pattern. PEEP produces another pattern - it's striped, like a pyjama. My theory about the difference is that in TA users remember to talk after they've read a few links and concentrate on talking instead of on the primary task. Without TA they stay longer with the task. PEEP is less intrusive and influences the results less than TA.

In the Lancaster study, PEEP participants got many more correct answers than TA participants. This supports the theory that TA takes focus from the primary task. Users also found PEEP less unpleasant than TA. More users completed tasks in PEEP than in TA. That's's why the result was better and more issues were uncovered.

Stevens thinks that a combination of PEEP and TA is best. He advocates breaking up testing into separate bits, some TA and PEEP. An audience member say that she probes during testing for specific, predetermined issues.

PEEP is good for process-based tasks and layout issues. Because it is quantitative, it works well for comparing different designs, answering questions like "Which design engages the user more?" or "In which design is it faster to find the right link forward?"

Eye Tracking
Because many audience members were unfamiliar with eye tracking, except having seen some heat maps, there were a number of audience questions about eye tracking.

94% of UK users can be tracked. People with hard line bifocals and drug takers with dilated pupils are exceptions. It works fine for toddlers too. Stevens showed a clip of a two-year old playing a Teletubbies game in his father's lap. The father wore dark sunglasses to make sure it was the toddler's eyes that were tracked.

Tobii eye tracker costs £20'000. It can be used for mobile devices too but it is a bit fiddly, according to Stevens. Only five companies in the UK have eye trackers. Foviance isn't one of them. After an audience question from a Foviance employee, that displayed the person's ignorance of current eye tracking software, Stevens teased the Foviance people present for it.

Stevens also talked about a three-year old study done first on a more invasive eye tracker with a chin rest and a lengthy calibration and then with a more modern eye tracker. On the old-fashioned ET banner blindness was very prevalent. On the more modern ET it was much less prevalent.
apel: (pillarbox)
Michael Weinhardt is the author of an excellent introductory article about how to design "inductive user interfaces" for Windows applications at the Microsoft Developers Network Library. For non-.Net developers only the first 2/3 of the article are interesting, down to figure 8. After that comes the technical stuff.

Inductive user interfaces lead the user along the way, rather than throwing menu and form elements at them and hoping they'll figure it out for themselves. This style of interface is particularly useful for guiding perpetual intermediates through infrequently used processes.

A more in-depth treatment of Microsoft's understanding of the inductive user interface can be found in Jan Miksovsky's much longer document Inductive UI Guidelines. The examples are drawn from Microsoft Money 2000.

A lot of Miksovsky's guidelines are common sense that user interface designers should already know, such as "Step one: Focus each page on a single task". But for some reason the designers I work with, who normally create web pages and web applications, seem to forget the basics when they are faced with producing a Windows application.

Here is a somewhat longer quote on one of my hobby horses -- telling the user up front what the task is:
Step two: State the task
Each screen should be titled with a concise and explicit statement of its primary task. This can be a direct instruction ("Select the account you want to balance") or a question you want the user to answer ("Which account do you want to balance?").

This is another simple-sounding principle that is often not practiced. For example, earlier releases of Microsoft Money had screens with titles such as Online Financial Services Manager and Balance Account. Users had to deduce the purpose and behavior of these screens from the arrangement and labels of their controls.

The title of the screen or page is very important. Whether the product uses windows, Web-style pages, dialogs, or another design, the title should not be allowed to scroll off.
apel: (cute)
The Acc Explorer allows you to see which accessibility features are available to Windows in any application, including Flash movies. It is part of the Active Accessibility 2.0 SDK Tools. If you run Windows XP, you want the file named AccExplorer32.exe. Earlier versions of Windows take AccExplorer9x.exe. For obvious reasons there are no versions for other operating systems. It's an executable.

Screen shot of Acc Explorer Select-Window-from-List windowWhen you have opened the application, go to Options and either Choose Window from List or Select Window with Mouse. Acc Explorer will then take a moment or two to build a tree of the accessibility features present in the window you chose. Screen shot of Acc Explorer Select-Window-with-Mouse window

Once this is done, the tree structure of the application will appear on the left and the properties of the currently highlighted node are shown on the right.

screenshot of Accessibility Explorer )

From an accessibility point of view the most interesting properties are:
Name and description: These can be read by screen readers for instance
Keyboard: Can this button be activated by clicking a character or character combination on the keyboard?
apel: (pillarbox)
Broadband 69.2%, metered dial-up 21.7%, unmetered dial-up 9.1%.The official UK statistics authority, National Statistics, offer a quarterly snapshot of internet connectivity in the UK. The latest statistics are from March 2006 and show that nearly 70% of all connected households use broadband and only 30% still connect through dial-up.

The data is based on answers from a panel of UK ISPs. The response rate was 84% with estimates made for non-responses. Only users who had connected to the Internet during the month that the survey refers to are included.

apel: (Default)
July 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 2017
RSS Atom
No cut tags
Powered by Dreamwidth Studios