Hot answers tagged

63

Many ways to perform the same action is fine Just make sure they don't get in the way of the most important task at hand. No two users are created equal Anyone who has done usability testing knows that each person has their own unique workflow. It is good to accommodate each individual style and workflow. Andrew Martin correctly points out in the ...


27

Having two fonts, one for headers and one for body text, is generally accepted. Do not use more than two fonts. Three's a crowd. What's important for you is to create visual hierarchy. You can do this by having contrast between font size, weight and color for your header and body text. If you find that using one font for both is not creating enough contrast ...


26

I've seen chevrons become popular for things like this. Big fat areas that are easy to press, along side footers with an ellipse. Pretty familiar symbols that imply expandable content without having to read.


24

I think simply "Goal not met" seems fairly straight forward, BUT, an even better user experience would be using that space to give information on how to achieve the goal. Like so: Now instead of telling the user that they don't have the trophy they will know how to get it. You can simply put the entire goal "take 2000 steps in one day" or make it dynamic ...


16

"show more" link (near the bottom) The easiest and clearest way to do this is with a clearly labeled link... show more If the link is there then I know there is stuff not showing. "expand card / collapse card" link (in the upper right corner) If you think your users will want to both show and hide the additional content then make sure the link to do ...


15

Bottom navigation works well on Apple devices but not recommended for Android because of the system buttons. Dear Google, it is nice but I insist that the bottom navigation does not work well on Android devices because of the system buttons. When I ask about 15 Instagram users on Android devices, they declared that they often click on system buttons ...


13

Following the great work of Anders Taxboe who has categorized different types of UI elements in a classification which is easy to understand and easy to follow. At the very highest level he uses the following labels. It may look odd in the beginning, but going through each category, it makes the UI Design World quite understandable: Reference: UI ...


13

You should avoid using two different fonts for the following reasons: You create unnecessary contrast, which creates clutter. The visual hierarchy is already established by the difference in font size and weight. Reading with one font is faster than reading with two different fonts, a phenomenon called Font tuning: Font tuning (FT) occurs when observers ...


12

There is consensus within the research community and practicing UX professionals that color definitely has an impact on how a site or application is perceived by the user (paper discussing design factors). The Society for Technical Communications published an article in 2011 entitled Color Matters: Color as Trustworthiness Cue in Web Sites. It's likely the ...


11

This is common practice so this is acceptable. you can see on youtube when browsing a video/channel you can decide to unsubscribe on the spot. Also when managing your subscriptions.


11

The Apple Human Interface Guidelines are 'Guidelines', not 'rules' - you don't have to follow them entirely, design and build what you like.


8

No, it's not always necessary. System-defined screens are not obligatory, and there is no need to reproduce clone pages/elements with minor changes. Alternatives to hi-fi prototypes are lo-fi wireframes, user journey maps, PRDs. Yes, paper sketches/prototypes are legitimate prototypes if they are detailed enough and capture/highlight on all important parts. ...


8

While multiple paths to do something might be convenient, this has a flip side. Consider the PCB design software I'm using. The image below shows two of many ways to add a new schematic document to the current project: As many other features are also accessible from multiple places, the amount of buttons and menus in the software is enormous. If options ...


8

Quite an user experience question, where technology development had to adapt to real life experience, in this case the inventor's wife experience The standard, ISO 9564-1, allows for PINs from four up to twelve digits. The inventor of the ATM, John Shepherd-Barron, had at first envisioned a six-digit numeric code, but his wife could only remember ...


6

Yes, it's a good practice. While you can display a Floating Action Button in order to facilitate a primary action, this doesn't mean it must be showed in all sections. I mean, if you are on a Bottom Bar section, you can display a Floating Action Button for one action. Then, if you navigate into other Bottom Bar section, you could change the primary action ...


6

It is definitely common with both designs using a combination of typefaces (typically 2; one for headers and one for body) , and sometimes only 1 typeface. I can't say I have found specific research pointing whether one is better than the other, I guess it depends on the style you are trying to convey (the brand image of the company might play an important ...


6

Empty States What you're referring to is known in the software world as an "empty state". It can be just like it sounds: empty. But if you're smart, it becomes a delightful training tool. The idea is to have a state in your app that detects the absence of content and fill it with something helpful or delightful for the user. Doing empty right means you'...


5

You could just use two adjacent buttons: download bmml source – Wireframes created with Balsamiq Mockups So, first, consider why you want to use a momentary-switch-equivalent. These switches have been designed in the real world, primarily to stop two opposing actions from being performed simultaneously (e.g. turn off/on, move left-right, etc.). They ...


5

What a system finds "critical" and what a user finds "critical" are not always the same. A user may have disabled notifications for many reasons. The system's importance may be lower than it thinks it is. The user might not be using the system anymore. The user might be on vacation. One approach that could solve this particular problem is to allow ...


5

Typically, the top performing apps have shorter (branded) titles The average for the top 200 free apps are: 26 characters 4.5 words But it probably doesn't matter App title length – if penalized at all by Apple, is easily offset by increased downloads or other variables weighted by Apple’s app store algorithm. It is up to the publisher/...


4

"How do I do clustering on a map correctly" is a common question in mapping applications. Short answer: Clustering doesn't work. There is no such thing as good clustering UX, as clustering is not good UX. The reason is simple: The user is either interested in an area, or a point. He might be interested in the density of an area (population, number of ice ...


4

You could frame it as 'Achievement available' which is more positive language which encourages the user to try and unlock it.


4

Guidelines are guidelines. If you follow the guidelines, you are leveraging the platform's consistency. This reduces the cognitive load for your users because they already have an innate understanding of how to use your app, and because your app is more likely to feel like it fits along with everything else on their phone. If you choose not to follow ...


4

To answer your question, which I believe that you have already.. Yes, definitely use the app title at first for the top bar and switch it out for the page once the user has gone deeper into the app. Reasons why: If they aren't in a page we need a "placeholder" so they know where to expect an indication of their location inside the app (hopefully not, but "...


4

Material design can be considered to be a standard when it comes to anything on Android app design. Material design on capitalization: Use sentence-style caps for all titles, headings, labels, menu items – any place that considered for “Title-Style Caps.”


4

It is alright to expand certain content, but provide enough information of what is hidden. Right now the user won't know what the button does/displays until he clicks it. Take this Material design - expansion panels example. There is certain information displayed when it is collapsed that shows us what is the hidden information about: Maybe something like ...


4

I think one could make an argument that it leads to too much visual weight being in the bottom of the screen in cases of having software nav buttons. But there's nothing about it that's inconsistent with material design specs. My go to example of this being done would be the Google + app.


4

Is it better to show the text along the Icons? (I thought it would get too chaotic if too much information is presented at once, like "less is more") Check more information about this subject here: When to use icons vs. icons with text vs. just text links? Basically a user’s understanding of an icon is based on previous experience. Due to the absence of a ...


4

Always use labels for your icons if you can. This greatly helps icon usability. Here's a snippet of an article by the Nielson Norman Group on icon usability. A user’s understanding of an icon is based on previous experience. Due to the absence of a standard usage for most icons, text labels are necessary to communicate the meaning and reduce ...


4

To me (not a designer by trade, but I've done some) MaaxRounded adds nothing when compared to the all-Roboto version (but the body looks very loose in MaaxRounded). With the contrast in size and weight, spotting the difference in font between the header and body is -- to quote your own example -- nitpixeling. Compare "InVision" in the title and body of the ...


Only top voted, non community-wiki answers of a minimum length are eligible