I'm designing 'sad path' scenarios for checkout and I'm trying to design for helping customers when a connection timeout occurs when the checkout hangs trying to connect to our 3rd party credit card payment form.

When this happens the credit payment form could not get loaded in our checkout environment.

A simple solution is to reload the page.

The UX/UI solution I'm putting forward is an alert message that appears on the page and asks the customer to reload the page.

This is my attempt at making the error message more 'user-friendly':

A connection error occurred

An error occurred when we were trying to connect to the system.

Please reload the page to try connecting again.

[ Reload page ] <--- button

How do people feel about the above message? Any other solutions you can think of?


  • Here's a less technical version of the alert message: # We're having problems loading this page The system has encountered a temporary error and is taking too long to load. Please reload this page to try again. [Reload] <--- button
    – Oly
    Dec 4, 2019 at 3:03

1 Answer 1


Your message is probably sufficient, though depending on your brand tone and voice you might consider giving it a little personality.

More importantly, if they can actually DO anything about it - such as clearing their caches, checking their connections, checking uptime status of your services, just waiting five minutes, etc. - tell them what those options are. There's nothing worse than being dead-ended repeatedly and having no recourse; it leads to abandonment and bad juju if people are confronted with repeated errors, not enough info, and no way to progress.

I don't know how often you expect people to encounter this issue, but if it's something that might happen more than once during a session to a user, you also might consider including a "Contact us if this keeps happening" type of button, for the same reason.

If you don't think it's likely to happen much, you could display any Contact Us and/or "How to fix this/what to expect" information only if it happens a second time in the same session.

Also, is this a server-side or client-side timeout? For the geeky sorts it might do to include the error code somewhere, and perhaps a little more detail about the error, and it might help inform what actions you propose they take to fix things (or at least what to expect).

Hope that helps a little!

  • 1
    Thanks for this detailed reply :) this is a server-side timeout as we have little control of the 3rd party payment gateway. I like the solution message (e.g. check connection, check uptime etc), probably won't do it for the MVP but will add more error handling as we go. Error code is a bit too geeky for our customer base.
    – Oly
    Dec 11, 2019 at 23:35

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.