September 9, 2014

Pick My Brain #009: Interaction Design vs. Interface Design

Interaction Design vs. Interface Design

Today’s question comes from S. Mitra, one of the 10,000+ students taking my User Experience Design Fundamentals course on Udemy.

Q: In principle, I understand why Interaction and Interface design may be worded differently, but am having a bit of a difficulty getting head around the difference between them.

For example: when I have an entire wireframe complete with planned functionality waiting for the visual design to sit on top of it, is that interface or interaction?

A: This is an excellent (and very common) question. Here’s my quick take on the difference between the two:

Interaction design is concerned about how the person interacts with what they see on the screen – whether they know what to tap, swipe or click, and whether what happens meets their expectation and moves them closer to their goals. Interaction Design is all about figuring out how people need to use what you’re designing, and what cues (cause & effect) you can give them so they know how to take action. The bulk of interaction design efforts have nothing to do with final colors, fonts, styling, etc. The focus is on the flow of tasks, sequences of events and making sure there are appropriate visual cues that direct and guide the user in those activities.

Interface Design is the visual styling on the screen. What things look like, how they’re arranged and how they relate to each other visually in terms of hierarchy. Font choices, color schemes, graphic elements, button and menu styling all fall under the umbrella of interface design. It’s worth noting that even though the heavy lifting of how all of this gets used has already been decided, visual/interface design decisions can often prompt design teams to reconsider those things that seemed finalized.

Put another way:

  • Interaction design determines what’s on the screen
more  

August 22, 2014

3 critical secrets for better UX requirements

3 Critical Factors for UX Requirements

All too often, UX requirements come from a scenario where the discussion in the room is focused on the product itself – data, processes, controls, functionality. It’s usually a “what will it do and how will we build that” discussion. Most IT folks I’ve worked with refer to the process as “gathering requirements.” There are two problems with this concept.

First, and I’m stealing this from Kim Goodwin, because she’s 100% right — is that requirements can’t be “gathered.” They’re not growing on a tree in the office just waiting for us to come by and pick them. Requirements do not exist until a collaborative exchange happens between all players in the project — the client’s teams, the IT department, UX and UI designers, Marketing, Sales, et. al. So if anything, requirements are really negotiated.

Uncovering and defining UX requirements for features, functionality and content is a balancing act between you, the client, internal forces and external forces. It’s a negotiation across all of those things. So it’s perfectly normal if in the first one hour session you don’t know everything there is to know about what your requirements are. It’s a multi-step process that’s more a marathon than a sprint, and you have to go through it.

Second, you are making a critical mistake if your discussions are focused solely on the mechanical functions and processes of the product. Features and functions are only a small part of the requirements picture, in terms of designing and building something that gets used and delvers measurable value (read: ROI). Making sure your requirements address the things that really matter strategically means making sure you think about, talk about and work through three (3) different kinds of UX requirements:

  1. There are things people say they need.
  2. Then there are things that they actually need.
  3. And then finally, there are things that they don’t
more  

August 20, 2014

UXers: If you could sit down with me for coffee or a beer…

…what’s your #1 most burning question you’d want to ask me?

Click here and let me know.

more  

August 14, 2014

9 Ways to Improve eCommerce Customer Experience

ecommerce-customer-experience

Survey every article you can find about poor, underwhelming or non-existent customer service and the overwhelming majority will be about ecommerce customer experience. Despite all our advances and seeming maturity in User Experience design and Customer Experience strategy, ecommerce experiences are still, by and large, bad. In some cases, beyond bad.

The thing is, it isn’t really that hard to make them better. To wit, here are 9 ways to improve ecommerce customer experience that are (a) painfully obvious and (b) frequently overlooked.

  1. Clear Layout & Navigation. Is this a store? Is it obvious that I can buy things here, and do I have a sense of the breadth & depth of what’s offered?
  2. Proof of Value. Social proof & testimonials. Who else has bought from you or used your products, and what do they think? If I don’t see reviews, you’re immediately suspect.
  3. Make it About Me. I don’t care that you’re the leading blah blah blah blah blah and your products are blah blah blah. There is only one thing I want to hear from you, in answer to a very simple question: What’s in it for ME?
  4. Give to Get. If you want my email address, give me something of value. Coupons, rewards, freebies, etc. Show me that you care about making it worth my while.
  5. Keep Your Promises. If you say I’ll get something valuable for giving up some privacy, you had better send me something valuable. If you say you’re going to email me valuable coupons every month, DO IT. Deliver exactly what you promised, when you promised it.
  6. Limit Form Field Requirements. I’m the customer, so my natural mindset is always minimum effort, maximum reward. Only ask for what you absolutely need, because the Internet has trained me to know
