UX Research and Design Strategy

UX Research and Design Blog

Our Thoughts on UX Research and Design

User Research

The key to building strong customer loyalty while meeting your business goals is forming a deep understanding of how customers want to use your site or application to accomplish their tasks. It may sound simple, but it requires a thorough knowledge of what motivates a customer’s behavior.

This is particularly true when it comes to complex websites and applications.

Designing a Research Strategy

Utilizing the depth of our experience, we often combine a variety of research methodologies as a strategy to uncover how your customers think as they use your products. In addition to usability testing, our research methodologies include:

  • Field studies such as ethnographic research and observational interviews
  • Facilitated workshops
  • Card sort activities
  • Surveys
  • Deep dive analytics research
  • Heat maps

We determine the best approach to meet your goals and then translate our findings into detailed and actionable recommendations that inform internal teams from task and workflow analysis to user profiles and personas.

User Research Leads to Success

The best way to understand your customers is to solicit their input – from initial project discovery all the way through to post-launch. It takes some investment do this, but the payoff far exceeds the cost in time and budget. Research shows that when there are at least four customer feedback points during the design process, it significantly increases web and app metrics.

In our experience, we find each customer touch point uncovers an issue that, no matter how small, can make the difference between a customer and a customer advocate.

Damian Conrad
Usability Testing

Usability testing is the best way to gain insights into how customers interact with a site or application. In fact, the more feedback touch points there are during the design process, the more likelihood the site or application will be successful once it is launched.

Usability research is the science that goes hand in hand with the art of design. From early paper prototypes all the way through to full functionality, testing can inform the design process at every step. At Mile7, we incorporate testing into our own design process as well as offer it as a stand-alone service to other companies.

The Importance of Experienced Moderators

Usability testing doesn’t have to be overly complex, but it does need to be done well.

Our usability scientists are masters in human factors, the scientific discipline concerned with understanding humans and computer interaction. They know how to design and moderate sessions that get to the heart of customer issues. And our reports provide prioritized recommendations that are clear and actionable.

How to Learn More About Your Customers

There are lots of ways to learn more about your customers. We can design a test specifically for your customers or with participants who match your customer profiles. And we can test anywhere you have customers, from locally to internationally.

Determining the Right Research Method

There are several different methods of usability testing:

  • In-person (lab-based) moderated usability testing. The best approach when close observation of non-verbal cues is especially important.
  • Remote moderated usability testing. Ideal when it’s important to test participants from multiple geographical regions.
  • Un-moderated usability testing. A low cost option for quick feedback on a specific issue.

With every test, we deliver actionable, prioritized recommendations that can be put into use immediately.

Damian Conrad
NCQA Certification

Mile7 can help your healthcare-related website or application earn the National Committee for Quality Assurance (NCQA) seal of approval.

Our usability evaluations and reports can help ensure that you pass the rigorous NCQA certification process, whether you’re creating a lifestyle tool, provider directory or other web-based healthcare solution.

You Can Rely on Our NCQA Certification Report Expertise

Mile7 conducts usability testing and heuristic evaluations to determine if your application conforms to established principles. And we do cognitive walkthroughs to see whether your customers will be able to complete their desired tasks correctly. Our reports are comprehensive and can be submitted virtually as is to the NCQA in support of your accreditation.

We typically can have a report ready for you in 2 – 3 weeks.

Damian Conrad
Expert Reviews

An expert review is an affordable and rapid method to quickly spot user problems and develop actionable recommendations for improvement.

Reviewers involved in the process typically include usability researchers, ux designers, content strategists and brand experts. An expert review provides a multi-dimensional audit of your website or application  especially helpful when you are planning a new release and want to quickly isolate major issues. There are normally two key elements:

Heuristic Evaluation

The heuristic evaluation revolves around a set of criteria (such as ease of navigation, readability, etc.) that will be used when evaluating the site or application. The findings of each review team member are integrated into a report, which then identifies and prioritizes areas for improvement. A heuristic evaluation can include all of an application or site, or just part of it.

Cognitive Walkthrough

A cognitive walkthrough analyzes the steps required of customers to perform tasks within a site or application. User roles are identified, and scenarios and tasks guide the analysis as reviewers role-play the part of customers “walking through” the actual or prototyped user interface. As with the heuristic evaluation, findings are captured in a report with actionable, prioritized recommendations for improvement.

Though not as comprehensive as a full usability study, an expert review is an excellent tool for improving customer success by quickly uncovering usability issues and learning how to address them.

