Usability Testing - Screen Recorder for the Mac

I am about to embark on a pretty exciting usability study on some software we've been working on at Blue Lava Technologies. Since I will mostly be conducting usability testing on my own (everything from recruiting people to moderation and reports), I need a way to capture the user sessions on the computer so I can focus on moderating instead of being distracted by taking notes. Its also good to capture the sessions so that the team can review them when they have a chance (though in my experience nobody ever does). My requirements for this software are pretty basic:

• Must not impact performance at all...should run completely transparent in the background
• Record the entire screen at a real-time frame rate so that mouse movements are clear
• Record the audio from my laptop mic (or external mic if needed)
• output a video file that can be reviewed later

I've done testing in the past that captures a video of the person's face along with the screen so you can see physical reactions, but this has never really added that much value. Just observing the mouse movements alone can give you great insight to what the user is thinking. Since I'll be testing a mac application, this limits the options available for me to use quite a bit...but the funny thing is, I found IShowU, a $25 piece of software, to be the best solution.

I have tested it for hours at a time with no problems...and it is very configurable to suit a lot of different needs.

I love products that do 1 thing great...and this is one of em.

Instantly poll 30 million people on Facebook

The president at the start-up I'm working for, Lorenz, has been ranting and raving about how awesome Facebook is...so much that we're starting to wonder if he is secretly working for them. Though I still don't quite understand what the buzz is all about yet, he recently found and used their polling feature that I find amazing. For as little as $6, you can poll Facebook's 30 million users to get insight on questions you may need answers to without going through all the trouble of usability testing or traditional (and expensive) polling methods.

We tried a few questions and got several hundred responses very quickly. Overall I find it extremely useful and will definitely be using it a lot to assist in some of those difficult design decisions.

UPDATE:

Ok now that I've been using Facebook for the past couple of weeks, I can see the light now. From the time I registered to now, I've added about 5 friends on my own, but other friends and friends of friends have quickly found me and added me to their friends list. I was quite amazed at how quickly and easily they help you and your friends connect (via your IM, email contacts, etc...). Once you have a decent amount of friends you're connected to, Facebook gets really awesome.

Facebook is one million times better than myspace. Granted I'm not a popularity-starved teenager who wants to pimp out my profile beyond the point of legibility, but the usability and thought they've put into every detail in order to enable a great social network is really impressive.

Ajax and Usability - Browser navigation buttons

One of the biggest usability problems you encounter in a fully Ajaxified site (i.e., a completely dynamic site that functions with little to no page refreshes)...is the fact that anything you load dynamically on the page without a refresh is blind to the browser's buttons, as well as bookmarking. Kailash however has discovered a slick way around this problem in this post. He mentions that by making use of the 'url fragment identifier' or whatever that comes after the # in a url, you can use javascript to dynamically update the url in the browser's address bar:

Javascript can update the fragment identifier dynamically with a simple

CODE: document.location.href = '#whatever';

On page load, something like RegEx could be used to parse the query

CODE: var thisUrl = document.location.href; var query = thisUrl.split('#'); alert(query[1]);

So if page numbers or required variables are set as the fragment identifiers, it is possible to efficiently make Javascript process it (nearly) and make Ajax act normal with page urls.

On another note, Smugmug has released a new version of their site that is proof positive that this technique can sucessfully be done. Well done! I'm really excited to start using this technique on our projects over at Blue Lava.

Gibberish application messages...

I updated my copy of Adium instant messenger today, and after it installs, it presents me with this message:

After reading it, i had no idea what to do. The question starts out "Do you want to allow access..." and the action buttons are "change/dont change". I knew that one button would probably grant the new version access to my IM account passwords, while the other would deny it. I ended up picking a random option and it happened to be the right one (no whammys!)

It's been pretty quiet here...

But for a good reason. I have accepted a full time position as Director of User Experience for a social-based web 2.0 startup in Honolulu, HI. The company is called Blue Lava Technologies, and we'll be developing some break-through technology that will change the way you interact with your photos. I have been working on the sister website, Kindfish.com for the past few months, and we're about to roll-out some awesome new features as well as some social aspects that will make it a lot of fun to use.

With that said, I've decided to focus my future blog topics around social/web 2.0 user experience so that i can blog my thoughts and learnings as I go.