more  

August 5, 2014

Pick My Brain #008: Recommended Resources for Usability Testing?

Interaction Design vs. Interface Design

Today’s question comes from Raguram Venkatesan, one of the 9,215 students taking my User Experience Design Fundamentals course on Udemy.

Q: Hi Joe, first, I just wanted to drop a note that the ebook is fantastic. I am interested in knowing if you have any resources for usability testing. We have recently completed an internal product release at our company and I am interested in getting some real feedback on the usability front. Any advice/resources would be greatly appreciated!

A: Hi Ragu! Thank you for the kind words on the ebook — I’m thrilled to hear you’re finding it valuable and I really appreciate your saying so.

With regard to usability testing, there are several ways to do it — and what I want to stress up front is that this does not have to be a formal process! Regardless of the method you choose, the 3 questions you need to ask and answer up front (which will help you determine the method best for your situation) are:

  1. What will we test?
  2. Where will we test?
  3. Who will we test?

The answers determine how detailed your usability testing needs to be.

What: if you have a lot of moving parts (screens, functions, workflows) that need to be tested, capturing and measuring results may become difficult if you’re doing it guerrilla-style.

Where: If your users are spread out geographically and it’s difficult to get everyone in a room at the same time for a single session, an online tool may be the right answer.

Who: If your users fall into multiple categories in terms of personas, job roles and what part of the system they’ll use, you may want to run separate tests for each group, workflow and

more  

July 31, 2014

Feedback: 5 Principles of Interaction Design To Supercharge Your UI (5 of 5)

In last week’s post, we discussed predictability, the fourth core principle of interaction design. In this final installment of our five-part series, I’d like to share another critical – and often overlooked – component of great interaction design and positive user experience: feedback.

Just like form matters in industrial design, feedback is absolutely essential to interaction design. And I’m talking about much more than simply supporting individual moments, actions and interactions. Feedback serves a larger purpose in any system as a whole, in that it tells people how they can, and should, interact with what’s on the screen.

Principle 5: Good Interaction Design Provides Feedback.

Feedback communicates the results of any interaction, making it visible and understandable. It’s job is to give the user a signal that they (or the product) have succeeded or failed at performing a task.

On desktops or laptops, when you hover over navigation items, you expect them to change color or load a submenu. That’s feedback, telling you that the item is clickable. Progress bars and animations are also common feedback mechanisms, used to inform people that the system is doing something. And the simple act of using the correct visual form for controls (e.g. buttons that look like buttons, underlined text hyperlinks) provides immediate visual feedback.

Essentially, feedback answers questions across four categories:

  1. Location: Where am I?
  2. Current Status: What’s happening – and is it still happening?
  3. Future Status: What will happen next?
  4. Outcomes & Results: What just happened?

Feedback tells us whether or not we’re moving closer to accomplishing a task or achieving a goal. It tells us if errors have occurred, and if so, what to do about them. Feedback can be attention-grabbing via modal alerts and dialogs that cover the screen, or it may be as subtle as an icon that communicates status. Feedback

more  

July 23, 2014

Predictability: 5 Principles of Interaction Design To Supercharge Your UI (4 of 5)

In last week’s post, we discussed the third core principle of interaction design, learnability. Today I want to talk about a principle of interaction design that goes a long way in making users feel confident, comfortable and in control: predictability. Predictability means that all aspects of the interaction design should set accurate expectations about what will happen – before the user taps, swipes or clicks on something.

Principle 4: Good Interaction Design is Predictable.

“If you can accurately predict what’s going to happen next 
in an interaction, it’s because the action you’re taking is understandable, clear, logical, and makes you feel confident.”
Robert Hoekman, Jr.

Predictablity in interaction design can be measured pretty easily, and Steve Krug’s excellent book Don’t Make Me Think sums it up perfectly. Ask yourself if users will be able to answer these questions:

  1. Where am I?
  2. How did I get here?
  3. What can I do here?
  4. Where can I go from here?

Krug says that if you can drop a person into the depths of a site or application, ask these four questions, and get correct answers to all four, then you have:

  • provided a strong sense of place
  • set the correct expectations
  • made it possible for people to accurately predict outcomes 
of interactions

The sense of comfort that is created as a result is a critical factor in keeping people on the site, fully engaged and moving forward. A sense of control – which is a hard-wired cognitive requirement in the brain – speeds task completion and makes people feel good about what they’re using, what they’re doing and what they’ll be able to accomplish.