Damian Conrad
Faceted Search

We’ve spent a lot of time over the past couple of years discussing search. What’s the big deal? Facets.

When the web began there were really two ways to search. The first was by navigation using some type of hierarchy to narrow the scope of a search step-by-step. DMOZ is a great example of that. The other way to search was by direct search, where a user simply types in their search phrase and the computer searches it’s database for matches. That’s Google.

As web users became more accustomed to the direct search method, the earlier navigational approach got left behind. But, as it turns out, the direct search method was not the perfect solution in many cases either. Thus “faceted search” was born.

You’ll see it all over the place today, especially with online retailers.  Faceted search allows a user to find an item through direct search, then use filters or “facets” to narrow their search to find just what they are looking for. It’s really a combination of an initial direct search followed by a navigational search, progressively narrowing the options.

When we build a faceted search platform, it requires a lot of thoughtful planning. It’s easy to jump in and want to create a facet for every attribute, but to do so only overwhelms the user. Finding just the right number of options is key. To make that determination, we rely on user data. What are users searching for? What are their keywords? A usability study is a key tool for us at this point.

Once we’ve determined our facets, we need to decide when they’ll be shown. Again, we don’t want to bog down users. We try to present what we think will be the most useful facets first and then offer the opportunity to click for more.

There’s lots more of course, and when you’re dealing with thousands and thousands of SKUs, options and other data, it gets daunting. But faceted search is a terrific tool to use when crafting a high-performance website – especially in the ecommerce realm.

Damian Conrad
Caring About Customers

You can’t tell a user that you care about them.  Well I suppose you could try, but that’d make for a strange (and, creepy) web experience.  However, what you can do is SHOW a user that you care about them.  Here are some of our favorite methods to accomplish that:

Points of Assurance

You know those little helpful design elements situated near calls to action or on the periphery of a page?  Things like ‘Always free shipping!’, and ‘Shop with confidence on our secure server’  – these are points of assurance, and their purpose is to help a user feel comfortable accomplishing their task.  The secret is to understand your user well enough to know the perfect place and time to expose them.  But make sure you do, they answer common questions that users have before they know they have them.

Beautiful Tooltips and Clever Error Handling

Forms and user-input are often overlooked sections of a site.  There’s a school of thought that believes if a user starts down the road through the forms, they’re likely going to finish – so why spend a lot of time on the forms?  Well, having witnessed many users get hung up on things that you wouldn’t expect, I call that school of thought into question.  A form is a conversation with your user, and is one of the most essential areas for helpful design cues, deep thought, user research, and testing.  It’s a time when users are asked for their personal information, and the most essential time to keep them comfortable.  If they mess up, don’t alarm them – ease them into their errors in a friendly way.  Don’t tell them what they did wrong, show them where they went wrong and help them understand how to fix it.  Present your tooltips and errors with animation that eases in, and try to do it with friendly colors.  Red is an awesome color, but  typically means ‘You’ve done something wrong’, and you don’t need it.  You can accomplish the same thing by softly pointing out what needs attention.  Try not to make them feel like the blame is on them.  They’ll appreciate it.

What next?

Personify your users/customers, think about them.  Try to understand everything you can about them.  Use personas.  View your forms as a conversation with the user instead of a task they have to plow through.  Do these things and your users may not thank you, but they’ll truly enjoy the experience you’re providing to them and accomplish their tasks.

Damian Conrad
The Perils of Cognitive Load

One of the tentpoles of a great user experience is figuring out how to strip away the unnecessary and present a great interface that contains the bare minimum of what we need from the user.   People will make snap-judgements about the perceived complexity of an interface or form, and if you’re not careful in presenting your information and metering out your interface, it can look like too much work.  They may abandon the task until they have more time, or abandon it all together – two scenarios we’d like to prevent.

Quick example: Customer name fields.  

Typically, when filling out a form, you encounter a “First Name” field, and then a “Last Name” field.  Databases LOVE data formatted this way.  Human beings that have to mentally and visually parse the amount of information required to fill out a form?  Not so much.  You can simplify that part of your form 100% by just requiring a “Enter your name” field and parsing out the first name and the last name for your database behind the scenes.  Database is happy, and the user has a more simplified form to fill out.  Removing a single form field might not seem like much, but if you make a dozen decisions like this across your entire product, it adds up to a big difference.

Here’s a longer example, one you’ve probably seen if you’ve purchased anything on the internet, ever: 

eway_credit_card.png

