Needfinding, Redesigns, UX for Everyday Use
Kathy Bateman
Puzzles of Thirst

Puzzles of Thirst: A man dies of thirst in his own home. How's this possible? And can UX help?

Aquent Gymnasium, Resources
Kathy Bateman
Reflections on Google’s New Multi-Screen World ...

How many times do you work on your computer during the day? What about your tablet? How often do you pick up your phone to do a quick internet search or find a store nearby? Do you play on your phone while watching TV?

Google asked these questions in their study "The New Multi-Screen World Study: Understanding Cross-platform Consumer Behavior," published in 2012.

Why am I talking about this on a UX blog? Because there are some incredibly valuable lessons to be learned about when and how people view your website/app/thing-you-designed-to-be-viewed-on-a-screen.

UX History
Kathy Bateman
Dr. Grace Murray Hopper - UX Pioneer

Perhaps, if you are an inquisitive geek or fond of history, you have heard of Dr. Grace Murray Hopper. I think I may have heard the name in passing at one time or another, but the name didn't mean much to me until the other day when I read a section in this book to my daughter:

Girls Think of Everything: Stories of Ingenious Inventions by Women

Wherein I realized that Grace Hopper is the most awesome role model ever for a woman following her dreams in the user experience field.

Aquent Gymnasium, Graphic Design, Web Design
Kathy Bateman
Fruity Cone: the Food Trailer of the Future

During Aquent Gymnasium's Coding for Designers, the instructor often encouraged us to expand on and practice ideas presented in the class. One assignment was to code the home page for a restaurant website based on a Photoshop comp. Not only did we practice creating pixel perfect CSS, we also learned and experimented with Twitter Bootstrap and Google Web Fonts.

The extra credit assignment for this assignment was to invent our own restaurant and design a Photoshop comp for the desktop version of the home page. Then we had to code the website utilizing Twitter Bootstrap and Google Fonts.

Fruity Cone: the Food Trailer of the Future
Aquent Gymnasium, HCI Course
Kathy Bateman
2013 Online Course Wrap-up

Happy 2014! Want to learn something new? Try a free online course!

I've participated in several during the past year. What I've noticed is that online courses have different goals and different audiences depending on the source. Thus you'll get different things out of each one. Here's an overview of the courses I took. See what works for you.

, , ,

HCI Course Part 3 - Wireframing

, , ,

This is part three in my series about the Human-Computer Interaction course I took through Coursera. Read all my posts for the full story.

Assignment 3 Wireframing