Google Powerpoint Confirmed - Visio Replacement?

Today Eric Schmidt, CEO of Google announced that they will be releasing the much speculated powerpoint version of their free online apps for small businesses. This is very exciting news for those of us who have been fully enjoying Gmail, Docs, and Spreadsheets...and more importantly those of us who use Visio. It has been said in the past that Power Point can be a great tool for creating wireframes and other types of bare-bones visualization methods. Though I've always used Visio in the past, I could see this new online tool being extremely useful for throwing together some quick diagrams.

IAs could put CPAs out of business

Over the past year I've dived head first into starting my own business, doing my own accounting, and the most recently frustrating, doing my own taxes. The IRS has done a great job of making it as complicated as possible to figure out taxes on your own so that tax professionals can exist and in turn generate more tax money for the government. (That's my interpretation anyways :)

I am lucky enough to have a close relative who is a CPA and has helped me though this painful process, but without them I would be forced to hire one...and that is lame.

Taxes are not as complicated as the IRS makes them and it doesn't have to feel like your going to the dentist to get teeth pulled!

There is a better way.

It is clear to me that if the IRS hired a rock-star team of information architects and designers to come in and organize the tax worksheets, publications, and god forbid make them smart working online applications, there would be no need for anyone to hire a tax professional.

Imagine that after receiving a reminder email, you log-in to your user-kind IRS website, it tells you which documents need to be filed (and when), you input some numbers into some form fields, which instantly does some math and auto-populates other related fields for you, then...woops, theres an error with some data you entered, not to worry, the application is smart enough to diagnose the problem and help you fix it with ease. You type in your name at the bottom, enter your CC# or bank routing info, and hit submit.

Ahhh, now wasn't that easy?

Maybe next year ae? (in government time that is 10 years BTW)

Turn photoshop documents into working prototypes

Altia has released a photoshop plugin called PhotoProto that allows you to turn your photoshop documents into working prototypes. It is a script that you run that takes advantage of layers and layer comps, turning them on and off as you click around your mockup. The demo makes it look like it's very easy to use. You can even make changes to your photoshop document without affecting the prototype. Check out the demo video for more info.

Best error message, ever

Today I was working in Dreamweaver and got this delightful error message:

Thanks for the insightful error message, Dreamweaver.

Demographics of Taggers

Just as the internet allows users to create and share their own media, it is also enabling them to organize digital material their own way, rather than relying on pre-existing formats of classifying information. A December 2006 survey by the Pew Internet & American Life Project has found that 28% of internet users have tagged or categorized content online such as photos, news stories or blog posts. On a typical day online, 7% of internet users say they tag or categorize online content. Here are the results of the survey...

-------------------------------------

Demographics of Taggers 28% of online Americans say they have tagged content like a photo, a news story or a blog post

Proportion of all Americans in the group who are taggers

• Men 29%
• Women 27%

Race/ethnicity

• White, non-Hispanic 26%
• Black, non-Hispanic 36%

English-speaking Hispanic* 33%

Age

• 18-29 32%
• 30-49 31%
• 50-64 23%
• 65+ 18%

Educational attainment

• High school diploma 24%
• Some college 28%
• College degree + 31%

Household income

• <$30K 28%
• $30K-$49,999 28%
• $50K-$74,999 27%
• $75,000+ 36%

Internet connection at home

• Dial up 23%
• Broadband 38%

Source: Pew Internet & American Life Project December 2006 tracking survey. (N for internet users=1,623. Margin of error is ±3%).

-----------------------------------------

Tagging is done somewhat differently at different websites. Here are some links that illustrate more fully how the tagging process is done:

• At Flickr – a photo sharing site
• At Del.icio.us – a browser bookmarking site
• At Technorati – a blog search engine
• At Furl – a browser tool that allows content to be archived and labeled
• At Yahoo – how tags work in Yahoo’s MyWeb browser feature
• At YouTube – a video-sharing site
• A Wikipedia entry on tagging

Multi-touch Interaction

I just saw a video that blew my mind. At NYU they've developed a touch screen similar to the one featured on the iPhone...only much larger. Jeff Han demonstrates it's possibilities in this video. Interfaces like this will be a huge leap forward in how we interact with computers.

