UI Design

4 Reasons Minimal UI May Mean Minimal Users

4 reasons less UI may mean less users

Common UI elements — buttons, menus and common actions —are a very significant part of what makes a site or app useful. The “chrome” as these elements are called, is being minimized in favor of increasing the amount of valuable content on the screen. In theory, Minimal UI is a solid approach; the intent is certainly noble and logical.

But hiding those elements, while certainly trendy, comes at a cost that many designers, developers and organizations are slowly waking up to.

Take our ubiquitous friend the hamburger menu, for instance. Originally designed for small 5-inch mobile screens, it’s also becoming widespread across apps and sites for larger tablets, laptops and desktops. And it confuses the hell out of people in those use cases.

Designers, developers and tech folks tell me, “everyone uses the hamburger, so people are used to it now.” But what I hear much more often, from a much wider swath of users across age groups from 17 to 70, is “how the hell do I…”

So I’m calling bullshit on the “people are used to it” bit. The people who are used to it are tech-savvy by nature and by discipline, and are mostly comprised of first- and early-adopters. Exploration and discovery constitute a positive user experience for them, so a Minimal UI approach makes sense.

The majority of users, however, are not so inclined.

The only studies I’ve seen over the past

more  

  UI Design

9 surefire tips for better data visualization design

9 Surefire Tips for Better Data Visualization Design

Imagine you are standing in a room with 100 other people, all of whom are shouting at you at the very top of their lungs. You are expected to (a) hear every word of what each person is shouting, (b) fully understand what each person is shouting, and (b) recognize all the ways in which each person’s diatribe is related to all of the others.

Impossible, right? Of course. But that’s exactly what happens when a user is confronted with a poorly designed data visualization.

The purpose of data visualization is to bring order to chaos, to allow a user to quickly read and understand multiple attributes of a particular issue, topic or data point. However, the majority of data visualization design I see does the exact opposite; the UI design styling adds complexity instead of simplifying it.

In the majority of sites, portals and systems, for example, data usually appears onscreen in the form of a table. That’s because this format usually an apples-to-apples correlation to how that data exists in a database. There’s nothing inherently wrong with this, except for the fact that these tables are almost always very poorly designed.

The visual styling far too many designers and developers use is informed by poor sources (Word and Excel, I’m looking at you). The proliferation of ubiquitous CMS templates created by folks who are decorating instead of designing has only made

more  

  Tips & Advice

3 keys to launching your UX career

3-keys-to-launching-your-ux-career

Not a day goes by that I don’t receive an email from someone who’s new to the world of UX and isn’t sure where to start. Whether you’re just out of college or are transitioning from a related field, the discipline can seem daunting because it’s comprised of so many parts and processes. But while there’s definitely a lot of ground to cover in answering that question, there are 3 keys to launching your UX career that are absolutely at the top of the list.

So if you’re at the beginning of your journey, take a deep breath, focus squarely on these 3 things, and let the rest come by itself.

  1. Become an Information Sponge. Absorb and learn everything you can about ALL areas of UX — don’t fixate on any single aspect of UX or UI design. Take a wide, holistic view, because ALL of these things have to work together in order to create a valuable User Experience. Design isn’t enough, technology isn’t enough, good ideas aren’t enough. Consider Interaction Design, Information Architecture, Ethnography, Graphic Design, Programming, etc. You may not be able to do all of these things equally well — and you don’t have to. But you do need to understand what role each discipline plays and what impact it has on work in other areas. You DON’T need to know every new practice or process or method that comes out and is talked about
more  

  UI Design

5 Crucial Principles for Great Mobile Design

5 Crucial Principles for Great Mobile App Design

The exponential and continual explosion of apps for mobile devices is certainly keeping us designers and developers on our toes; it’s tough to keep up. The good news, however, is that while technology advances and devices evolve at breakneck pace, the principles for great mobile design remain the same. Here are the five you need to know and apply.

  1. Design the parts to be consistent with the whole. Designers are often expected to break with convention. Apple encourages all of us to “think different.” But you need to remember that your app is a part of a larger family — everything else on the user’s device. Any OS introduces conventions to the user, consistent interaction patterns that allow them to get a quick handle on how things work, a model that shouldn’t be broken. When Sheila’s favorite app suddenly introduces a way of deleting content that runs counter to the way she deletes something in all her other apps, she gets frustrated. And that is often enough for her to start seeking alternatives or delete the app altogether.
  2. Make opportunities to interact obvious and visible. A user can’t interact with something on the screen if they can’t tell the element is interactive. The ubiquitous “hamburger” menu, for example, is quickly becoming a design convention — but the jury is still very much out on whether the majority of users know
