Skip to end of metadata
Go to start of metadata

Catching the errors

Most of the smaller errors users make while inputing text, or interacting with some other input type elements (Selects, Radio Buttons, ...) can be caught as the users are interacting with those.

Input elements should have realtime (On Key Press) check is everything in order or not. If an error is detected, a flag is dropped underneath the element that's in error state, and it stays there until the error is cleared. It's important to note that the error flag which appears underneath the input element doesn't cause a bump in the UI (it doesn't push content downward), rather it floats on top even if it obscures an element that's underneath it.

VS Code Standard

Of course, none of this is new, it's simply what VS Code does already for inline error handling. Here's the full interaction pattern:

  • No labels