Jeff Han is a research scientist for New York University's Courant Institute of Mathematical Sciences. Here, he demonstrates—for the first time publicly—his intuitive, "interface-free," touch-driven computer screen, which can be manipulated intuitively with the fingertips, and responds to varying levels of pressure.

CEO of IDEO - Innovation Through Design Thinking

Luke from Functioning Form recently posted notes from a discussion with Tim Brown, CEO of IDEO on the topic of innovation through design thinking: So what is Design Thinking?

• It’s a human-centered approach to innovation.
• Being human-centered is unique to design, Designers think about people first, then the business second. The opposite is true for most companies.
• In the traditional Venn diagram of People (desirable), Business (viable) & Technical (feasible), design thinking solves the problem from the People perspective
• Design thinking is supported by a rich set of tools, processes, roles, and environments. Designers work like craftsmen. They know when to use the right tool at the right time.
• There are 3 important phases for design thinking: Inspiration, Ideation, Implementation

Inspiration

• Everything hinges on inspiration. We need new insights to drive innovation.
• The right way to get inspired is to get out into the real world: use the world as a source of inspiration not just validation.
• Great designers are great observers of life. They get out there to look, listen, and try.
• What’s the difference between design research and market research? Predictive market research is used by marketing to gauge the size of an opportunity. It is primarily a validation tool. Design research is an inspiration tool.
• Designers gain empathy by looking at the world through other people's eyes in order to understand things at social, cultural, cognitive, emotional, and physical levels.
• Designers often look at analogous situations for inspiration. For example, when doing research for surgery procedures an IDEO spent a day with a Nascar pit crew.
• Insights come from extreme users and not from center of the bell curve. There’s little inspiration in average usage.
• Kids are extreme users. They magnify issues that we have as adults.

Ideation

• Building to think is essence of the prototyping process.
• Prototypes can be very rough but they should always enable engagement & discussion. Prototypes don't have to be physical but do need to be tangible.
• Designers might go though hundreds of iterations of prototypes so they need to be quick and easy to build.
• McDonald's prototypes service models and scenarios in a giant reconfigurable lab in Chicago.
• Prototyping makes a difference. Mcdonald’s saw kiosk usage rise from 7% to 90% after IDEO ideation process.

Periodic table of visualization methods

If you're ever struggling to find the right way to display and visualize data, have a glance at this page for some ideas: http://www.visual-literacy.org/periodic_table/periodic_table.html

They've broken it out in a periodic table fashion with slick rollovers that reveal a screenshot of the visualization.

Feature ridden complexity not the way of the future

Consumers are becoming aware that the more features a product has, the less easy it is to use. They have demanded feature ridden products without understanding the impact on usability. Technology companies in competition have been compelled to meet these demands...cramming as many features and functionality as possible so that their products can be everything to everyone. These products do a thousand things poorly, and nothing great. The success of the iPod is a perfect example of a product that does one thing extremely well...and is a good indicator of things to come. I believe that we'll start to see more products like the iPod...instead of 1 product that does a thousand things, we'll see 5 or 10 products that meet specific needs.

The CEO of Phillips, Paul Zeven, recently made some enlightening comments on this topic and shared some results from a study they performed:

"Clearly, the American consumer believes that we are still cramming features and functions into our products simply because we think they will sell or in response to fierce industry competition.

We need to change that. As makers of tomorrow's gadgets and gizmos, we need to take a lesson from the success of Google. It rescued users from complexity by presenting the simplest Internet search interface possible. Another Web site, Craigslist, has done the same to maintain simplicity and to-the-point information at users' fingertips.

The fact that some products have been able to deliver this should have raised the bar for all technology products. My industry needs to better understand the impact technology is having on our lives and find ways to simplify the overall consumer experience. And consumers should demand that we deliver this, always. After all, what is the purpose of designing a product for consumers if they are not able to use it?"

Study Results:

• more than half of Americans believe manufacturers are trying to satisfy perceived consumer needs that may not be real.
• two out of three Americans have lost interest in a technology product because it seemed too complex to set up or operate
• Only 13 percent of Americans believe technology products in general are easy to use.
• only one in four consumers reports using the full range of features on most new technology products.

Unfolding the fold

Clicktale recently published some findings from their analytics data that reveal some interesting things about user behaver when it comes to scrolling. They used a subset of 120,000 page views from 11/06-12/06. Their service records the height of the web pages, the height of the window and the bottom-most location the user scrolled to. Global Statistics