You’ll notice that this site is asking the customer to select their credit card number, and then enter their name, the number itself, the expiration date, and their security code.   There are quite a few things that are actually unnecessary here, and stripping them out creates an experience for the customer that requires far less thinking about what they need to fill out.

Every credit card company has a unique numbering structure, and your form can be easily configured to auto-sense it, making the choice of credit cards unnecessary.  It’s still a good idea to show the payment methods you DO accept, and we’ll get into that in the next example.

Now, the cardholder’s name – in most situations, great news – you already have that information!  The customer has likely already given their name earlier in the checkout.   Someone using a credit card that isn’t in their name is an edge case, not a common case.  You can safely infer that the name of the person filling out the form is most likely the name on the card.  If it isn’t, that’s a problem that’s easy to solve with a small interface addition that allows the customer to let you know they need to enter a different name.

Expiration date and the security code are necessary, but we’re giving them both far too much real estate here.

Let’s take a look at another example: 

apple_checkout_indication.gif

Looks like a simpler, friendlier form, doesn’t it?   The heavier interface we saw in the prior example is gone, in favor of a simpler interface that only requires three things from the customer.  The credit card logos are here, but they are informational only and only serve as indicators of both what payment methods the site accepts, as well as an indication of which card being used after the form is filled out.   You can make them interactive if you like – some users will definitely click on them to select which card they’re using – the only thing  you’ll have to consider is how to alert the user when their selection doesn’t match the card number they’ve entered.  But I definitely recommend giving the user some interactive feedback if they want to click on an element that looks like it could be a choice.

The more opportunities you can find to reduce the visual and mental load you’re presenting to your user, the more usable your product can be.  Never stop thinking about an easier way to collect that piece of information, or a more elegant way to present a form.  Users love it, and your conversion rates will be the proof.

Damian Conrad
User Feedback At Trade Shows

User feedback is so important to the design process, but sometimes it can be difficult to incorporate for a variety of reasons. The people you need may be too busy or otherwise unavailable for some reason. Or maybe there are budget concerns.

What to do?

Sometimes you have to get creative and look for opportunities that fall outside of traditional methodologies. One such opportunity is the trade show. Trade shows can be a great place to get feedback, but there are a few important rules to follow.

  • First, set realistic expectations. Recognize that trade show attendees are typically busy and preoccupied — so set your expectations accordingly.  Unless you have a room or area that is completely quiet, and you have set up meetings ahead of time, odds are you won’t be able to do a formal usability test. But you can still get good input.
  • Second, limit the time to 10 – 15 minutes, ask a few open-ended questions, then let the user take the lead at exploring your website or application.
  • Third, provide some kind of incentive as a show of appreciation. Even though the sessions are short, you still want your participants to know you value their time. A $20 coffee card is perfect.

Recently we conducted user feedback sessions on a newly launched e-commerce website at an industry trade show — and gained valuable insights that helped inform our post-launch enhancement list. Because we let users interact with the site with no initial task or direction, we received a wide range of input. But we also gained valuable insights that we weren’t able to get when we were testing on an early pre-launch version of the site.

For instance, many of the participants started with a keyword search. A customer service rep who sat in on the interviews interpreted this to mean that the participants weren’t seeing the main navigation. But when asked, they indicated they were familiar with either part numbers or product names and preferred to start with a keyword search. (A good reason to have a trained usability expert facilitating the conversations even when informal … it’s easy to draw conclusions that may not be correct.)

For more information about conducting usability interviews at trade shows, check out this UPA article.

Damian Conrad
3 Reasons To Make Your Site or App Accessible

“The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”

– Tim Berners-Lee, father of the World-Wide Web

When we mention WCAG 2.0 and Section 508 in meetings, our clients generally have an awareness of these accessibility guidelines, but it usually doesn’t go much deeper than that. We’re also surprised by how infrequently we get requests for conducting usability tests with people with disabilities or how often we get asked to make sure that online applications meet these requirements. Yet now more than ever, it’s important to make sure your website, online product or application is accessible to all users. Especially if you provide a product or service that allows people to complete transactions online. Think of what online grocery shopping means to the person with a mental or physical disability who may find it challenging to travel to and navigate around the grocery store. The Internet brings true conveniences not possible in the past to a significant segment of the population. So let’s dive in.

Vision

Almost 20% of people over the age of 70 have some type of trouble with their vision. As our society ages, effectively serving this population will continue to grow in importance.

Color blindness affects 7-10% of men and a small percentage of women. If you’re using color to indicate states on your site, especially anything in the red and green spectrum, you want to be extra careful that what you’re communicating to your users is clear even without using color.

