51

Option 2 leaves the modified content in place and visible. It means that your users don't have to recall the data they just submitted / modified. Inline notification (Option 2): Does not make the user recall/remember the data. Keeps the modified data visible, allowing the user to catch any mistakes they may have made Keeps the state indicator ('Saved') in ...


25

Option 2 is better, as discussed by Mike M. I would actually recommend a third option, similar to Option 2. I would replace the "Submit" and "Cancel" buttons with the "Saving" message and spinner. This ensures the first thing the user sees is the "Saving" message. When a user presses the button, their eyes will linger there until something else catches their ...


10

What I've found works best for my use case is to, like @Hugo-Viallon suggests, put the spinner in the save button and disable all other buttons. After completion I show a toast if the user isn't redirected. Without the toast I had users saving multiple times just to make sure it worked, a small confirmation helped prevent that. jsfiddle


6

Users that have no access to a page should not be able to click at it at all. If you let a user click on a button only tell them later that they have no access to its content it can make them frustrated or trust the design less. Some suggestions: I would recommend making the tabs look like a process (maybe with arrows) or at least name them 1. Process one ...


5

Absolutely! And I despise any article of any kind that doesn't have one. Once, I spent several hours delving into a method for software development. After really getting into the work, I was Googling and, only then, found out that the article was far outdated and no longer usable. Not dating a technical article, to me, is a technical blunder. The publisher ...


4

You could have a variant of Option 2 : The loading could be put on the "Save" button, as a spinner that'll replace its text. You also disable buttons. This way you show that something is happening, and the spinner being on what was the "Save" button tells the user that something is happening. The other buttons being greyed out make it even more obvious ...


4

Instead of looking for the kind of store or establishment, what can be helpful is to search the activity type: Leisure Free time Entertainment


3

If the text field can contain more than a very few words, then better not hide it, and better not make it unselectable either. It's very annoying if I fill out a large text/comment field, hit submit, the saving icon is animating, animating, animating, then the connection drops or some other error occurs. If my screen wasn't hidden, I could at least select ...


3

Is it possible you can prevent them from trying to initiate the process to start with, so they don't encounter a dialog? Ideally, if the system can be aware of what jobs are running, you could have indicators, such as a disabled button in the main view, and explain why the job can't be run by them at this time. This way they see the system status and ...


3

You're correct to think that it may be misunderstood. In cases such as these, adding a little bit extra to the label can help clarify the intent. The word "through" (or the informal abbreviation "thru") hints towards being inclusive of the date entered. In addition, to address the issue of ambiguity with dates entered via input fields, I'd suggest ...


2

To me, greyed-out list items mean those that are "of little interest" - in context that would mean references that are currently unused. You already have padlocks to indicate non-actionable items, whether or not they're used. Unlocked references should be removable. Consider how modern VS handles this - references are removable, regardless of whether or not ...


2

I'd say this is a case where you want to reduce complexity for the user. The goal of you chatbots is to help them find answers to their questions in a 'human' way: they can talk to the system as if it were a human and it replies in more or less the same way. Now, what you're doing with those multiple chatbots is breaking that illusion: you make it very ...


2

First of all, I agree with Guillaume that the second option is cleaner. Making the user tell you where they got their code before they even enter it is confusing, and honestly a step they should not have to deal with - your system should just recognize where they came from. Making them put that in is putting burden on the user rather than the system, not a ...


2

I think you can show status "Saving" under the text field when a user clicks Enter button or change cursor focus on another element. If user leaves the page just do autosave of last unsaved data. It shouldn't be too complicated.


2

As you pointed out there are different icons used in different apps. This makes is difficult to pinpoint a universally understood standard. I remember Jakob Nielsen saying "Users spent most of their time on other websites". With this in mind, here is what I would do: Identify the target user group for the app you are designing for and Understand which ...


2

One approach is to add additional messaging around the state but utilize the single control. A lightweight approach is to use subtle text to denote the override. Note: In all the images below, the proposal is to use a single control. Two states of the same control are represented. If it's important when scanning the form to know which form inputs use ...


2

While the override checkbox works - I would consider another design option where you don't use an override checkbox at all and rather have the text enabled as opposed to read only and add a button that says "Reset to default" or "Reset to original" (either use text or an icon to display this option). For the email field, I would suggest not using the ...


2

Side note The best way of editing something is to have a master label edit button on that page or a trigger that takes the user to edit mode. Solution Since you have added a constraint to the problem statement, this is what I can think of. In the provided design, I see there is a visual cue for the input read-only state i.e the grey background. The ...


2

This behaviour is similar with the permissions one in the mobile apps. When an app is asking for a permission and they direct you to the apps permissions page to approve a permissions for an app. As a user, I'm always annoyed that I have to find my way to activate that permission. I understand why the mobile OS is not allowing permissions changes from ...


1

The way I see this working is: Download app from AppStore. Long-press (or double press) an existent button to enable Bluetooth discovery. I don't think you need an extra button only for Bluetooth function. Connect via Bluetooth to set up the device and do the wi-fi connection in the App via Bluetooth and save the configuration. Here is a good video example ...


1

Structurally your form should be a single column, nothing should be side by side. Also labels should always sit on top of the inputs, instead of next to them. The reason behind this it is that we read left to right and then top to bottom, that is different in other parts of the world though. Also make sure the spacing between the label and the ...


1

Please have a look at this article. https://uxplanet.org/the-18-must-do-principles-in-the-form-design-fe89d0127c92 You should not have inputs one next to the other. You should place duration below description for a logical user flow.


1

Yes. Mid-fi is where you start getting closer to the product/website design vision without going into pixel-perfect detail (hifi). It's a good place to start showing an example of what kind of images will support the design.


1

Your main ( top ) search bar is already established as a search for certain things. These things can differ depending on what kind of website you created but I'm sure your users are aware of what kind of results they can expect when they write something into it. Bringing a new search result dataset into it would only smudge the good results that the users ...


1

Developer here. Modern C++ uses a single quotation mark as a separator. Not that long numbers in any base are readable. They are just strings of characters to a human. If you insist on displaying the number as a whole then I'd suggest using a fixed width font. Then the user can just compare the length and look for the first differing digit when comparing ...


1

How is it useful to display this information? What is the context, can you give us a little bit more information? Use abbreviation for large numbers: Names of large numbers If you want to display a string of code, depending on the users need, you can: a) Truncate the string b) Truncate the string and show it on rollover (progressive disclosure)


1

"Valid to" can be interpreted both ways, but "valid through" is clearer. See https://english.stackexchange.com/a/199268/36824 When it comes to expiration dates (without time of day), the best (?) way to implement a validation test is to compare with the day after the expiration date: if (testDate < expirationDate + 1) Otherwise you would have to add "...


1

(1) Ellipses + read more This will create confusion as the entire is ideally clickable. Also, read more usually shows the full content in the current view (according to common patterns). (2) Ellipsis + tooltip I will not advise the usage of tooltip since once users already know what it does it will become redundant having it on each column. (3) Just make ...


1

Is it a web app or a mobile app? Either way, on mobile phones in portrait orientation it is abnormal and inconsiderate to reserve so much screen real estate for a fixed menu. In landscape it might work, but generally and as James Coyle says, a side-navigation can typically be hidden from view with a toggle. Tabs and Bottom Navigation work well in portrait ...


1

Id generally say if the side nav is more than a third of the screen width it should be toggleable or modal. It really depends on the content of your app and how important the navigation is.


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