• 91% of the page-views had a scroll-bar.
• 76% of the page-views with a scroll-bar, were scrolled to some extent.
• 22% of the page-views with a scroll-bar, were scrolled all the way to the bottom.

Findings

• Visitors are likely to scan the entire page no matter the page size.

Recommendations

• Don’t try to squeeze your web page and make it more compact. There is little benefit in “squeezing” your pages since many visitors will scroll down below the fold to see your entire page.
• Since visitors will scroll all the way to the bottom of your web page, make life easier for them and divide your layout into sections for easy scanning.
• Minimize your written text and maximize images, visitors usually don’t read text - they scan web pages.
• Encourage your visitors to scroll down by using a “cut-off” layout.

Creativity without influence

I believe that some of the greatest innovations come from creativity without influence. It's one of those things thats easier said than done. Creativity without influence involves tapping into that right-brain and letting those creative juices flow freely, it involves taking risks, and it involves exploring uncharted territory. All can be difficult things to do, but like most difficult things: the more you do it, the easier it becomes. From Wikipedia: "Influence is a term that refers to the ability to indirectly control or affect the actions of other people or things."

Influence is one of those things that can affect you or your work while you don't even realize it. This post is meant to put more awareness around it, because like G.I. Joe always said, "knowing is half the battle".

Lets take a look at a few things that play a part in influence: Inspiration led by influence Inspiration is very important to creativity...it gives us a purpose, it gives meaning...but in many cases inspiration is led by influence. Inspiration can also be led by a creative vision which I think is a more likely to lead to creativity without influence, and in turn a great innovation.

Credibility powered influence There are many people and companies in the world that we look up to. They have achieved great credibility for their work or actions. It is very compelling to follow these leaders as doing so can result in achieving a similar level success or credibility for yourself. Credibility plays a big part in influence.

Commonality powered influence Commonality is all around us. Its in our music, our fashion, our architecture, our culture, and our information. Commonality tends to influence us to keep things common.

How often have you encountered the comment: "Company X does it this way and is successful, therefore we should do it that way too"? First of all, just because a company is a leader doesn't mean that they're at the top of the chart. Part of thinking outside the box is seeing how much bigger the chart actually is and having the courage to explore with the potential to fail miserably or succeed greatly. After all, the laws of nature tell us that reward is almost always proportionate to the risk that precedes it. Secondly, the way that successful company X does it doesn't mean that they've done it the best way...they've simply done it better than anyone else has to date.

Now don't get me wrong, I think that many great things are led by influence...and creativity may never be completely free of influence. In fact, people have a hard time accepting things that are original...its easier to relate to things that we've seen or heard before. Normally if you see a new fashion statement or hear a new type of music, your first reaction will be a negative one...its not until you look around and see the acceptance of others that you will start to appreciate it (again, influence at work).

Creating things that are truly original is hard...mostly because they are less likely to be accepted at first. They require your influence on others to be accepted. They either crash hard or succeed greatly...with little in between.

If Mozart sat down in front of a piano with the skill of playing but has never heard music before, what would he play?

If we lived in a world where influence did not exist, what would it be like? Would it be a better place or more chaotic?

Can you identify other forms of influence?

How does influence affect you?

Dont forget about your repeat visitors

I recently had a frustrating yet enlightening experience at the grocery store. I pretty much hate flossing, and have found 1 product that makes it not so bad...and it's the G.U.M. brand of disposable mini flosssers. They're 5x more durable, and have twice the surface area of the other brands. Anyways, the grocery store I've been going to appeared to have stopped carrying this brand of flossers. It was no longer in the place I normally found it (by the other floss). I devastatingly stopped buying floss for quite a while until I just recently realized that they had moved it half-way down the isle. It was now by the toothpaste hanging from one of those clip things.

Now i can see their thinking in moving it..."G.U.M. paid us more money to feature the product"..."putting products on clip things stand out more"..."products on clip things sell more than they would normally".

While these are all good ways to market a product...they failed to keep their loyal customers in mind. If they had kept the G.U.M. brand where loyal customers could find them, and at the same time offered them on the hanging clip thing, they would have maximized their promotion and sales.