It might come as a surprise that people who are legally blind also use the internet and mobile devices. They rely on screen reading functionality to help them navigate and make choices. You want to be certain that your site is friendly to screen readers, and that your architecture and images are helpful to someone who is navigating the site by touch and hearing. For instance, making sure your forms are laid out in a logical and intuitive manner, so they meet the expectations of a user who might be tabbing through the fields using their keyboard. Fortunately, many best practices for everyone are also friendly to people with disabilities, such as clear and concise link text and alt-text for all of your images.

Hearing

Do you have videos or other audio cues on your site? More than 30% of seniors have hearing disabilities, and while it doesn’t affect the general population with that much severity, it’s a great idea to ensure that you have captioning for any video content you’re serving on your site.

Dexterity

This is primarily a mobile experience consideration, but the concepts translate to the desktop as well. You always want to be certain that the touch-targets in your interface are large with clear labels that are very reactive to interactivity. If your users are primarily using a mouse to navigate, these concepts are just as important. No matter which pointing device you’re using, it’s always best to err on the larger side.

So why do all of this? 

In addition to being good stewards of the internet, in some cases it’s also the law.  Section 508 requires all government agencies to make their electronic and information technology (EIT) accessible to people with disabilities. In addition, the National Federation for the Blind won a class-action suit against Target Corporation, citing that their e-commerce website didn’t conform to accessibility guidelines, and could not be used by a non-sighted person. After two years of litigation, it went all the way to a federal court and Target had to pay a six million dollar settlement as well as conform their website to current accessibility standards.   

Making your site truly accessible is the right thing to do for so many reasons. It’s the right thing to do for people, which means it’s also the right thing to do for your brand.

Damian Conrad
Scrolling - Three Things To Avoid
Dec10_Scrolling1.png

Outside the interactive industry, there is a lot of controversy regarding whether or not users like to scroll. “The Fold” is still being thrown around a lot during meetings, even though the landscape has changed so much over the last ten years that the traditional definition of “The Fold” no longer even exists.

Let’s put this to rest.  The explosion of devices has created hundreds of different folds, and it’s impossible to optimize for them all.  Users scroll.  Almost always.  The past several years of interactive technology and touch-based interaction has taught nearly every user group across the board that scrolling is the primary interaction method for websites and content apps.  As long as the content and context are appropriate for the user and they’re following appropriate tasks, users have no problems scrolling to discover and interact with more content.

We’ve found this to be true for nearly every project we’ve worked on, and our usability tests bear this out with most user groups.   However, I do have a few cautionary tales for you – things important to keep in mind to help maximize the usability of your project.

1. The Dreaded False Bottom

It’s important to be careful to avoid the situation where the site content can appear to be finished at common resolutions, with further content down the page separated by a gap.  If that gap is wide and falls right that the bottom of the user’s viewport, it can create the impression that there’s nothing else to see here.  So our recommendation is to to limit the height of content gaps as much as your design will accommodate, so any remaining content peeks up from the bottom to alert the user that there’s more to experience.

2. Horizontal Scrolling

You’ll see this primarily on more artistic or experimental interactive projects, but it does occasionally rear its head on larger brands. If you’re blessed with patient and curious users, they will usually figure out how they work.  But the interaction is unnatural enough that we don’t recommend using these methods except in very specific, well thought through cases.

3. Scroll Jacking

This is my personal white whale.  It’s become trendy to create interactive presentations where the page itself does not scroll, but traditional scrolling controls trigger animations in the current viewing area of the site. Once the animation completes, the scrolling interaction usually switches context and works the way the user expects it to, although it’s often still sluggish and lagging behind the user’s input.  During many of these, scrolling on the mouse ceases to function until they’re finished showing you their animation.

An impassioned plea on behalf of my fellow users: Please quit doing this.

This behavior is a speeding freight train that terminates at the frustration center of the human brain.  The user is expecting something to react to their input, and the site is doing it slowly or refusing to do it at all.  This makes your prominade of beautiful design and animation feel like it’s slow or unresponsive, and that’s probably not the experience you’re shooting for.  The best examples use animations and scrolling that closely mirror and respect the users’ input.

Constant Evolution

So instead of spending time using outdated publishing industry terminology and concepts to debate where to put content, shift your thinking around how compelling your content is, structure it clearly with good indications when more exists, and be sure to watch key pages with tools like CrazyEgg to see which pages are enticing users to read all that content you work hard to create.