The following infographic provides some interaction design principles to help you improve

more  

July 15, 2014

Learnability: 5 Principles of Interaction Design To Supercharge Your UI (3 of 5)

In last week’s post, we discussed the second core principle of interaction design, visibility. Today I’d like to share the next principle of interaction design critical to UI Design and Good UX: learnability. The bottom line: interactions should be easy to learn and easy to remember

Principle 3: Good Interaction Design is Learnable.

When we talk about good interaction design, our ideal hope is that people we’ve designed an app, site or system for 
use it once, learn it rapidly and remember it forever.

The truth, however, is a little more practical. What usually happens is that they 
use it a few times, learn it, and hope they remember 
it for next time. Our job, as designers, developers and UX professionals of all stripes, is to make that learning and remembering possible. How do we do that? By making our interfaces intuitive.

What “Intuitive” really means

While there are lots of opinions here, what the term intuitive really means is 
“single trial learning.” Meaning that once we run through it, we’ve got enough of a handle on it that we’ll be able to do it again. That doesn’t mean we automatically remember everything the next time around, though; it simply means the Interaction Design is clear, consistent and visible enough that we’ll be able to easily infer what to do first, second, third, etc.

Even interfaces that are easy to use may require learning, and the more we use them the easier it seems. Leaning is also enhanced when the interaction cues we see mimic those we’re familiar with. We learn behaviors from our experiences across the web, devices, and real-world places and objects. These experiences are what create our expectation and intrinsic assumptions and understanding of how things are supposed to work.

The learnability of a product can be measured

more  

July 10, 2014

Pick My Brain #007: How do I create a UX portfolio with no real-world experience?

Today’s question comes from Rashmi Bhat, one of the 8,267 students taking my User Experience Design Fundamentals Course on Udemy.

Q: Joe, I was reading a blog on how to find job as a UX/UI especially if you are new to this field. As I am just in learning mode, how can I make a portfolio without having worked on any real projects (without any experience)?

A: Rashmi, this is an excellent question, and it’s something that every new designer or developer struggles with. The unfortunate reality of this industry is that you’re expected to be able to demonstrate proof of your ability, via a UX portfolio, but nearly all entry-level UXers haven’t had any real clients yet. It’s a rather large Catch-22, to say the least.

However, that does not mean you can’t show proof of what you’ve learned, and how you are able to apply that knowledge! What any potential client or employer is looking for is proof you can help them in some meaningful way. And while they will most certainly lean toward candidates who have actual client experience, I assure you it’s not a requirement that will keep you from getting your foot in the door. The key to overcoming that lack of experience is making a strong showing of how you use your UX skills to improve things. Here’s how you do that.

Create projects for yourself.

Take a website (or an app or a piece of software) you feel could be improved and develop a new Information Architecture for it. Or create a set of wireframes that show how the site’s UX or UI could be improved. In your UX portfolio, you show every aspect of the process, not just the finished UI design: your notes, sketches, Information Architecture, Workflows, wireframes, etc.

more  

July 8, 2014

Visibility: 5 Principles of Interaction Design To Supercharge Your UI (2 of 5)

In last week’s post, we discussed the first critical principle of interaction design, consistency. Today I’d like to share the next principle of interaction design critical to UI Design and Good UX: visibility. Put simply, you can’t invite interaction and engage visitors if they’re unaware that the opportunity to interact exists!

Principle 2: Good Interaction Design is Visible.

One of the ways our brain shapes experiences is that it’s constantly noticing and interpreting clues in our surrounding environment: what is it, what does it mean, what does it do? And while we notice just about everything (even unconsciously), there’s a balancing act required for interaction design that (a) invites action and (b) is easily understood. People should be able to easily tell that an opportunity to interact is available, and they should be able to reasonably predict what the result of that interaction will be.

A word of caution, however: while interaction design cues should always be made visible, requiring no conscious thought, too many cues is often worse than none at all.

When we can’t tell what’s interactive, or when we can’t tell the difference between options, we guess. We click, tap and swipe at everything in sight, which leads to coincidental system actions and results. And if the results aren’t what we expected, we get nervous. Have you ever clicked a button more than once because the system didn’t seem to be responding? And then experienced a series of chaotic events when it did respond? That’s what I’m talking about here.

Good visibility means that obvious prompts and cues are present, which:

  1. Lead the user through an interaction
  2. Guide them through a series of tasks
  3. Indicate what possible actions are available to them
  4. Communicate the context of the situation.
more