I think that this scenario is a good analogy for offering and promoting products on a website. Lets make sure that we don't forget about our repeat and loyal customers whom we've trained to find things in a specific area. If you're going to promote a product, make sure it also exists where loyal customers know they can find it. Take a look at your stats to see new vs. returning visitors so that you understand the impact of these type of decisions.

"Its about as hard to quit smoking as it is to start flossing" - Mitch Hedberg

The Paradox of Choice

I just watched an excellent lecture at the googleplex by professor Barry Schwartz where he explains his philosophy of "Why more is less" and how offering more selection and choices to customers leads to less choice and satisfaction.

Studies from the past 50 years have shown us that more selection and variety of features equals a better product. However, those studies failed to observe actual behavior in comparing a large selection from a refined selection.

This reinforces my belief that there is usually a difference in what people say and what they actually do...which is why its more important to observe behavior rather than opinion.

A study was performed in a super market in the UK a couple years back. On one day they set up a table and gave a selection of 20 jams for people to sample, each of those people got a $1 off coupon to use on any jam they wanted. The next day they only offered 6 jams, with a $1 off coupon.

While many more people were attracted to and sampled the 20 jam table...1/10 AS MANY PEOPLE BOUGHT JAM!

What does this tell us? More choice = fewer decisions. The more choice available, the more likely people will choose nothing. That's a pretty powerful finding if you ask me. There are several other studies Schwarts references with similar outcomes.

I think that Barry Schwarts has some excellent points...and watching the video just may change the way you think about building products.

Tips for consuming information via RSS

With over 140 RSS feeds now in my blogroll, it takes me around 2 hours a day to consume all of the info that is published...and most of that is just skimming to pick out the information I want to heavily digest vs. the info that doesn't matter so much. RSS allows us to consume more information faster than ever possible before. I even believe that RSS will increase the rate to which we evolve as a race. The downside of this is information overload. With all of this information at our fingertips, how can we possibly filter the important from the not-so-important? Marshall Kirkpatrick (former writer for Tech Crunch) gives us some insights to how he manages thousands of feeds with ease (I've added a couple tips of my own as well)...

Use a start page

Marshall suggests using a startpage that can be glanced at every couple of hours that gives you a high level of what's new with items you've marked as a high priority. The new google reader provides a nice start page that I sometimes use. Alternatives include Original Signal and Page Flakes.

Preview New Feeds

I think its a good idea to preview new feeds that you subscribe to. This helps keep them separate from other feeds you've deemed as important and reliable information. You can do this by creating a "new feeds" folder or just put them at the root level of your feed reader. Once you've deemed your new feed as one you want to hang on to and read regularly, you can them move into the appropriate folder or tag.

Organize your feeds

This one is pretty much common sense...but common sense is not always common practice. I am constantly re-structuring and optimizing how all of my feeds are organized. At one point i had an "internet" folder, but now its necessary for that to be broken out into 4 or 5 folders. Marshall advises that with thousands of feeds, it helps to separate your feeds by priority so that you can quickly access the more important information.

High priority sources

I'll just quote this one (note the last sentence in bold :)...

"The single most helpful tool for me in my efforts to blog about news events first has been an RSS to IM/SMS notification tool. I use Zaptxt to subscribe to very high priority feeds. It sends me an IM and SMS whenever a high-profile company blog is updated and in a number of other circumstances. There are quite a few services that offer this functionality now and it's invaluable. A big part of taking a prominent position in the blogosphere is writing first on a topic. That's a large part of what got me the job at TechCrunch and it's something that an increasing number of people are clearly trying to do.

In sectors where people are already using tools like the above, I expect further developments to emerge that differentiate writers' handling of the huge amount of information available. New tools and new practices. It's a very exciting time to be someone who works with information."

Do you have any tips to share? Let me know!

What Eye Tracking tells us about website usability

Like all forms of usability testing results, eye tracking gives us good clues into user behavior, but it certainly shouldn't be taken literally. Testing results are merely insights into problems and their solutions...and I prefer to treat them that way. Heck I've observed many testees that do the opposite of what they say...which is really just part of human nature when it comes to using things vs. explaining how you use them. One of the recent and big studies to come out this year was the Poynter Institute's "EyeTrack III" 2004 Eye Tracking Study. This is the third eye track study conducted by Poynter since 1991.