Damian Conrad
Hamburger Menus and IA Challenges

If you’ve been around any websites or mobile apps lately, chances are good that you’ve run into this guy:

July14_Hamburgermenu.png

That, my friends, is what’s collectively known in our industry as “The Hamburger Menu”.  A catch-all interface element that traditionally exposes all the available user interface choices on a website or mobile app.  Its prevalence has become rather seductive because it seemingly solves a lot of problems, specifically “How am I going to fit all my options into a tiny space?”.

Now, I’m not about to get on a soap box and decry these things from on high – there are some legitimate uses for a menu that contains a bunch of hidden choices.  However, the operative term in that statement is “Hidden”, and that is almost always problematic.

Whenever you have to hide something from a user, you always run the risk of them not seeing it or missing its significance completely. Users don’t typically try out every interface element you show them.  They tend to scan around and zero in on something that catches their eye.   A catch-all menu interface is tempting – but it’s always in everyone’s best interest to whittle down the available options and expose all the things the user is expected to do:

July14_twitter.png

This is the entirety of the mobile twitter interface.  It’s important to note that there are many more things you can do in the twitter app, but this is what they’ve exposed.  Every other function is within a contextual control somewhere else in the app. This is always an excellent method to simplify things and only expose controls where they’re needed.

You can also utilize a mixture of the two – like Facebook does:

July14_facebook.png

Here you’ll see the top four global options that the majority of Facebook users need to do at any given time.  Since Facebook does have quite a few other things that their users might need to do (manage groups, see events, etc), they put them all behind a hamburger menu on the far right.  You’ll notice that they’re also labeling it “More”, so it families with the other icons as well as identifying itself so the user knows what it is.

In general, it’s a good idea to label your hamburger menu just in case a user isn’t familiar with the icon.  There have been some great tests on these issues, and we urge you to have a look at the findings. In a perfect world, your interface should directly mirror the top level of your information architecture, without anything hidden or obfuscated.

“That’s great, but my app HAS to have more than I can show on the screen at one time. “

Does it?  If you have the luxury of being able to create your mobile experience first, you have a great opportunity to view your information architecture through a new lens.  If there’s content that doesn’t need to be there, get out the scalpel.  Even if you’re not designing mobile-first, I bet you can still find some places where you can slim down your sitemap.

 

“Yeah, yeah, but your scientists were so preoccupied with whether or not they could that they didn’t stop to think if they should.”

     -Dr. Ian Malcolm, Jurassic Park

 

The elegance of any interface lies in its simplicity.  If you can have the patience and fortitude to wade through all the stakeholder issues, pet projects, and user stories – and saying “no” when appropriate – you can come out the other end with a great interface that tests well and delights your users.  It’s the most challenging labyrinth we have to navigate as designers, and it’s the most important.

Damian Conrad
UX Design For a Senior Audience

It’s easy to get comfortable in our designs, to assume that many users are probably like ourselves. Able-bodied, dexterous fingers, with good eyesight that can see the full spectrum of color. In many cases, the reality is a lot less clear.

The fact is that older users are one of the fastest growing segments of internet and mobile products, so it’s absolutely essential to make your product as friendly as possible to ensure that your hard work designing makes it usable by the greatest number of people. Recent surveys have shown a remarkable upswing in users over 65.

It’s important to remember that there are two main types of senior user groups. One of them has been using computers for a while and is experiencing the gradual decline we all go through during the aging process, and the other has all the accessibility issues from group one, but only started using computers in recent years.

They both have potential sensory and accessibility issues, but the latter is compounded by the problems inherent in being a relative newcomer to technology. Fortunately, some of the tried-and-true interactive design technique best practices, if adhered to, will make sure your product works well for both of these groups. Things like clear, concise language, simple user paths, bold typography that’s high contrast and easy to read… the things you should do for everyone benefit aging users the most.

And before you run off and assume that you have no aging users, bear in mind that these issues start affecting people around the age of 35 – which is not considered a senior user by a long shot, but many of them have the same vision problems that plague users 20 years older.

Many of the baby boomers fall into the adept-with-issues category, and that is an enormous slice of the potential user pool. As this segment ages further, accessibility issues become even more critical to address in the early design phase of any project alongside how everything scales to different sizes and what contexts are expected. It’s safe to assume that a growing portion of your user base is going to be older adults, and the sooner you bake them into the design, the better off you’ll be in the long run. You’ll enjoy higher conversion, greater customer retention and above all:  happy users satisfied with your wonderful products and content.