more  

  Tips & Advice

Pick My Brain #011: Do I have to use blue for hyperlinks in my UI design?

Blue for hyperlinks in UI design

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

Q: Is it important to use blue for hyperlinks? Blue clashes with our color palette. Do I need a different color for links moused over? selected? If so, what is a rule of thumb for that?

A: Great question Krista. The short answer is no, blue is not required at all. What is important, however, is that:

  1. The hyperlinks stand out visually from the other text, and
  2. On laptops or desktops, there is a state change that indicates interactivity.

For phones and tablets, there’s no hover state, so #1 above is most important. In that scenario, you can change color: for example, make hyperlinks orange if the text is black or dark grey (use a significantly different color). You can also make hyperlinks bold, a different font size, or a different font altogether. And, if it’s not visually distracting, you can underline them. All of these approaches send a clear visual signal that this piece of text is a link; that it does something.

For #2, you’d do this in addition to making the link visually distinct. When a link changes appearance on hover, for example, you’re sending a clear signal to the user that reinforces their suspicion that this does something. An appearing underline, a change to bold, or a significant change in color all reinforce the message that this is a link.

And in my opinion, you

more  

  Tips & Advice

Pick My Brain #010: Navigation Design vs. Interaction Design

Blue for hyperlinks in UI design

Today’s question comes from Ganesh Kumar, one of 11,000+ students taking my User Experience Design Fundamentals course on Udemy.

Q: If I am not wrong, interaction design is where we make decisions like what happens when user clicks on a button, e.g. should it launch a new window or take the user to another page etc. Isn’t that the navigation as well? I am very confused on these two elements, could you please clarify?

A: Thanks for the great question Ganesh, and it’s one that gets asked more often than you think. If you haven’t done so yet, read through the similar question here on interaction design vs. interface design, as it’s related and may help. Here’s the short answer to the difference between Navigation Design and Interaction Design:

When I talk about Navigation Design, I am not talking about interaction, or even the interface. Navigation design is the conceptual model of how information is structured and organized, and how the user will get to all of it. Categories, subcategories and links between them.

Navigation design can be done on a piece of paper or with a text-only outline in Microsoft Word — because the only things you’re trying to figure out are:

  1. How much content (or workflow steps) do we have,
  2. How should it all be organized, and
  3. How is it all related?

So in terms of your question, think of it like this:

How a navigation menu behaves when someone
interacts with it is Interaction Design.

more  

  Tips & Advice

4 Tips for Adding Lean UX to an Agile Development Process

As organizations of all shapes and sizes come to grips with the fact that UX is critical to project and product success, a common question resurfaces time and again:

“How do we add Lean UX practices to our current process?”

When I hear this question, I know that what’s really being expressed is concern, and in some cases, fear. What they really want to know is how can we do this without screwing up the way we do things now? In some cases, that’s a legitimate fear. Companies whose agile development processes are well-managed and well-executed are understandably reluctant to add anything new to the mix. Any change brings difficulty, and the simple fact is that there is no way to add Lean UX to company culture or process without experiencing some bumps in the road.

That said, there is most definitely a way to minimize the disruption and get past those speed bumps quickly. Adding Lean UX practices into an agile process successfully can be a complex process, and the specifics change depending on the organization, the project and the deadline. However, in my experience the are are 4 truths, 4 pieces of advice that apply to any situation.

1) Hire experienced UX analysts and designers; you need at least one experienced, senior UX member capable of sharing the driving. 

Ideally, they need to be part of your team as early in the process as possible. Meaning when you’re scoping the project, they’re at the table. They should be sitting side-by-side

more  

  Tips & Advice

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

Blue for hyperlinks in UI 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

more  

  Tips & Advice

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

more  

  Tips & Advice

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