Here's what Poynter has found from their eye tracking studies relating to website content usability, page layout, navigation and design: (along with some great comments from Frank Spillers below each finding that are good examples of how one can interpret the data):

1. Users spend a good deal of time initially looking at the top left of the page and upper portion of the page before moving down and right-ward. Comment: Another thing to think about is how this user behavior mirrors search engine traffic (i.e. Google Bot visiting your site). Search engines read starting at the top left, and then downward in a left to right column fashion.

2. Normal initial eye movement around the page focuses on the upper left portion of the screen. Comment: Not surprising when you consider that users are patterned by all the other software and websites that they use which have a standard menu start point (e.g. File, Edit, View...). Note: For Japanese or Arabic it would be the mirror reverse. 3. Ads perform better in the left hand column over the right column of a page. Comment: The right column is treated by users as an "after-thought" area and should be designed with that in mind.

4. Smaller type encourages focused viewing behavior. Comment: This is especially true in older or elderly users. For the rest of your users, stick with 9-12 point Sans Serif (Arial, Helvetica, Verdana) with an average of 10-11. FYI: Only developers appreciate miniature fonts!

5. Larger type promotes lighter scanning. Comment: Most reading behavior consists of skimming and scanning. If you want to slow your users down- use smaller fonts in the body of your content. Use larger fonts to help them cover more territory.

6. Dominant headlines most often draw the eye first upon entering the page- especially upper left of the page. Comment: Remember, Poynter's focus was a newspaper website. However, bear this in mind for portal type design and intranet design.

7. Users only look at a sub headline if it engages them. Comment: So make sub-headlines relevant and of course make them the keyword phrases users and search engines use.

8. Navigation placed at the top of a homepage performed best. Comment: Again, if you understand how users are patterned by other tools they use (Word, IE, Outlook Express)- the goodies are at the top of the page.

9. People's eyes typically scan lower portions of a page seeking something to grab their attention. Comment: This seems consistent with "Information Foraging Theory" where users are said to hunt for information by "scent" or navigation and content of the highest value to them.

10. Shorter paragraphs performed better than longer ones. Comment: Attention is clipped on the Internet. Short bursts of attention are the environment you are designing for at all times. Note: Longer product descriptions do better than shorter ones in ecommerce situations. As with all usability findings, context is key.

11. The standard one-column format performed better in terms of number of eye fixations. Comment: Most users are overwhelmed by the average web page that they try to deflect information as a coping strategy. It is the same phenomenon that occurs at a party when you focus on one conversation and ignore the other conversations around you by categorizing them as "noise". 12. Ads in the top and left portions of a homepage received the most eye fixations. Comment: Interesting, but I wouldn't recommend putting ads there. *Just because they receive eye fixations doesn't mean they put a smile on the user's face*. This is one of the main points of this article!

13. Close proximity to popular editorial content really helped ads get seen. Comment: One of the golden "rules" of usability is that anytime you satisfy the user's task (interest, goal, objective), you increase the likelihood or create the conditions that they will be open to other stimuli (advertising, cross-selling etc.)

14. Text ads were viewed mostly intently of all types tested. Comment: Text ads are popular because they are less distracting, camouflage well with the page and are often not known to be ads and therefore annoyances to the user. Oh, and since Google "pioneered" them- they are the de facto standard in effective web advertising.

15. Bigger ads had a better chance of being seen. Comment: Also repeat advertising on a page by the same company is being used on many sites to reinforce exposure.

16. The bigger the image, the more time people took to look at it. Comment: Using larger images (file sizes) is easier these days since 20% or more (USA) are on high speed connections, but using thumbnails with large images is always a safer bet.

17. Clean, clear faces in images attract more eye fixations on homepages. Comment: Humans are wired to recognize patterns and hard wired to other human faces.

18. Higher recall of facts, names, and places occurred when people were presented with that information in text format. Comment: Good recall depends on the level of relevancy, good copy-writing and content usability (structure and display).

19. New, unfamiliar, conceptual information was more accurately recalled when participants received it in a multimedia graphic format. Comment: It is known in the field of cognitive science that the more emotion involved in a learning transaction, the higher the retention and recall.

20. Story information about processes or procedures seemed to be comprehended well when presented using animation and text. Comment: And the animation or text must be clear, easy to understand and in the language or conceptual world of the audience.