I have a scenario where the user needs to test a connection by clicking on a button. Once clicked, they will be provided one of the follow results: successful (check mark icon) and failed (red x icon) which will be followed by "Test connection successful" or "Test connection failed" Now, aside from telling the user that their test connection failed, I will also need to supply them additional information such as the reason it failed and how they can resolve.

The reason can be quite a exhaustive, generally 1-4 sentences. Without showing it on the UI directly, what is the best way to convey the message? My ideas are:

  1. User can hover the icon which would show a hover balloon with the reason for failure. I am a bit undecided on this because it is not entire clear to user that they must hover over this icon to get more insights.

  2. Add 'why?' next to the 'failed connection' string and user can hover which will show a hover balloon with more insights.

Of the two, which is better? If neither, what are your suggestions?

1 Answer 1


You could try the progressive disclosure pattern:

With a progressive disclosure control, users can show or hide additional information including data, options, or commands. Progressive disclosure promotes simplicity by focusing on the essential, yet revealing additional detail as needed.

enter image description here

An example of similar usage is:
enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.