After choosing a concrete direction (Mary Jo's Storyboard in my case) we jumped into the process of prototyping by creating two rapid interactive wireframes that varied in interface, but offered the same basic functionality.

The process of rapid prototyping involves producing your ideas quickly and testing them. Confirm if your designs work as planned. Based on what you learn from those tests make more designs and refine previous ones. Test more. Refine and adjust. Test. Repeat again. Iteration upon iteration to improve and refine the design.

,

HCI Course Part 1 - Needfinding

,

As I mentioned previously, during April & May 2013 I participated in Scott Klemmer’s Human-Computer Interaction course from Stanford Online.

In this course, you will learn how to design technologies that bring people joy, rather than frustration. Helping you build human-centered design skills, so that you have the principles and methods to create excellent interfaces with any technology. (more)

Over a series of posts I'll share some of my coursework with you. This is the first of the series. Read them all!

,

Personas for Everyday Use

,

Recently I found myself helping a friend who was stuck while trying to write the cover letter for a job application. Now I know she's not the only person to have writer's block in this situation. After stumbling around for a while I came upon a solution that will hopefully help you as well:

Write a persona for the recipient of the cover letter. 

,

To Buy or Not to Buy

,
hyundai-questions.jpg

Recently I found myself on the hunt for a new-to-me used car. After researching at places like Edmunds and Kelly Blue Book I proceeded to scour car dealers' websites for my preferred makes and models. Since this was my first time buying from a dealer I had a lot of questions. The questions I started out with were about the cars.

The questions I ended up with were about the websites.

For example, I selected a car from South Point Hyundai's list of used cars and saw:

Hyundai Screenshot

Hyundai Screenshot

This is a partial list of questions I had while looking at the page:

hyundai-questions.jpg

Hyundai questions

The questions I had about the page as a car buyer fell into two general categories: how can I find information about this specific vehicle being offered (features, price, etc) and why are there different buttons and links that seem to be the same thing?

Now I assume that the goal of a car dealer's website is to get you to come in person to see the car you want and then, depending on the specific dealer's philosophy, possibly up-sell you to a newer, more expensive car.

Here's my redesign to address my questions as a car buyer while also focusing on the dealer's goal:

Hyundai revamped

Hyundai revamped

First to address the consumer's need for information specific to this vehicle:

  • Add more photos of the actual vehicle being offered.

  • List features and options available on this specific vehicle in the second tab (possibly renamed).

  • If the advertised price is not available place an obviously click-able link to request the price.

To minimize buyer's confusion and information overload:

  • Remove one of the "Make an Offer" links.

  • Remove the "Request More Information" link (the "Ask a Question" link provides the same service).

  • Consider hiding the "Calculate Payments" box on pages without an advertised price.

For the car dealer's goal to get you to come in person and possibly up-sell the purchase:

  • Give the top right highly prominent spot on the menu the command to "Test Drive Today".

  • Directly under that, list location specifics and the hours open. Presenting these details removes the need to click through to a different page and the need to determine which departments' hours are relevant. That means a buyer could drop everything to run to the dealer immediately without the need to wait for another web page to load.

  • Add a third tab at the top to provide the details of this year's version of this vehicle. This allows consumers to easily sell themselves on the newest model because it has all those extra features they want.

As for me, I did find the car I wanted at a different dealer, one whose website quickly and painlessly answered my questions.

The Parable of the Corks and Rubber Stoppers

The Parable of the Corks and Rubber Stoppers

Match between system and the real world The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

-- Jakob Nielsen's 10 Usability Heuristics for User Interface Design

Recently I found myself searching for a new rubber stopper for a piggy bank. I needed a short and wide rubber stopper or cork. The hole in the piggy bank has to be big enough to get the coins out of the bank yet the stopper must be short enough to allow room for many coins to fit in the small bank.

Not knowing where to find an item with this shape I started by searching the websites of some big name hardware stores. My hope was to visually scan pictures of items until I saw what I wanted and then drive to that store to buy it.

, ,

Heuristic Evaluation

, ,

One of the wonderful resources shared in Klemmer's HCI course are the articles by Nielsen Norman Group. Specifically, here are three we used to help us evaluate assignments during class. How to Conduct a Heuristic Evaluation discusses how to use a small set of people to examine an interface for usability issues with a list of criteria (heuristics) as an evaluation tool.

10 Usability Heuristics for User Interface Design presents some of the most general principles of interaction design. This list can be a good starting point for what to look for when evaluating an interface.

Severity Ratings for Usability Problems provides a way to prioritize the issues found with an interface.

Next up I'll be using these as guidelines as I search the web to find sites with usability issues.

,

Human-Computer Interaction course with Scott Klemmer

,

For anyone interested in learning UX I highly recommend taking Scott Klemmer's Human-Computer Interaction course from Stanford Online. It is one of the massive open (free) online courses available through Coursera. During April & May this year I participated in the third run of this class. I learned an incredible amount through the online videos, quizzes, assignments, peer-review and student interactions. If possible, set aside the 10-12 hours a week to complete the full studio track.

In the next posts I'll be putting into practice some of the things I learned and share some helpful resources. Enjoy!

Do Professional Organizers Use UX?

I love organizing stuff. For a while I considered become a professional organizer. There is a special joy in making a space cleaner and neater. (My 7 year old self does not believe I’m really saying this.) Organizing for yourself is easier, I think, than organizing for someone else. You know where you’ll look to find things. You know what makes sense to you. You know you’re always going to take your shoes off first thing in the door so why bother putting the shoe rack any where else?

If you organize for somebody else though things get sticky. It doesn’t matter where you put your shoes in your house if you’re organizing someone else’s front hall. Sure you could put the shoe rack there and it would look great with all those shoes you put on it for a week, maybe two. But if your client doesn’t ever take off shoes until reaching the bedroom it won’t get used. That shoe rack you so carefully placed becomes just another shelf to dump random stuff on.

So what do you do?